WPF -- DataGrid コントロールの使用

1. DataGrid の簡単な使用
DataGrid の使用は、実際には TreeView の使用と似ていますが、バックグラウンド組織のオブジェクト構造が異なります. DataGrid は通常、再帰的な構造を必要としません. データ グリッドがバインドされているデータ ソースは、属性によって表されますコラム わからなくても大丈夫です コード。

ここに画像の説明を挿入

            </TabItem>
            <TabItem Header="Message" />
            <TabItem Header=" " />
            <TabItem Header=" "/>
            <TabItem Header=" " />
            <TabItem Header=" " />
            <TabItem Header=" " />
        </TabControl>
    </Grid>


	private string name;
	/// <summary>
	/// 名字
	/// </summary>
	public string Name
	{
		get => name;
		set
		{
			name = value;
			OnPropertyChanged();
		}
	}

	private int number;
	/// <summary>
	/// 数量
	/// </summary>
	public int Number
	{
		get => number;
		set
		{
			number = value;
			OnPropertyChanged();
		}
	}

	private double price;
	/// <summary>
	/// 价格
	/// </summary>
	public double Price
	{
		get => price;
		set
		{
			price = value;
			OnPropertyChanged();
		}
	}

3 つの列に対応する 3 つの属性、古い規則、書き込みインターフェイス、および ViewModel (コードは非常に単純で、自分で記述します)

    public ObservableCollection<DataGridModel> DataGridModels { get; set; } = new ObservableCollection<DataGridModel>();

    public DataGridViewModel()
    {
        Create();
    }

    private void Create()
    {
        DataGridModels.Add(new DataGridModel()
        {
            Name = "苹果",
            Number = 5,
            Price = 1.5
        });
        DataGridModels.Add(new DataGridModel()
        {
            Name = "香蕉",
            Number = 2,
            Price = 15
        });
        DataGridModels.Add(new DataGridModel()
        {
            Name = "菠萝",
            Number = 3,
            Price = 10
        });
    }

書いて直接実行して効果を確認する

オブジェクトは行に対応し、属性は列に対応します. TreeView の各レベルに対応するオブジェクトに似ています. デフォルトのスタイルはビットです. . . では、次は美化しましょう。

最初に列名を中国語に美化 --> 名前、数量、価格 (すべての列を含む DataGrid の下に列があり、列を変更するスタイルも一般的にそこにあります)

    <DataGrid.Columns>
        <DataGridTextColumn Binding="{Binding Name}" Header="名称" />
        <DataGridTextColumn Binding="{Binding Number}" Header="数量" />
        <DataGridTextColumn Binding="{Binding Price}" Header="价格" />
    </DataGrid.Columns>

走る、

ヒス、なぜそれが 2 回表示されるのですか。. . (小さな問題) 公式 Web サイトを見て、DataGrids がデフォルトで自動的に列を作成することを見つけます。これが、データ ソースをバインドして最初に列を表示するだけである AutoGenerateColumns="False" であり、このプロパティを False に設定するだけです。

次に、他の列タイプ (チェックボックス、コンボボックス、ハイパーリンク) を作成します。

(最後の行をダブルクリックして別の行に切り替えると、行が追加されます)、直接 CanUserAddRows="False" を設定して、行を作成できないようにします。

OK、次にインターレースされた色の変化を設定します: AlternatingRowBackground="LightBlue" (ターゲット行の色を設定)、AlternationCount="2" (色が変化する行間の間隔を設定、最小値は 2)

最後に、行とセルのスタイル設定

<DataGrid.RowStyle>
    <Style TargetType="DataGridRow">
        <Setter Property="Background" Value="SkyBlue" />
    </Style>
</DataGrid.RowStyle>
<DataGrid.CellStyle>
    <Style TargetType="DataGridCell">
        <Style.Triggers>
            <Trigger Property="IsSelected" Value="True">
                <Setter Property="Foreground" Value="Red" />
            </Trigger>
        </Style.Triggers>
    </Style>
</DataGrid.CellStyle>

実行結果を図に示します
ここに画像の説明を挿入

おすすめ

転載: blog.csdn.net/weixin_41883890/article/details/128931883
おすすめ