スキップしてメイン コンテンツに移動

.NET MAUI svgファイルの色を変えてみた

んー・・・・
えるいーだーのMAUIへの移植進まないねぇ・・・
基本「明日になったら本気出す」の精神なので

まあ、ぼちぼちやってるのだけど、.NET MAUIって画面のアイコンやボタンのファイルはsvgファイルが推奨されていますな
で、まあそのファイルは基本的にはこんなところから持ってきてるわけです


Material Symbols and Icons - Google Fonts
Material Symbols are our newest icons consolidating over 2,500 glyphs in a single font file with a wide range of design variants.
 

↑グーグルがマテリアルデザイン用に使えるようにと公開しているわけです
ここから適当なアイコンを持ってきてアプリに組み込んでいるのだけど(MAUIはリソースとして使うときはアルファベットの大文字を使えないのでファイル名はダウンロードしたら変えなければいけない)
で、まあ白黒な訳です(まあ、タブのアイコンとして使うとシステムカラーに合わせてそれなりに色を付けてくれるけど)

 

んじゃあ、自分で色は付けられないのかと探してみたらあっさり見つかった


アプリ アイコンを変更する - .NET MAUI
MAUI アプリ アイコン the.NET 変更する方法について説明します。 アイコンは、ストア、ランチャー、アプリのショートカットなど、複数の場所でアプリを表すロゴです。
 

↑マイクロソフトのサイトでがっつり解説してる

上記のサイトだとiconで色々やってるけど別にimageでも同じように出来る
まずはダウンロードしてきたsvgファイルを「Resources /Images」フォルダに放り込んで
ビルドアクションを「MauiImage」に変更


xamlファイルで使いたいコントロールにそのsvgファイルを指定する
この例の場合だとイメージボタンだけど、その辺は適当にやってください
ファイル名は拡張子は「png」を指定する
え？何でか？
MAUIのルールなんですよ。そうしてください。
つーかsvgファイルはコンパイル時にpngファイルとして生成されてるので逆らってもいい事無いです。

<ImageButton Grid.Column="0" Grid.Row="5"
         Source="home.png"
         />

 

プロジェクトファイル(XXX.proj)を確認するとこんな感じで、svgファイルが読み込まれるようになっている

<ItemGroup>
   <MauiImage Include="Resources\Images\btn\home.svg" />
</ItemGroup>


↑こんな感じで表示されます
黒いね


で、じゃあこの線のところを赤くしてみる
TintColorというプロパティを指定する
「red」と指定したけどマイクロソフトのサイトだと数値指定しているし、透明度も指定出来るみたいだ

<ItemGroup>
   <MauiImage Include="Resources\Images\btn\home.svg" TintColor="red" />
</ItemGroup>

 

 ↑赤くなりました


背景も変えられるみたいで
Colorに「blue」を指定すると

<ItemGroup>
   <MauiImage Include="Resources\Images\btn\home.svg" TintColor="red" Color="blue" />
</ItemGroup>


↑背景が今度は青に


・・・・まあ、この機能を使うかどうかは微妙だけどね・・・

最初に紹介したマイクロソフトのサイトでもっと細かくやってるからそっちを見て色々やってみてください

 

ラベル:

コメント

コメントを投稿

このブログの人気の投稿

RAM DISKを使ってみた(使ったのはImDisk)

GWだし、まあちょっとラムディスクを入れてみました うちのPCはWindows11 使ったのはImDiskというRAM Disk。 まあ、この辺のインストールとかはあちこちで解説してる人がいるので適当にぐぐってくださいな で、とりあえずベンチマーク なかなかいいスピードだ で、大抵の人はブラウザのキャッシュをRAMディスクにするといいよ・・・と言うけど そもそもメインドライブがNVMeのSSDを使っている状態で、体感速度なんか上がらない(使い終わったキャッシュを再起動したら綺麗さっぱり捨て去ってくれるという利点はある)  うちで一番効果があるのは Adobe Audition というアプリ これが結構高速化する(キャッシュをちゃんとRAMディスクにしたら・・・だけど) ハイレゾ音源だと、1時間の音源が何かする度に4GBのファイルを作られてしまう なので、RAM DISKにすると、結構編集時間を短縮できる Premiere Rushも出力先をRam Diskにしておいて終わったら、SSDにコピーすると言う事をやるとかなりスピードアップになる 実はうちのPCは普段は99％のパワーで動作していて、CPUのターボブーストが掛からないようになっている 大体3.6GHz当たりで安定してるのだけど、これを100％にするとターボブースト機能がONになって一部のコアが4.5とか4.8GHzまで上がる まあ、毎回電源オプションをいじる事になるのだけどさ・・・ そうしてベンチを取ると こんな感じ とは言え、ブーストしてるからと行ってRam Diskのスピードの差を体感する事はさすがに無理 ・・・と言うかフォトショでもRAM DISKにしてよかった・・・と言うほど変わらない SSDの性能が上がってきたしもし次にPCを買い換えたらRAM DISKよりSSDの方が速いかもね  
コメントを投稿
続きを読む

