NetworkManagerアプレットアイコン(Cinnamon DE)を検索または置換しますか?

NetworkManagerアプレットアイコン(Cinnamon DE)を検索または置換しますか?

tl;dr - NetworkManagerアプレットでどのアイコンを使用してカスタムアイコンに置き換えることができるかを確認するにはどうすればよいですか?

一般化する

私のホームパネル/タスクバー/システムトレイエリア(OSのインストール時にそこにあります)にNetworkManagerアプレットがあり、複数のVPN接続を追加しました。接続するとすべてがうまくいきますが、デフォルトのアイコンが気に入らず、暗い背景からより顕著なアイコンに変更したいと思いました。明るい緑(VPN)とマゼンタ(有線/非VPN)のカスタムアイコンに置き換えるためにどのアイコンが使用されているかを見つけようとしましたが、成功しませんでした。

以下は、交換したい基本アイコンのスクリーンショットです。 ネットワーク管理者アイコン

システムの詳細

私は複数のコンピュータ/パーティションを持っており、複数のディストリビューションでこれを試しました。関連するすべてのディストリビューションで同じテーマ設定と同じDEを使用します。

DE:Cinnamon(すべてのバージョンで同じ)

私のディストリビューションの1つでテストできてうれしいです。しかし、Fedoraに書いたので:

$ uname -r
5.9.11-200.fc33.x86_64

$ dnf list NetworkManager|grep NetworkManager
NetworkManager.x86_64                  1:1.26.4-1.fc33                  @updates

$ dnf list cinn*|grep -P '^cinnamon\.x|menus\.x'
cinnamon.x86_64                                  4.6.7-1.fc33          @anaconda
cinnamon-menus.x86_64                            4.6.1-2.fc33          @anaconda

他の情報が必要な場合はお知らせください。

今まで試したこと

  • ほとんどのシステムアイコンがどこにあるかを知っています/usr/share/icons。ここでnemoファイルマネージャを開き、似たようなファイルマネージャを見つけようと手動で見回しましたが、目で確認する必要があるか、何かが抜けました。一つあるたくさん世界には写真が多くて「network*」や「nm-*」で始めることに注意を払っても簡単に見逃せます。

  • 上記の方法で見つけたと思いましたが、/usr/share/icons/Mint-Y/status/symbolic/status-nm-device-wired-secure-symbolic.svgカラーコードを緑色(sudo sed -Ei "s/(bebebe|d3dae3)/00994c/g" status-nm-device-wired-secure-symbolic.svg)に変更してコンピュータを再起動しても、アプレットはまだ古い色です。詳細な調査の結果、このディレクトリには一般/非VPN有線接続アイコンのように見えるものが含まれていないことがわかりました。

  • いくつかのオンライン検索で私を見つけました。アイコンがどこから来たのかを調べるために、テキストエディタで開いてみました。使用された多くの規則(nixが名前/ラベルをアイコンファイルパスとして解決する方法を含む)を完全に理解していないことを認めます。だから私は本質的にタグを探しており、タグが 。/usr/share/cinnamon/applets/[email protected]/applet.js/usr/share/icons

  • 別のインジケータアイコンアプレットがあることを知っています。私はこれを使用しないことをお勧めします。特に、すでにアイコンがある場合は、重複して制限された画面スペースを無駄にするようです。

答え1

ついに気づいた!少なくともある程度は…完全に理解できない部分が多く、最終色を正しく作るのが少し難しいです。しかし、それは変更でき、Cinnamonを実行している2つの異なるディストリビューション(Fedora 33とMint 19.3)で動作することを確認しました。より良い知識を持つ誰かが空白を埋めるか、より良い答えを投稿したい場合は、必ずそうしてください。

警告:このプロセスは、初心者/技術的背景が不足している人にとっては高度なレベルになる可能性があります。プログラミングは必要ありませんが、上級ユーザー/調整者を対象としています。危険を冒して「保証の無効化」を気にしない場合;-) ...最後の部分には、スクリーンショットからアイコンを取得するために使用したコマンドが含まれています。

有線およびVPN接続のためのカラフルなNetworkManagerアイコン

