WPF DataGridに編集があった場合背景を変えたい2

前提・実現したいこと

DataGridTemplateColumn.CellTemplateのComboboxの背景色をDataTriggerで変更したい。
(選択変更があったcomboboxの背景色をかえたい)

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

https://teratail.com/questions/346520　からの諸変更です。

DataGridComboBoxColumnを使用していましたが、やたらクリックが必要で操作性が悪いため、
DataGridTemplateColumn.CellTemplateのComboboxに変更しました。
結果、Comboboxの選択を変更してもComboboxの背景色を変更できなくなりました。

該当のソースコード

XAML
1 <DataGridTemplateColumn  Header="Test">
2                        <DataGridTemplateColumn.CellTemplate>
3                            <DataTemplate>
4                                <ComboBox  SelectedValue="{Binding _Mode, UpdateSourceTrigger=PropertyChanged, Mode=OneWay }" DisplayMemberPath="_Label" SelectedValuePath="_Value">
5 　　　　　　　　　　　　　　　　　　　<ComboBox.ItemsSource>
6                                        <x:Array Type="{x:Type local:ModeToComboBoxGrp}" >
7　　　　　　　　　　　　　　　　　　　　　　　　  <local:ModeToComboBoxGrp _Label="0:TOP"  _Value="0"/>
8                                            <local:ModeToComboBoxGrp _Label="1:LOW"  _Value="1"/>
9                                        </x:Array>
10                                    </ComboBox.ItemsSource>
11                                  <ComboBox.Style>
12                                        <Style TargetType="ComboBox">
13                                           <Style.Triggers>
14                                              <DataTrigger Binding="{Binding IsModeChange}" Value="true">
15                                                <Setter Property="Background" Value="LightSalmon" />
16                                              </DataTrigger>
17                                           </Style.Triggers>
18                                        </Style>
19                                    </ComboBox.Style>
20                                </ComboBox>
21                            </DataTemplate>
22                        </DataGridTemplateColumn.CellTemplate>
23                    </DataGridTemplateColumn>

試したこと

色々見ているとTemplateを書き換えなければならない？？

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

VisualStudio2015

hihijiji

2021/08/02 02:49

とりあえず気がついた矛盾 UpdateSourceTrigger=PropertyChanged, Mode=OneWay OneWay じゃ Source は Update されません。

98mate

2021/08/04 11:08

ご指摘ありがとうございます。

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

回答1件

ベストアンサー

色々見ているとTemplateを書き換えなければならない？？

ほかの方法もあるかもしれませんが、手間は一番少ないと思います（xamlは爆発的に増えますが^^;

仮でいいのでxamlにComboBoxを追加してください。
デザイナ上でComboBoxを右クリックし、「テンプレートの編集」-「コピーして編集」でスタイルを出力します。
出力出来たら仮のComboBoxはもういりません。

どこかに↓ようなスタイルが出ていると思います（微妙に差があるかもしれません）

xml
1<Style x:Key="ComboBoxToggleButton" TargetType="{x:Type ToggleButton}">
2  <Setter Property="OverridesDefaultStyle" Value="true" />
3  <Setter Property="IsTabStop" Value="false" />
4  <Setter Property="Focusable" Value="false" />
5  <Setter Property="ClickMode" Value="Press" />
6  <Setter Property="Template">
7    <Setter.Value>
8      <ControlTemplate TargetType="{x:Type ToggleButton}">
9        <Border
10          x:Name="templateRoot"
11          Background="{StaticResource ComboBox.Static.Background}"
12          BorderBrush="{StaticResource ComboBox.Static.Border}"
13          BorderThickness="{TemplateBinding BorderThickness}"
14          SnapsToDevicePixels="true">

xml
1Background="{StaticResource ComboBox.Static.Background}"

ここを

xml
1Background="{TemplateBinding Background}"

このように変更します。

DataGridTemplateColumnのComboBoxのStyleを、

xml
1<Style TargetType="ComboBox" BasedOn="{StaticResource ComboBoxStyle1}">

のように今出力したスタイルを受け継ぐようにします。
これでおそらくBackgroundの変更が反映されると思います。

検証コード追記