ImDiskの後継アプリのAIM toolkitを試してみた

ImDiskの開発辞めちゃったらしい というわけで、じゃあ後継ソフトはあるのかと思ったらあった 遅いと言われているけど・・・ とインストールしてみた ImDiskのこの間の結果はこちら 再びRAM DISK(ImDisk)   blog.mazepin-led.com    そして今回のAIM Toolkit なんか、無茶苦茶遅くなってるな 下手するとSSDの方が速いじゃん CPUの使用状態はこんな感じ PIO転送なところは変わって無さそう まあ、遅いからと言ってその速度が体感できるのかというと出来ないんだけどね と思ったところで、なんか設定変えてみたらどうなるのだろう Allocate Memory Dynamicallyというのは、メモリを必要に応じてってことだからと思って以前試したことがあったけど、なんかImDiskのときは不安定だったんだよな  AdvancedのとこにあるUse AWE Physical Memoryというのが良くわからないけど、チェックしてみたら速くなった おお、大分速くなった。なったけど・・・・なんで？ これだとImDiskよりちょっと遅いくらいになるのか もしやQuickFormatととかでも変わるのか？と思ったけどそこまでやる気も無かったので放置。速くなるわけないよね。 後は圧縮とか、取り外しメディアとかだし。   最近の性能の良いSSDのおかげで RAM DISKというものの存在意義が薄れちゃったね まあそれでとにかく速度を稼ぎたいぜって人は SoftPerfect RamDiskでも使ってください 昔はPrimo Ramdisk使ってました。当時使ってたけどなかなか良かった。 当時SSD無茶苦茶高かったし。 今はほぼ無用になってしまったが・・・ 未だにスタンダード版は8GBまでなんだな キャッシュ領域にしたいなら大人しく余ってるSSDを使った方がいいんじゃ無いかって気がするけど  おしまい
コメントを投稿
続きを読む

.NET MAUIでスプラッシュスクリーン Android12で地獄を見る

まずは起動するところから・・・・  スプラッシュスクリーンだぬ マイクロソフトのサイト 見てると簡単そう(実際簡単で細かい事を気にしなければsvgファイルを用意して1行だけ書き換えておしまい)   なんかプロジェクトファイルに自動で記述されるらしい よし、プロジェクト作った                     つーか、もうスプラッシュがあるんだけど・・・・ そして自作のsvgファイル くうっ・・・デザインセンスない・・・・   それはともかく、このSVGファイルを Resources\Images　にドラッグ＆ドラッグ プロジェクトを右クリックして｢プロジェクトファイルの編集」 して、編集できるようになったプロジェクトファイルを 自分のプロジェクトファイルに書き換える <MauiSplashScreen Include="Resources\Splash\splash.svg" Color="#512BD4" BaseSize="168,168" /> ↓ <MauiSplashScreen Include="Resources\Splash\ splashtestmaui .svg" Color="#512BD4" BaseSize="168,168" />   とりあえずAndroidで実行 お、おう・・・・ まあ最初はこんなもんよね 最初に紹介したマイクロソフトのサイトでもBaseSizeを書き換えてくださいって言ってるし 言われたとおりに <MauiSplashScreen Include="Resources\Splash\splashtestmaui.svg" Color="#512BD4" BaseSize=" 320,600 " /> 書き換えてみると いい感じじゃーん じゃあアンドロイドのバージョン毎に試してみよう   Android 7 Android 11 Android 12 Android 13 ...
コメントを投稿
続きを読む