この答えは、Cinnamon DEのAdwaitaアイコンテーマにNetworkManagerアイコンを変更することに制限します。私は怠惰で、アプレット/ステータス/パネルサイズ/アイコンテーマ/の非常に多くの多くの組み合わせなど、すべてをテストしたくありません。デスクトップ環境/バージョン/解像度/リリース/など。

依存関係:

  • 変換ツール(cli)またはPinta / Krita / Gimp /その他のツール用のImageMagick(GUIで実行したい場合)
  • Gpick(オプションですが、表示されているパネルアイコンの正確な色を簡単に識別できます)

概要:

  • アイコンテーマがどのようにやり取りするかについての基本的な理解が必要です。注目すべき重要な点は、Linux / Gnome / GTKが複数のフォルダを確認し、すべてのフォルダから複数のテーマに戻るfreedesktop標準に従うことです。ここでは扱いませんが、この投稿きれいに覆います。私の目的に合わせて、システムパス/usr/share/iconsとユーザーパスにのみ焦点を当てます~/.local/share/icons。興味のあるアイコンの名前がわかっている場合は、GTK APIを呼び出してシステムがそれをファイルパスに解決する方法を確認できます。アイコン名を引数として受け取り、この照会を実行する非常に便利なPythonスクリプトもあります。見つけることができます。この記事では——直接作成した修正が含まれています。

  • (少なくとも理論的には)アイコンをどこで、どのように選択するのか、そしてアイコンのファイルパスを見つける方法を知ったので、次のことを知る必要があります。アイコンの名前は何ですか?アプレットで使用されるアプレットとそれを使用するアプレット。この部分も少し難しいですね。デフォルトでは、これはアプレットコードで定義されています。 Cinnamon DEの場合は、以下に対応するアプレットを見つけることができます/usr/share/cinnamon/applets。たとえJavascriptで書かれていますが、文書は少し古く、見つけるのは難しいです。しかし、アイコン名を見つけるために実際にアプレットコードの詳細を知る必要はありません。アイコン名を含むファイルを見ることができますが、metadata.json興奮する前にこれはCinnamon Spices / Applet Download GUIで使用されるアイコンを指定します。いいえシステムトレイのアプレットが使用する実際のアイコン。前述したように、実際のアイコン名はアプレットのソースコードで定義されます。 CinnamonのNetworkManagerアプレットの場合は、OPで言及されています。アイコンの検索を開始すると、さまざまなWi-Fiステータス、オフライン/接続切断/接続ステータス、およびデバイスタイプ(Wi-Fi、有線、VPN、セルラー/ブロードバンド/その他)の多数のアイコン名が表示されます。他のアプレットははるかに簡単かもしれませんが、アプレットによって異なります。このアプレットのデフォルトのアイコン名のほとんどは、私のコピーの2205行から始まる関数で定義されています。その後、上記のPythonスクリプトにそれを挿入していくつかのパスを取得できます。/usr/share/cinnamon/applets/[email protected]/applet.js_updateIconget-icon-path.py network-vpn

  • 今、長い間私を混乱させた別の部分があります。 Gnome/Gtk/Cinnamonには2つの基本タイプのアイコンがあります。フルカラーアイコンとも呼ばれる一般アイコンと、いわゆる「記号」アイコン(通常単色)があります。長い間、私は象徴的なものは100%白黒で、無色だと思っていましたが、実際にはそうではありませんでした。私はまた、カラーシステムトレイアイコンを取得する唯一の方法は、カスタムCSSファイル/ JavaScriptの調整の世界に飛び込み、私のテーマを大幅に修正することだと誤って信じていました。これはより良い結果を生み出すと確信していますが、オペレーティングシステムのテーマコースを聞いたり、それでキャリアを築くことはしたくありません。いくつかの基本色を変更し、より大きく、より良いものに進みたいだけです。したがって、アイコンを検索すると実際にget-icon-path.py network-vpnAND matchが表示されますget-icon-path.py network-vpn-symbolic。私は他のものの上に使用するすべてのシナリオを完全に理解していません。 freedesktop.org/Gnomeのドキュメントをよく読む必要があるようです。ただし、変更については、network-vpn-symbolicアイコンnetwork-wired-symbolic(および一部の中間/エラー状態)をカスタマイズしました。

  • 変更したい正確なアイコンファイルを特定したら、以下からコピーの作成に進むことができます~/.local/share/icons/<theme>。私が知る限り、<theme>それはですAdwaita。また、「パネル設定」はここでは重要ではないかもしれません。私のパネルの高さが「32」、記号アイコンのサイズが「28px」と表示されています(重要な場合、私の解像度は1920x1080です)。私はこれがアイコンサイズに影響を与え、より大きなアイコンサイズと拡張可能なsvgベクトル画像を見つけるのに多くの時間を無駄にするだろうと思いました。しかし、実際に私に効果があったのは、Webワイヤ用の16x16 pngファイルでした。気まぐれなフォルダ。また、/usr/share/icons/Adwaita/16x16ネットワークVPNがなくても、他のアイコンの1つをサイズ変更して適切なフォルダに配置することで選択できることに気づきました。

  • 最後に、まだ完全に理解されていない部分は、最終表示される色がどのように設定されるかです。 OSにはpngアイコンファイルに保存した色を変更する中間スタイルがあるようですが、計算がいくつかのオフセットを追加/減算するほど単純ではないようです。ほとんど試行錯誤を経て現在の位置に到達しました。

