C# WinUI3 で［プロパティ ‘Content’ が複数回設定されています］が表示される場合の対処法

C# WinUI 3アプリを作っていく途中で、調べたことを忘録的に投稿します。今回はWinUI3プロジェクトで、［Button］コントロールに［FontIcon］と［TextBlock］などのテキストとアイコン（イメージ）を追加した際に［プロパティ ‘Content’ が複数回設定されています］エラーが表示される場合の対処法です。

プロパティ ‘Content’ が複数回設定されています

［Button］コントロールにテキストを表示したい場合には、タグ内に文字列を入力するか［TextBlock］コントロールを追加して［Text］プロパティを設定します。

<Button Width="80" Height="80">再生</Button>
-- or --
<Button Width="80" Height="80">
  <TextBlock Text="再生" />
</Button>

［AppBarButton］コントロールのようにアイコン（イメージ）を追加するために［FontIcon］コントロールを追加すると

<Button Width="80" Height="80">
  <FontIcon FontFamily="Segoe MDL2 Assets" Glyph="&#xE768;"/>
  <TextBlock Text="再生" />
</Button>

［プロパティ ‘Content’ が複数回設定されています］エラーが発生してしまいます。

［StackPanel］コントロールに追加

［Button］コントロールに［StackPanel］を追加してから［FontIcon］と［TextBlock］コントロールを追加するとエラーを回避できます。

<Button Width="80" Height="80" Click="Button_Click">
  <StackPanel>
    <FontIcon Name="ButtonIcon" FontFamily="Segoe MDL2 Assets" Glyph="&#xE768;"/>
    <TextBlock Name="ButtonText" Text="再生" />
  </StackPanel>
</Button>

実行すると、こんな感じで［Button］コントロールにアイコンとテキストが表示されます。

追加したアイコンやテキストにC#コードからアクセスしたい場合には、各コントロールに名前を追加しておきます。

イベントプロシージャーからアクセスする場合［sender］引数から次のコードで取得や設定が可能です。

private void Button_Click(object sender, RoutedEventArgs e)
{
  Button btn = sender as Button;
  FontIcon btnIcon = btn.FindName("ButtonIcon") as FontIcon;
  TextBlock btnText = btn.FindName("ButtonText") as TextBlock;
  btnIcon.Glyph = "\xE769";
  btnText .Text = "停止";
}

実行して、［Button］コントロールをクリックすると、アイコン（イメージ）とテキストが変更されます。

まとめ

今回は短い記事ですが、Visual StudioのWinUI3プロジェクトで［Button］コントロールにアイコン（イメージ）とテキストを表示するための［TextBlock］や［FontIcon］コントロールを追加した場合に［プロパティ ‘Content’ が複数回設定されています］エラーが表示される場合の対処法について紹介しました。

WinUI 3アプリでアイコン（イメージ）付きのボタンを表示したい人の参考になれば幸いです。

スポンサーリンク

最後までご覧いただき、ありがとうございます。