1.Avalonia中的DataGrid的使用
DataGrid 是客户端 UI 中一个非常重要的控件。在 Avalonia 中,DataGrid 是一个独立的包 Avalonia.Controls.DataGrid
,因此需要单独通过 NuGet 安装。接下来,将介绍如何安装和使用 DataGrid 控件。
2.安装 DataGrid 包
要使用 DataGrid 控件,首先需要在 NuGet 中安装 Avalonia.Controls.DataGrid
包。只需在 NuGet 搜索框中输入 Avalonia.Controls.DataGrid
,然后进行安装即可。
版本选择
在安装 Avalonia.Controls.DataGrid
包时,请确保其版本与 Avalonia 框架版本一致,否则可能导致安装失败。Avalonia 框架版本是您创建项目时选择的“Avalonia Version”。
注:Avalonia框架版本也可以在“依赖项→包”中查看
3.DataGrid的使用
在 App.axaml
文件中(或其他需要使用 DataGrid 的界面文件),需要引用 DataGrid 的样式文件。可以通过以下方式在界面中引入:
<!--下面样式文件二选一-->
<StyleInclude Source="avares://Avalonia.Controls.DataGrid/Themes/Fluent.xaml"/>
<StyleInclude Source="avares://Avalonia.Controls.DataGrid/Themes/Simple.xaml"/>
注:必须引用 DataGrid 的样式文件,否则 DataGrid 将无法正确显示。
4.代码实现
App.axaml文件
<Application xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="datagridTest.App"
RequestedThemeVariant="Default">
<!-- "Default" ThemeVariant follows system theme variant. "Dark" or "Light" are other available options. -->
<Application.Styles>
<FluentTheme/>
<StyleInclude Source="avares://Avalonia.Controls.DataGrid/Themes/Fluent.xaml"/>
</Application.Styles>
</Application>
MainWindow.axaml文件
<Window xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:datagridTest"
x:Class="datagridTest.MainWindow"
x:DataType="local:MainWindow"
Title="DataGrid Test" Width="400" Height="300">
<StackPanel>
<!-- 显示 People 的数量,修改为显示“行数” -->
<TextBlock Text="{Binding PeopleCountText}" Margin="10" FontSize="16" />
<!-- 按钮:点击后加载数据 -->
<Button Content="加载数据" Margin="10" Click="LoadDataButton_Click"/>
<!-- 按钮:点击后清除数据 -->
<Button Content="清除数据" Margin="10" Click="ClearDataButton_Click"/>
<!-- DataGrid -->
<DataGrid Name="DataGrid1" Margin="10" ItemsSource="{Binding People}"
SelectionChanged="DataGrid_SelectionChanged"
DoubleTapped="DataGrid_DoubleTapped" IsReadOnly="True">
<DataGrid.Columns>
<DataGridTextColumn Header="ID" Binding="{Binding Id}" />
<DataGridTextColumn Header="姓名" Binding="{Binding Name}" />
<DataGridTextColumn Header="Age" Binding="{Binding Age}" />
</DataGrid.Columns>
</DataGrid>
</StackPanel>
</Window>
MainWindow.axaml.cs文件
using Avalonia.Controls;
using Avalonia.Markup.Xaml;
using System.Collections.Generic;
using System.ComponentModel;
using System.Runtime.CompilerServices;
using Avalonia.Interactivity;
using MsBox.Avalonia;
namespace datagridTest
{
public partial class MainWindow : Window, INotifyPropertyChanged
{
private List<Person> _people;
public List<Person> People
{
get => _people ?? (_people = new List<Person>());
set
{
_people = value;
OnPropertyChanged();
OnPropertyChanged(nameof(PeopleCountText));
}
}
public string PeopleCountText => $"一共有{People.Count}行数据";
public MainWindow()
{
InitializeComponent();
DataContext = this;
People = new List<Person>();
}
private void InitializeComponent()
{
AvaloniaXamlLoader.Load(this);
System.Diagnostics.Debug.WriteLine("XAML loaded successfully");
// 获取 DataGrid 控件的引用
DataGrid1 = this.FindControl<DataGrid>("DataGrid1");
}
private void LoadDataButton_Click(object sender, RoutedEventArgs e)
{
People = new List<Person>
{
new Person { Id = 1, Name = "张三(John Doe)", Age = 30 },
new Person { Id = 2, Name = "李四(Jane Smith)", Age = 25 },
new Person { Id = 3, Name = "王五(Sam Brown)", Age = 35 }
};
}
private void ClearDataButton_Click(object sender, RoutedEventArgs e)
{
People = new List<Person>();
}
private void DataGrid_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
if (DataGrid1 == null) return; // 检查 DataGrid1 是否为 null
var selectedPerson = DataGrid1.SelectedItem as Person;
if (selectedPerson != null)
{
MsBox.Avalonia.MessageBoxManager
.GetMessageBoxStandard("点击按钮(Button Clicked)", "您点击了: " + selectedPerson.Name)
.ShowWindowAsync();
}
}
// 双击行时触发
private void DataGrid_DoubleTapped(object sender, Avalonia.Interactivity.RoutedEventArgs e)
{
if (DataGrid1 == null) return; // 检查 DataGrid1 是否为 null
var selectedPerson = DataGrid1.SelectedItem as Person;
if (selectedPerson != null)
{
MsBox.Avalonia.MessageBoxManager
.GetMessageBoxStandard("点击按钮(Button Clicked)", "您点击了: " + selectedPerson.Id)
.ShowWindowAsync();
}
}
public event PropertyChangedEventHandler PropertyChanged;
protected void OnPropertyChanged([CallerMemberName] string propertyName = null)
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
}
public class Person
{
public int Id { get; set; }
public string Name { get; set; }
public int Age { get; set; }
}
}
代码解析:
1.INotifyPropertyChanged接口:
一定要实现INotifyPropertyChanged接口,否则界面datagrid数据无法展示。INotifyPropertyChanged 接口用于数据绑定通知,确保当数据变化时,界面能够自动更新。
2.数据绑定 (Binding):
在XAML中,DataGrid的ItemsSource属性通过Binding绑定到了People属性。这意味着DataGrid会显示People集合中的数据。
3.后台代码中的People属性:
在MainWindow类中,People是一个List<Person>类型的属性。它存储了要在界面上显示的数据。
4.初始化和数据加载:
MainWindow构造函数中,DataContext被设置为this(即MainWindow的实例),使得XAML中的绑定可以访问People属性。
4.数据加载和清除:
在LoadDataButton_Click方法中,当点击加载数据按钮时,People属性被设置为一个新的List<Person>,这会触发OnPropertyChanged()方法,从而更新界面。
5.DataGrid_SelectionChanged
事件
触发时机:该事件在 DataGrid
中的选中项发生变化时触发。例如,用户点击了某一行或选择了某个单元格时。
6.DataGrid_DoubleTapped
事件事件
触发时机:该事件在 DataGrid
中某行被双击时触发。即用户快速连续点击某一行时触发。
5.界面展示
源码地址:https://download.csdn.net/download/weixin_44643352/90323900