私の設定

マイシステム設定/テーマ(参考用)

プロパティ Fedora 33 ミント19.3
シナモンバージョン v4.8.6-1 v4.4.8
ネットワーク管理者バージョン v1.26.6-1 v1.10.14
トピック: ウィンドウ枠 ミントカラー ミント-Y
テーマ:アイコン ミント-Y-ダーク-アクア ミント-Y
トピック: コントロール ミント-Y-ダーク-アクア ミント-Y
トピック:マウスポインタ アドビタ DMZ - ホワイト
テーマ:デスクトップ ミント-Y-ダーク-アクア ミントカラー

また、これらすべてがいくつかの段階でAdwaitaから継承されることがわかります。これが、Adwaitaが私の目標の最も低い共通分母である理由です。しかし、システムトレイの場合は、アイコンのテーマに基づいていると思います(確認されていません)。

$ cd /usr/share/icons
 
$ grep Inherit Mint-Y-Dark-Aqua/index.theme 
  Inherits=Mint-Y-Dark,Adwaita,gnome,hicolor
 
$ grep Inherit Mint-Y-Dark/index.theme 
  Inherits=Mint-Y,Adwaita,gnome,hicolor
 
$ grep Inherit Mint-Y/index.theme 
  Inherits=Adwaita,gnome,hicolor

カラーテーブル

前述のように、表示される最終アイコンの色は、アクセス方法がわからないOSの他のスタイル/テーマの影響を受けたり費やしたい金額を見つけるために、より多くの努力が必要です。私のような怠惰な人のために、ほとんどの基本的なCinnamonシステムで動作できるいくつかの値は次のとおりです。他のすべての人のために、以下でこれを達成するために使用した手順を簡単に説明します。自分で試してみてください。

pngファイルのImageMagick色 ディスプレイアイコンの色(gpickによる)
ディープサフラン #ff9933 濃い紫色#3d1660
スカイブルー #00fee1 明るいオレンジ色 #c8995e
赤 #ff0000 中緑 #4e9a06
グリーン#00ff00 オレンジ#f5793e
ブルー#0000ff クリムゾン #cc0000
ブラック#000000 ホワイト #ffffff
ホワイト #ffffff 黒? #111647
黄色 #ffff00 濃い紫色#441446
ピンク #ff00ff 中緑 #1b9c08
タンシェル? #0000ff クリムゾン #cb9ae5
金(金) 濃い紫色#452964
グレー(グレー) ライトパープル#890ca7
緑(緑) ライトオレンジ/ピンク#f9bb9e
タン(タン) グリーン#4ac21e
茶色(茶色) 金? #827014
ターコイズ(ターコイズ) オレンジ#c27b40
マゼンタ(マゼンタ) グリーン#1b9c08
シャルトルーズ #beef00 紫色#713691
濃い紫色#441446 オレンジ#c19367
水色#5294e2 明るい緑#92b372
ダークピンク#441446 ライトパープル#6253d2
ライトパープル#6253d2 明るい緑 #8ddb8f
ミディアムブルー#6689af 明るい緑#8fe085
ターコイズ色? #0f808f 赤#d22600
??? #ff0ff0 ダークグリーン#1da30b
??? ミディアムブルー #fa83ec
??? 水色#c490fd
??? 明るいオレンジ色 #f58049
??? 非常に薄い水色#cbf9f5

