Google Chromeを試してみませんか?ダウンロードはこちらから。
Top > テーマ > 作り方

テーマの作り方 Edit

Google Chrome のテーマ / スキンを作ってみよう。

バージョン3.0以降 Edit

テーマは特殊なChrome拡張として作成します。詳しくはDeveloper's Guideを参照。

バージョン2.0以前 Edit

テーマの切り替え機能が正式にサポートされていなかったので、リソースDLLを差し替える必要がありました。

必要なもの Edit

  • リソースコンパイラ (rc.exe)
    Visual C++ がインストールしてあれば入っているハズ。わざわざインストールしたくない、という人はコレが使えるかも。(未確認)
  • Resouce Hacker (ResHacker.exe)
    リソース DLL の書き換えに必要です。DLL をビルドするより楽です。ココからダウンロード。
  • TortoiseSVN
    レポジトリからチェックアウトする用事があるので。他にアテのある方は他の SVN クライアントでも OK です。ココからダウンロード。

手順 Edit

  1. 作業用フォルダを作る
    まずは適当にフォルダを作っておきます。
    C:\Documents and Settings\[ユーザー名]\Local Settings\Application Data\Google\Chrome\Application\0.2.149.27\Themes\default.dll
    テーマのリソース DLL ですが、今回は default.dll と同じフォルダに "resource" という名前のフォルダを作ることにします。
    step1.png
     
  2. default.dll をコピーしておく
    作成した resource フォルダにオリジナルの default.dll をコピーしておいてください。
     
  3. chromium.org の SVN レポジトリからテーマ関連のファイルをチェックアウト
    エクスプローラで作ったばかりの resource フォルダに移動し、右クリックして [SVN チェックアウト(K)...] を選びます。TortoiseSVN のダイアログが現れるので、[レポジトリのURL] に
    http://src.chromium.org/svn/trunk/src/chrome/app/theme/
    と入力して OK をクリックしてください。ダウンロードが開始されます。
    step2.png
     
  4. リソース DLL 生成用のバッチファイルを作る
    チェックアウトが完了したら、次はバッチファイルを書きます。リソーススクリプトのコンパイル、およびリソースの書き換えを自動化して、手間を省きます。ファイル名はなんでもよいのですが、今回は make.bat という名前で新しいファイルを作成し、テキストエディタで以下のように内容を編集して保存します。
    rc theme_resources.rc
    "C:\Program Files\Resource Hacker\ResHacker.exe" -modify default.dll, default.dll, theme_resources.RES , , , 
    rc.exe にパスが通ってなかったり、 Resource Hacker の場所が違う場合は適宜書き換えてください。theme_resources.rc がリソーススクリプトです。コイツをコンパイルしてやると theme_resources.RES が生成されます。コイツの中身を Resource Hacker のコマンドラインで default.dll に注入、という流れです。
    step3.png
     
  5. テーマを編集する
    あとは、画像を編集していくだけです。ファイル名から、ある程度画像と UI の対応部分が推測できると思います。resource フォルダで直接編集せずに、resource フォルダを丸ごとコピーして、そこで編集していくのがベターです。編集が一通り終わったら、先ほどの make.bat を実行して、default.dll を更新してください。
    step4.png
     
  6. テーマを適用して確認する
    default.dll を Themes フォルダの default.dll に上書きし、Google Chrome を起動してチェックしてみましょう。

ファイル一覧(書きかけ) Edit

リソース DLL 関連 Edit

theme_dll.vcprojVC++ 用のプロジェクト
theme_dll.vsprops
theme_resources.hヘッダファイル
theme_resources.rcリソーススクリプト

ウィンドウ関連 Edit

window_bottom_center.png通常アクティブウィンドウの外枠
window_bottom_left_corner.png
window_bottom_right_corner.png
window_left_side.png
window_right_side.png
window_top_center.png
window_top_left_corner.png
window_top_right_corner.png
window_bottom_center_otr.pngシークレットモードのアクティブウィンドウの外枠
window_bottom_left_corner_otr.png
window_bottom_right_corner_otr.png
window_left_side_otr.png
window_right_side_otr.png
window_top_center_otr.png
window_top_left_corner_otr.png
window_top_right_corner_otr.png
dewindow_bottom_center.png通常非アクティブウィンドウの外枠
dewindow_bottom_left_corner.png
dewindow_bottom_right_corner.png
dewindow_left_side.png
dewindow_right_side.png
dewindow_top_center.png
dewindow_top_left_corner.png
dewindow_top_right_corner.png
dewindow_bottom_center_otr.pngシークレットモードの非アクティブウィンドウの外枠
dewindow_bottom_left_corner_otr.png
dewindow_bottom_right_corner_otr.png
dewindow_left_side_otr.png
dewindow_right_side_otr.png
dewindow_top_center_otr.png
dewindow_top_left_corner_otr.png
dewindow_top_right_corner_otr.png
back.png戻るボタン
back_d.png
back_h.png
back_p.png

コメント Edit

  • 初心者です。手順4の後半が分からないのですが、詳しく説明していただけないでしょうか。theme_resources.rcには何を書けばいいのか、theme_resources.RESの中身をどうやってdefault.dllに注入するのかよく分かりません。教えてください。 -- 朝倉音姫? 2009-07-30 (木) 17:44:55
  • 何の上級者かは内緒です。詳しく説明するのは面倒です。 -- 上級者? 2009-12-16 (水) 14:27:35

URL B I U SIZE Black Maroon Green Olive Navy Purple Teal Gray Silver Red Lime Yellow Blue Fuchsia Aqua White

広告に関するプライバシーポリシー

添付ファイル: filestep4.png 204件 [詳細] filestep3.png 240件 [詳細] filestep2.png 268件 [詳細] filestep1.png 290件 [詳細]

リロード   新規 下位ページ作成 編集 凍結 差分 添付 コピー 名前変更   ホーム 一覧 検索 最終更新 バックアップ リンク元   ヘルプ   最終更新のRSS
Last-modified: Tue, 02 Feb 2010 05:06:47 JST (46d)