xml
1<Window
2  x:Class="Questions352305.MainWindow"
3  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
4  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
5  xmlns:local="clr-namespace:Questions352305"
6  xmlns:theme="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Aero2"
7  Width="800"
8  Height="450">
9  <Window.Resources>
10    <x:Array x:Key="ModeToComboBoxGrps" Type="{x:Type local:ModeToComboBoxGrp}">
11      <local:ModeToComboBoxGrp Label="0:TOP" Value="0" />
12      <local:ModeToComboBoxGrp Label="1:LOW" Value="1" />
13    </x:Array>
14
15    <!--  いろいろ省略  -->
16    <!--<Style x:Key="FocusVisual" />
17    <SolidColorBrush x:Key="TextBox.Static.Background" Color="#FFFFFFFF" />
18    <Style x:Key="ComboBoxEditableTextBox" TargetType="{x:Type TextBox}" />-->
19
20    <!--<Style x:Key="ComboBoxToggleButton" TargetType="{x:Type ToggleButton}">
21      <Setter Property="OverridesDefaultStyle" Value="true" />
22      <Setter Property="IsTabStop" Value="false" />
23      <Setter Property="Focusable" Value="false" />
24      <Setter Property="ClickMode" Value="Press" />
25      <Setter Property="Template">
26        <Setter.Value>
27          <ControlTemplate TargetType="{x:Type ToggleButton}">
28            <Border
29              x:Name="templateRoot"
30              Background="{TemplateBinding Background}"
31              BorderBrush="{StaticResource ComboBox.Static.Border}"
32              BorderThickness="{TemplateBinding BorderThickness}"
33              SnapsToDevicePixels="true">-->
34    <!--  以下も省略  -->
35
36    <!--  いろいろ省略  -->
37    <!--<ControlTemplate x:Key="ComboBoxEditableTemplate" TargetType="{x:Type ComboBox}"/>
38    <ControlTemplate x:Key="ComboBoxTemplate" TargetType="{x:Type ComboBox}"/>
39    <Style x:Key="ComboBoxStyle1" TargetType="{x:Type ComboBox}"/>-->
40  </Window.Resources>
41  <DockPanel>
42    <ComboBox
43      Background="Red"
44      DockPanel.Dock="Top"
45      Style="{DynamicResource ComboBoxStyle1}" />
46    <Button
47      Click="Button2_Click"
48      Content="更新"
49      DockPanel.Dock="Top" />
50    <DataGrid
51      AutoGenerateColumns="False"
52      ItemsSource="{Binding Records}"
53      SelectionUnit="CellOrRowHeader">
54      <DataGrid.Columns>
55
56        <DataGridComboBoxColumn
57          DisplayMemberPath="Label"
58          Header="ComboBoxColumn"
59          ItemsSource="{StaticResource ModeToComboBoxGrps}"
60          SelectedValueBinding="{Binding Mode}"
61          SelectedValuePath="Value">
62          <DataGridComboBoxColumn.CellStyle>
63            <Style TargetType="DataGridCell">
64              <Style.Triggers>
65                <DataTrigger Binding="{Binding IsModeChange}" Value="True">
66                  <Setter Property="Background" Value="LightSalmon" />
67                </DataTrigger>
68              </Style.Triggers>
69            </Style>
70          </DataGridComboBoxColumn.CellStyle>
71        </DataGridComboBoxColumn>
72
73        <DataGridTemplateColumn Header="Test">
74          <DataGridTemplateColumn.CellTemplate>
75            <DataTemplate>
76              <ComboBox
77                DisplayMemberPath="Label"
78                ItemsSource="{StaticResource ModeToComboBoxGrps}"
79                SelectedValue="{Binding Mode, UpdateSourceTrigger=PropertyChanged}"
80                SelectedValuePath="Value">
81                <ComboBox.Style>
82                  <Style BasedOn="{StaticResource ComboBoxStyle1}" TargetType="ComboBox">
83                    <Style.Triggers>
84                      <DataTrigger Binding="{Binding IsModeChange}" Value="True">
85                        <Setter Property="Background" Value="LightSalmon" />
86                      </DataTrigger>
87                    </Style.Triggers>
88                  </Style>
89                </ComboBox.Style>
90              </ComboBox>
91            </DataTemplate>
92          </DataGridTemplateColumn.CellTemplate>
93        </DataGridTemplateColumn>
94      </DataGrid.Columns>
95    </DataGrid>
96  </DockPanel>
97</Window>

