DataTriggerでTagを参照

前提・実現したいこと

WPFで、ボタンの中のEllipseの色をTagを参照して変更しようとした所、
MC3029 修飾型名がないため、'Tag'メンバーは無効です。のエラーメッセージが発生しました。

実現したいのは、同じStyleの複数のボタンの中の図形の色を、それぞれのボタンの異なるBindingしたフラグによって色を変える事。

発生している問題・エラーメッセージ

MC3029 修飾型名がないため、'Tag'メンバーは無効です。

該当のソースコード

        <Button  Content="TestPb" Tag="{Binding PBaFlag}">
            <Button.Template>
                <ControlTemplate TargetType="Button">
                    <Grid>
                        <StackPanel>
                            <Ellipse Height="100">
                                <Ellipse.Resources>
                                    <Style TargetType="Ellipse">
                                        <Setter Property="Fill" Value="Gray"/>
                                        <Style.Triggers>
                                            <DataTrigger Binding="{TemplateBinding Tag}" Value="赤丸">
                                                <Setter Property="Fill" Value="Red"/>
                                            </DataTrigger>
                                        </Style.Triggers>
                                    </Style>

                                </Ellipse.Resources>
                            </Ellipse>
                            <Rectangle Fill="Gray" Height="100"/>
                            <Label Content="{TemplateBinding Tag}"/>
                        </StackPanel>
                        <ContentPresenter HorizontalAlignment="Center"
                            VerticalAlignment="Center"/>
                    </Grid>
                </ControlTemplate>
            </Button.Template>
            <behaviors:Interaction.Triggers>
                <behaviors:EventTrigger EventName="PreviewMouseLeftButtonUp">
                    <l:LivetCallMethodAction MethodName="ButtonAOn" MethodTarget="{Binding}"/>
                </behaviors:EventTrigger>
            </behaviors:Interaction.Triggers>
        </Button>

試したこと

<Label Content="{TemplateBinding Tag}"/> では、Tagの値が表示できる事を確認。 <DataTrigger Binding="{TemplateBinding Tag}" Value="赤丸"> はエラーとなるが、 <DataTrigger Binding="{Binding PBaFlag}" Value="赤丸"> だと色が変わる事を確認。ただ、同じStyleを使いたいので、Tabを使えないかと試したが上手く行かない状態。

補足情報（FW/ツールのバージョンなど）

VisualStudio2019

行動規範の内容に同意します

回答1件

ベストアンサー

あまり自信がありませんが、こういうことでしょうか？

