【Windows App SDK】NavigationView にアイコンを表示する

この記事の補足です。

blog.takunology.jp

チュートリアルによると、アイコンは String 型で定義されているので、なんかいい感じに変換してアイコンを出力しているのかと思っていた。

が、実際にこれをデータバインディングで実装すると、型変換ミスでエラーになる。なんか、これでもかというレベルで例外をスローしてきてキレそう。

大量の文字列の中からそれっぽいエラーをさがしてみると、見つけた。

The value cannot be converted to type IconElement

どうやらアイコン自体は IconElement という型になっているらしい。（ぜんぜん String じゃないやんけ！）なので、このように変更。

using Microsoft.UI.Xaml.Controls;

public class NavViewCategory
{
    public String Name { get; set; }
    public IconElement CategoryIcon { get; set; }
    public ObservableCollection<NavViewCategory> Children { get; set; }
}

で、アイコンのプロパティへの代入は SymbolIcon クラスを利用してこのようにする。

new NavViewCategory(){ Name = "ホーム",  CategoryIcon = new SymbolIcon(Symbol.Home)}

ちなみに、アイコンの種類に関しては Symbol 列挙体に色々あるので参考にしてみるといいかも。

上記のコレクションで実行してみるとこんな感じ。あとは好きなだけ要素を増やしていけば良さそう。