c# - チェックボックスの前にテキストを含む DataGridCheckBoxColumn

Question

私は持っていてDataGrid、それにはDataGridCheckBox列があります。そして、次のすべての行にこのようなチェックボックスを表示する必要がありますDataGrid。

そして、以下は私が持っているXAMLと対応するコードです:

<!--MainWindow.xaml-->
<Window x:Class="DataGridColIssue.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" 
        Height="350" 
        Width="525"
        Loaded="Window_Loaded">

    <Window.Resources>
        <Style x:Key="RowNumberCheckBox" TargetType="CheckBox" BasedOn="{StaticResource {x:Type CheckBox}}">
            <Setter Property="FlowDirection" Value="RightToLeft"/>
            <Setter Property="VerticalAlignment" Value="Center"/>
            <Setter Property="HorizontalAlignment" Value="Center"/>
            <Setter Property="Content">
                <Setter.Value>
                    <Grid FlowDirection="LeftToRight">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="20"/>
                            <ColumnDefinition Width="5"/>
                        </Grid.ColumnDefinitions>
                        <TextBlock Grid.Column="0" Text="{Binding Number, StringFormat={}{0:00}}"/>
                    </Grid>
                </Setter.Value>
            </Setter>
            <Setter Property="HorizontalContentAlignment" Value="Center"/>
            <Setter Property="VerticalContentAlignment" Value="Center"/>
        </Style>
    </Window.Resources>
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
            <RowDefinition Height="30"/>
        </Grid.RowDefinitions>
        <DataGrid Grid.Row="0"
            Name="DataGridTesting"
                  AutoGenerateColumns="False">
            <DataGrid.Columns>
                <DataGridCheckBoxColumn Header="#"
                                        Binding="{Binding Exclude, Mode=TwoWay, UpdateSourceTrigger=LostFocus}"
                                        ElementStyle="{StaticResource RowNumberCheckBox}"
                                        EditingElementStyle="{StaticResource RowNumberCheckBox}">
                </DataGridCheckBoxColumn>
            </DataGrid.Columns>
        </DataGrid>
        <Button Grid.Row="1"
                Name="AddItems"
                Content="Add Item"
                Click="AddItems_Click"/>
    </Grid>
</Window>

コード

//MainWindow.xaml.cs
using System.Collections.Generic;
using System.Windows;

namespace DataGridColIssue
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public int CurrentOperation;
        public List<Operation> Operations;
        public MainWindow()
        {
            InitializeComponent();
            Operations = new List<Operation>();
            CurrentOperation = 0;
        }

        private void AddItems_Click(object sender, RoutedEventArgs e)
        {
            CurrentOperation++;
            Operations.Add(new Operation(CurrentOperation));
            DataGridTesting.Items.Refresh();
        }

        private void Window_Loaded(object sender, RoutedEventArgs e)
        {
           DataGridTesting.ItemsSource = Operations;
           DataGridTesting.Items.Refresh();
        }
    }
}

操作クラス

namespace DataGridColIssue
{
    public class Operation
    {
        public bool Exclude { get; set; }
        public int Number { get; set; }

        public Operation(int Number)
        {
            this.Number = Number;
        }
    }
}

私が抱えている問題は、最後の追加行のみが前のテキストで表示され、CheckBox次のようになります。

チェックボックスの前にすべての行に数値を表示するにはどうすればよいですか?

score 1 · Accepted Answer

Content として使用される Grid インスタンスは、すべての checkBox で共有されます。ただし、複数の親を持つことはできないため、最後のチェックボックスに表示されます。

正しい方法は、ContentTemplate を設定することです (この質問の修正された例: WPF のチェックボックスの左側にあるテキスト?、nmcleanの回答)

<Style x:Key="RowNumberCheckBox" TargetType="CheckBox" 
        BasedOn="{StaticResource {x:Type CheckBox}}">
    <Setter Property="Content" Value="{Binding Number}"/>
    <Setter Property="ContentStringFormat" Value="00"/>
    <Setter Property="FlowDirection" Value="RightToLeft" />
    <Setter Property="ContentTemplate">
        <Setter.Value>
            <DataTemplate>
                <ContentControl Content="{Binding}" 
                                ContentStringFormat="{TemplateBinding ContentStringFormat}" />
            </DataTemplate>
        </Setter.Value>
    </Setter>
    <Setter Property="HorizontalContentAlignment" Value="Center"/>
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Setter Property="HorizontalAlignment" Value="Center"/>
    <Setter Property="VerticalAlignment" Value="Center"/>
</Style>

また、FlowDirection が RightToLeft で CheckBox がオンの場合、チェックマークが反転することにも気付きましたか?

特定の要件に対する私の推奨ソリューションは、DataGridCheckBoxColumn の代わりに DataGridTemplateColumn を使用するか、テキストと checkBox を含むカスタム RowHeaderTemplate を使用することです。

score 0 · Accepted Answer

@Ashが提供するソリューションに従って、asGridの一部を作成してからContentTemplateを設定するとcontent value、Grid行ごとにインスタンスが作成されます。目的の結果を生成するソリューションは次のとおりです。

    <Style x:Key="RowNumberCheckBox" TargetType="CheckBox" BasedOn="{StaticResource {x:Type CheckBox}}">
        <Setter Property="FlowDirection" Value="RightToLeft"/>
        <Setter Property="VerticalAlignment" Value="Center"/>
        <Setter Property="HorizontalAlignment" Value="Center"/>
        <Setter Property="Margin" Value="5"/>
        <Setter Property="ContentTemplate">
            <Setter.Value>
                <DataTemplate>
                    <Grid FlowDirection="LeftToRight">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="20"/>
                            <ColumnDefinition Width="5"/>
                        </Grid.ColumnDefinitions>
                        <TextBlock Grid.Column="0" 
                                   Text="{Binding}"
                                   HorizontalAlignment="Right"/>
                    </Grid>
                </DataTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="Content" Value="{Binding Number}"/>
        <Setter Property="HorizontalContentAlignment" Value="Center"/>
        <Setter Property="VerticalContentAlignment" Value="Center"/>
    </Style>

c# - チェックボックスの前にテキストを含む DataGridCheckBoxColumn

2 に答える 2

Related

Reference