WINUI3 ボタンにアイコンとテキストを表示したい
解決したいこと
Windowsアプリを作成したいと考えており、C#、WinUI3、XAMLでGUIを作成しようと考えています。
Microsoft Storeからダウンロードした、WinUI 3 Galleryで参考となるコードを流用しようと思っていますが、ボタンで[アイコン＋文字列]という表現はどのようにすれば実現できるのでしょうか
↓下はドロップダウンリストですが、こういう感じのボタンにしたい
アイコンはMaterial Designをボタンに付けられるならつけたいですが、SEGOEのアイコンでも構いません。
アイコンを画像にしてしまえばできそうですが、それはできればしたくないです
アドバイス頂きたく、よろしくお願いいたします。
発生している問題・エラー
アイコンと[Click Me] はできるが、[アイコン Click Me]としたい、ができてない。
該当するソースコード
MainWindow.xaml
<?xml version="1.0" encoding="utf-8"?>
<Window
x:Class="App9.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:App9"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Title="App9">
<StackPanel Orientation="Horizontal" HorizontalAlignment="Center" VerticalAlignment="Center">
<Path Fill="White" Data="M7.5,5.6L5,7L6.4,4.5L5,2L7.5,3.4L10,2L8.6,4.5L10,7L7.5,5.6M19.5,15.4L22,14L20.6,16.5L22,19L19.5,17.6L17,19L18.4,16.5L17,14L19.5,15.4M22,2L20.6,4.5L22,7L19.5,5.6L17,7L18.4,4.5L17,2L19.5,3.4L22,2M13.34,12.78L15.78,10.34L13.66,8.22L11.22,10.66L13.34,12.78M14.37,7.29L16.71,9.63C17.1,10 17.1,10.65 16.71,11.04L5.04,22.71C4.65,23.1 4,23.1 3.63,22.71L1.29,20.37C0.9,20 0.9,19.35 1.29,18.96L12.96,7.29C13.35,6.9 14,6.9 14.37,7.29Z" />
<Button x:Name="myButton" Click="myButton_Click">Click Me</Button>
</StackPanel>
</Window>
XAMLは言語として登録されてなかったのでXMLにしてみました。
自分で試したこと
- 少し違いますが、こちらの記事が近いかと思い、少し修正して適用できないかと思いましたが、CONTENTが複数あります、というエラーが出てうまくいきませんでした
- アイコンの取得は下記を参考にしました。アイコンだけのボタンは上記のコードでは、
Click Meのところに<Path Fill="White" Data="M7.5,5.6L5,7L6.4,4.・・・ />を入れると実現できました
アイコンと文字列を両方入れると、'Content'が複数回設定されていますとなり動作しません
- fontfamily segoeであれば、WinUI 3 Galleryのiconographyで、アイコンに該当するtext glyph（UTF8？）＋文字列とすればいいのか？と思いましたが、一般のUTF8を参照するようで、segoeは見てもらえないようです
確かに該当するutf8は下記では空欄でした。
0