スクリーンショットで自分のアイコンを再作成

これは、2つの特定のネットワーク管理者アイコンに使用される実際のコマンドを示しています。これは有線デスクトップコンピュータにあるため、Wi-Fiがなく、VPNが接続されているかVPNなしでオンラインになっているかを一目で確認することに興味があります。私はすでに方法を見せてくれたから探すアイコンをクリックすると、上記のスクリーンショットで行った操作を再現する方法についてのみ説明します。

他のアイコンテーマがある場合は、~/.local/share/iconsテスト中に追加のコンテンツがクラッシュしないように名前を変更してください。後で再度移動またはマージできます。 (私にこのようなことが起こり、何が起こっているのかを理解するのに時間がかかりました。)mv ~/.local/share/icons ~/.local/share/icons.$(date +'%Y-%m-%d-%H%M%S').bak

# create directories
mkdir -p ~/.local/share/icons/Adwaita/16x16/devices;
mkdir -p ~/.local/share/icons/Adwaita/16x16/status;
 
# check what icons you have on your system
# for python script, see linked post above
get-icon-path.py network-vpn network-wired network-vpn-symbolic network-wired-symbolic
 
# OR alternately, you could run something like
# but this won't consider theme inheritance or user-folders
find /usr/share/icons/Adwaita /usr/share/icons/gnome \( -iname '*network-vpn*.png' -o -iname '*network-wired*.png' \) -not \( -iname '*acquir*' -o -iregex '.*/legacy/.*' -o -iname '*route*' -o -iname '*offline*' -o -iname '*disconnected*' \)|sort;
 
# recolor the default 16x16 network-wired icon
cd ~/.local/share/icons/Adwaita/16x16/devices;
f="/usr/share/icons/Adwaita/16x16/devices/network-wired-symbolic.symbolic.png";
c='cyan';convert "${f}" -fuzz 20% -fill ${c} +opaque none "$(basename "${f}")";
 
# no 16x16 icon is provided for network-vpn
# so recolor and resize the 64x64 network-vpn icon
cd ~/.local/share/icons/Adwaita/16x16/status;
f="/usr/share/icons/Adwaita/64x64/status/network-vpn-symbolic.symbolic.png";
c='#6689af';convert "${f}" -resize 16x16 -fuzz 20% -fill ${c} +opaque none "$(basename "${f}")";
 
# restart cinnamon desktop (or alternately, just log out then back in)
cinnamon --replace --clutter-display=:0 2> /dev/null &
 

アップデート:これまで、2つのMint 19.3インスタンスと1つのFedora 33インスタンスで上記のコマンドを問題なく実行しました。しかし、Mint 19.3の3番目のインスタンスでは、上記のアイコンが見つかりました(つまり、network-vpn-symbolic.symbolic.pngそこではなくnetwork-vpn.pngそこにあります)。この場合、前述のPythonスクリプトを使用してアイコン名を参照network-vpnし、network-vpn-symbolicシンボルがある場合は使用しない場合は一般名を使用することをお勧めします。 16x16サイズのデフォルトアイコンがある場合は、最初の変換コマンドを使用できます(-resizeを除く)。それ以外の場合は、最も高い解像度のデフォルトアイコン(通常は256、128、または64)を選択し、2番目の変換コマンド(-サイズ調整)。

アップデート2:また、get-icon-path.pyスクリプトがsshセッション(およびグラフィック以外のセッションでも可能)で正しく機能しないことに注意してください。クエリにはX11 /グラフィックセッションが必要なためです。

関連情報