cs
1using System.Collections.Generic;
2using System.ComponentModel;
3using System.Runtime.CompilerServices;
4using System.Windows;
5
6namespace Questions352305
7{
8    public class Record : Observable
9    {
10        public int Mode
11        {
12            get => _Mode;
13            set { if (SetProperty(ref _Mode, value)) IsModeChange = true; }
14        }
15        private int _Mode;
16
17        public bool IsModeChange { get => _IsModeChange; set => SetProperty(ref _IsModeChange, value); }
18        private bool _IsModeChange;
19    }
20
21    public class ModeToComboBoxGrp
22    {
23        public string Label { get; set; }
24        public int Value { get; set; }
25    }
26
27    public partial class MainWindow : Window
28    {
29        public List<Record> Records { get; } = new List<Record>();
30
31        public MainWindow()
32        {
33            InitializeComponent();
34            DataContext = this;
35
36            Records.Add(new Record());
37            Records.Add(new Record());
38            Records.Add(new Record());
39        }
40
41        private void Button2_Click(object sender, RoutedEventArgs e)
42        {
43            foreach (var record in Records)
44            {
45                record.IsModeChange = false;
46            }
47        }
48    }
49
50    public class Observable : INotifyPropertyChanged
51    {
52        public event PropertyChangedEventHandler PropertyChanged;
53        protected bool SetProperty<T>(ref T storage, T value, [CallerMemberName] string propertyName = null)
54        {
55            if (Equals(storage, value)) return false;
56            storage = value;
57            OnPropertyChanged(propertyName);
58            return true;
59        }
60        protected void OnPropertyChanged(string propertyName) => PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
61    }
62}

投稿2021/08/02 09:34

編集2023/07/28 14:49

TN8001

総合スコア10108

98mate

2021/08/02 12:27

ありがとうございます。反映してみましたが、comboboxのリストが表示されなくなりました。BasedOn="{StaticResource ComboBoxStyle1}"の有無で表示が変わります。

TN8001

2021/08/02 13:37

> 反映してみましたが、comboboxのリストが表示されなくなりました。BasedOn="{StaticResource ComboBoxStyle1}"の有無で表示が変わります。うーん手順通りならそんなことはあり得ないんですが。今の私の認識コードを追記します。出力されたスタイルだけで2万文字超えますので、ばっさり省略します。不明な部分はでっち上げました（本来は質問者が提示すべきところです）

98mate

2021/08/11 00:52

大変遅くなり申し訳ございませんが、動作確認出来ました。 >>デザイナ上でComboBoxを右クリックし、「テンプレートの編集」-「コピーして編集」でスタイルを出力します。この過程で違いが出る場合があるのか、何度か繰り返しているとできました。厳密には私が微妙に違う所作をしているのだと思います。元々の<Setter Property="Background" Value="LightSalmon" />はどこのBackgroundを替えに行っているのでしょうか。何で色が反映されないのか・・・今回行っている変更内容が良くわかっていないです。(まだ十分な読解力がついていません) 調べていると↓のような手法もあるみたいでした。 ttp://tawamuredays.blog.fc2.com/blog-entry-280.html

TN8001

2021/08/11 03:34

> 元々の<Setter Property="Background" Value="LightSalmon" />はどこのBackgroundを替えに行っているのでしょうか。 ComboBoxのBackgroundです。 ComboBoxのBackgroundは変わっているんです。そして表面を占めているToggleButtonも、ComboBoxのTemplateの中で、 <ToggleButton x:Name="toggleButton" Grid.ColumnSpan="2" Background="{TemplateBinding Background}" のようにComboBoxのBackgroundを使うように指定されています。つまりToggleButtonのBackgroundも変わっています。ではなぜ色が変わらないのかというと、 ComboBoxToggleButtonスタイルでTemplateBinding Backgroundがどこにもないからです。 ToggleButtonの表面を占めているBorderが、 Background="{StaticResource ComboBox.Static.Background}" と固定色になっていました。それでは変わりようがありません。それを Background="{TemplateBinding Background}" とすることにより、 ComboBoxのBackground 　ToggleButtonのBackground 　　BorderのBackground と、順に色を継承してきて最終的にBorder（templateRoot）に、LightSalmon色がついたということです。文字で説明してもなにがなんだかという気がしますが、「ライブビジュアルツリー」・「ライブプロパティエクスプローラー」で見るとわかりやすいです。 [デバッグ中に XAML のプロパティを調べる - Visual Studio (Windows) | Microsoft Docs](https://docs.microsoft.com/ja-jp/visualstudio/xaml-tools/inspect-xaml-properties-while-debugging > 調べていると↓のような手法もあるみたいでした。 xamlが増えるかコードが増えるかの違いですかね^^;

98mate

2022/01/06 02:29

本件、無事解決しました。解決済みにしていたつもりが反映忘れていました。大変申し訳ございませんでした。

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