xml
1<Window
2  x:Class="Questions316881.MainWindow"
3  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
4  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
5  xmlns:behaviors="http://schemas.microsoft.com/xaml/behaviors"
6  Width="800"
7  Height="450">
8  <Window.Resources>
9    <!--<ControlTemplate x:Key="ButtonTemplate" TargetType="Button">
10      <Grid>
11        <StackPanel>
12          <Ellipse Height="100">
13            <Ellipse.Resources>
14              <Style TargetType="Ellipse">
15                <Setter Property="Fill" Value="Gray" />
16                <Style.Triggers>
17                  <DataTrigger Binding="{Binding Tag, RelativeSource={RelativeSource TemplatedParent}}" Value="赤丸">
18                    <Setter Property="Fill" Value="Red" />
19                  </DataTrigger>
20                  <DataTrigger Binding="{Binding Tag, RelativeSource={RelativeSource TemplatedParent}}" Value="緑丸">
21                    <Setter Property="Fill" Value="Green" />
22                  </DataTrigger>
23                  <DataTrigger Binding="{Binding Tag, RelativeSource={RelativeSource TemplatedParent}}" Value="青丸">
24                    <Setter Property="Fill" Value="Blue" />
25                  </DataTrigger>
26                </Style.Triggers>
27              </Style>
28            </Ellipse.Resources>
29          </Ellipse>
30          <Rectangle Height="100" Fill="Gray" />
31          <Label Content="{TemplateBinding Tag}" />
32        </StackPanel>
33        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
34      </Grid>
35    </ControlTemplate>-->
36
37    <!--  ↑これでも動きますが、↓の方が少し短いしわかりやすそうです  -->
38
39    <ControlTemplate x:Key="ButtonTemplate" TargetType="Button">
40      <Grid>
41        <StackPanel>
42          <Ellipse
43            x:Name="ellipse"
44            Height="100"
45            Fill="Gray" />
46          <Rectangle Height="100" Fill="Gray" />
47          <Label Content="{TemplateBinding Tag}" />
48        </StackPanel>
49        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
50      </Grid>
51      <ControlTemplate.Triggers>
52        <Trigger Property="Tag" Value="赤丸">
53          <Setter TargetName="ellipse" Property="Fill" Value="Red" />
54        </Trigger>
55        <Trigger Property="Tag" Value="緑丸">
56          <Setter TargetName="ellipse" Property="Fill" Value="Green" />
57        </Trigger>
58        <Trigger Property="Tag" Value="青丸">
59          <Setter TargetName="ellipse" Property="Fill" Value="Blue" />
60        </Trigger>
61      </ControlTemplate.Triggers>
62    </ControlTemplate>
63  </Window.Resources>
64  <StackPanel
65    HorizontalAlignment="Center"
66    VerticalAlignment="Center"
67    Orientation="Horizontal">
68    
69    <Button
70      Content="ButtonA"
71      Tag="{Binding ButtonAFlag}"
72      Template="{StaticResource ButtonTemplate}">
73      <behaviors:Interaction.Triggers>
74        <behaviors:EventTrigger EventName="PreviewMouseLeftButtonUp">
75          <behaviors:CallMethodAction MethodName="ButtonAOn" TargetObject="{Binding}" />
76        </behaviors:EventTrigger>
77      </behaviors:Interaction.Triggers>
78    </Button>
79
80    <Button
81      Content="ButtonB"
82      Tag="{Binding ButtonBFlag}"
83      Template="{StaticResource ButtonTemplate}">
84      <behaviors:Interaction.Triggers>
85        <behaviors:EventTrigger EventName="PreviewMouseLeftButtonUp">
86          <behaviors:CallMethodAction MethodName="ButtonBOn" TargetObject="{Binding}" />
87        </behaviors:EventTrigger>
88      </behaviors:Interaction.Triggers>
89    </Button>
90  </StackPanel>
91</Window>

cs
1using Livet;
2using System.Windows;
3
4namespace Questions316881
5{
6    public class MainViewModel : ViewModel
7    {
8        private string _ButtonAFlag = "赤丸";
9        public string ButtonAFlag { get => _ButtonAFlag; set => RaisePropertyChangedIfSet(ref _ButtonAFlag, value); }
10
11        private string _ButtonBFlag = "青丸";
12        public string ButtonBFlag { get => _ButtonBFlag; set => RaisePropertyChangedIfSet(ref _ButtonBFlag, value); }
13
14        public void ButtonAOn() => ButtonAFlag = ButtonAFlag == "赤丸" ? "緑丸" : "赤丸";
15        public void ButtonBOn() => ButtonBFlag = ButtonBFlag == "青丸" ? "緑丸" : "青丸";
16    }
17
18    public partial class MainWindow : Window
19    {
20        public MainWindow()
21        {
22            InitializeComponent();
23            DataContext = new MainViewModel();
24        }
25    }
26}

投稿2021/01/18 21:48

編集2023/07/26 13:15

TN8001

総合スコア9855

m_rase

2021/01/19 14:45

回答ありがとうございます。また、2つの方法についても、教えて頂き、ありがとうございます。 <ControlTemplate.Triggers>でTag="100" や"200"とし、 intの型の変数をTagにbindingすると、上手く切り替えが行えなかったので、上手く行ったDataTriggerを試しています。これを元に、元々がなぜ出来ていなかったのか、理解したいと思います。ありがとうございました。

TN8001

2021/01/19 15:46 編集

intの場合はこんな感じにすればいけます。 <Window xmlns:sys="clr-namespace:System;assembly=mscorlib" ～～～ <Window.Resources> <sys:Int32 x:Key="RedFlag">100</sys:Int32> ～～～ <Trigger Property="Tag" Value="{StaticResource RedFlag}"> <Setter TargetName="ellipse" Property="Fill" Value="Red" /> </Trigger>

行動規範の内容に同意します