Avalonia常用小控件DataGrid

1.项目下载地址:https://gitee.com/confusedkitten/avalonia-demo

2.UI库Semi.Avalonia,项目地址  https://github.com/irihitech/Semi.Avalonia

3.Nuget添加Semi.Avalonia.DataGrid

4.在App.axaml中添加Semi.Avalonia.DataGrid样式

<Application xmlns="https://github.com/avaloniaui"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             x:Class="AvaloniaDemo.App"
             xmlns:local="using:AvaloniaDemo"
             RequestedThemeVariant="Default">
             <!-- "Default" ThemeVariant follows system theme variant. "Dark" or "Light" are other available options. -->

    <Application.DataTemplates>
        <local:ViewLocator/>
    </Application.DataTemplates>
	<Application.Resources>
		<ResourceDictionary>
			<ResourceDictionary.MergedDictionaries>
				<MergeResourceInclude Source="/Assets/ResourceDictionary1.axaml" />
			</ResourceDictionary.MergedDictionaries>
		</ResourceDictionary>
	</Application.Resources>
    <Application.Styles>
        <FluentTheme />
		<StyleInclude Source="avares://Semi.Avalonia/Themes/DarkTheme.axaml" />
		<StyleInclude Source="avares://Semi.Avalonia.DataGrid/Index.axaml" />
		<StyleInclude Source="avares://Semi.Avalonia.ColorPicker/Index.axaml" />
    </Application.Styles>
</Application>

样式预览:

axaml代码 :

<UserControl xmlns="https://github.com/avaloniaui"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
			 xmlns:vm="using:AvaloniaDemo.ViewModels"
             x:Class="AvaloniaDemo.Pages.DataGrid">
	<UserControl.Styles>
		<Style Selector="DataGridColumnHeader">
			<Setter Property="HorizontalContentAlignment" Value="Center"/>
			<Setter Property="BorderBrush" Value="Black" />
			<Setter Property="BorderThickness" Value="0 1 1 1" />
			<Setter Property="Height" Value="40"/>
			<Setter Property="Foreground" Value="White"/>
			<Setter Property="FontWeight" Value="Normal"/>
		</Style>
	</UserControl.Styles>
	<Grid>
		<DataGrid Name="dg" x:DataType="vm:Country" Background="Transparent">
			<DataGrid.Columns>
				<DataGridTemplateColumn  Width="70" IsReadOnly="True" >
					<DataGridTemplateColumn.HeaderTemplate>
						<DataTemplate>
							<StackPanel Orientation="Horizontal" Spacing="5" HorizontalAlignment="Center" VerticalAlignment="Center">
								<CheckBox Initialized="CheckBoxInitialized" Margin="0 0 0 0"  BorderBrush="White" Name="selectedAll"  Checked="SelectedAll_Click" Unchecked="UncheckedAll_Click"  Background="Transparent" ></CheckBox>
								<TextBlock Text="全选" Margin="0 4 0 0" Foreground="White"></TextBlock>
							</StackPanel>
						</DataTemplate>
					</DataGridTemplateColumn.HeaderTemplate>
					<DataGridTemplateColumn.CellTemplate>
						<DataTemplate  x:DataType="vm:Country" >
							<StackPanel Orientation="Horizontal" VerticalAlignment="Center" HorizontalAlignment="Center" >
								<CheckBox   IsChecked="{Binding IsChecked}" Background="Transparent" IsEnabled="True"   VerticalAlignment="Center" Checked="DataGridRow_checked" Unchecked="DataGridRow_Unchecked"></CheckBox>
							</StackPanel>
						</DataTemplate>
					</DataGridTemplateColumn.CellTemplate>
				</DataGridTemplateColumn>
				<DataGridTextColumn Header="Name"  MinWidth="190" IsReadOnly="True" Binding="{Binding Name}"></DataGridTextColumn>
				<DataGridTextColumn Header="Region" MinWidth="190" IsReadOnly="True" Binding="{Binding Region}"></DataGridTextColumn>
				<DataGridTextColumn Header="Population" MinWidth="110" IsReadOnly="True" Binding="{Binding Population}"></DataGridTextColumn>
				<DataGridTextColumn Header="Area" MinWidth="110" IsReadOnly="True" Binding="{Binding Area}"></DataGridTextColumn>
				<DataGridTextColumn Header="PopulationDensity" MinWidth="110" IsReadOnly="True" Binding="{Binding PopulationDensity}"></DataGridTextColumn>
				<DataGridTextColumn Header="CoastLine" Width="*" IsReadOnly="True" Binding="{Binding CoastLine}"></DataGridTextColumn>
			</DataGrid.Columns>
		</DataGrid>
	</Grid>
</UserControl>

后台代码:

using Avalonia;
using Avalonia.Controls;
using Avalonia.Interactivity;
using Avalonia.Markup.Xaml;
using AvaloniaDemo.Models;
using AvaloniaDemo.ViewModels;
using System;
using System.Collections.Generic;

namespace AvaloniaDemo.Pages;

public partial class DataGrid : UserControl
{
    
    private List<Country> SelectedList = new List<Country>();
    private List<Country> AllTargetList = new List<Country>() {
         new Country("Afghanistan", "ASIA (EX. NEAR EAST)", 31056997, 647500, 48, 0, 23.06, 163.07, 700, 36, 3.2, 46.6, 20.34),
      new Country("Albania", "EASTERN EUROPE", 3581655, 28748, 124.6, 1.26, -4.93, 21.52, 4500, 86.5, 71.2, 15.11, 5.22),
      new Country("Algeria", "NORTHERN AFRICA", 32930091, 2381740, 13.8, 0.04, -0.39, 31, 6000, 70, 78.1, 17.14, 4.61),
      new Country("American Samoa", "OCEANIA", 57794, 199, 290.4, 58.29, -20.71, 9.27, 8000, 97, 259.5, 22.46, 3.27),
      new Country("Andorra", "WESTERN EUROPE", 71201, 468, 152.1, 0, 6.6, 4.05, 19000, 100, 497.2, 8.71, 6.25),
      new Country("Angola", "SUB-SAHARAN AFRICA", 12127071, 1246700, 9.7, 0.13, 0, 191.19, 1900, 42, 7.8, 45.11, 24.2),
      new Country("Anguilla", "LATIN AMER. & CARIB", 13477, 102, 132.1, 59.8, 10.76, 21.03, 8600, 95, 460, 14.17, 5.34),
      new Country("Antigua & Barbuda", "LATIN AMER. & CARIB", 69108, 443, 156, 34.54, -6.15, 19.46, 11000, 89, 549.9, 16.93, 5.37),
};

    CheckBox? _CheckBox;

    public DataGrid()
    {
        InitializeComponent();
        dg.ItemsSource = AllTargetList;
        DataContext = this;
    }

    /// <summary>
    /// CheckBox
    /// </summary>
    /// <param name="sender"></param>
    /// <param name="e"></param>
    private void CheckBoxInitialized(object? sender, EventArgs e)
    {
        if (sender is CheckBox checkBox)
            _CheckBox = checkBox;
    }

    #region 选中事件

    /// <summary>
    /// 行复选框选中事件
    /// </summary>
    /// <param name="sender"></param>
    /// <param name="e"></param>
    private void DataGridRow_checked(object sender, RoutedEventArgs e)
    {
        if (sender is CheckBox cb)
        {
            if (cb.DataContext is Country SelectItem)
            {
                Country SelectTarget = (Country)dg.SelectedItem;
                if (!SelectedList.Contains(SelectTarget))
                    SelectedList.Add(SelectTarget);
            }
        }
    }

    #endregion

    #region  取消选中事件

    /// <summary>
    /// 行复选框消选中事件
    /// </summary>
    /// <param name="sender"></param>
    /// <param name="e"></param>
    private void DataGridRow_Unchecked(object sender, RoutedEventArgs e)
    {
        Country SelectTarget = (Country)dg.SelectedItem;
        if (sender is CheckBox cb)
        {
            if (SelectedList.Contains(SelectTarget))
                SelectedList.Remove(SelectTarget);
        }
        if (_CheckBox != null) _CheckBox.IsChecked = false;
    }

    #endregion

    #region 全选事件

    /// <summary>
    /// 全选事件
    /// </summary>
    /// <param name="sender"></param>
    /// <param name="e"></param>
    private void SelectedAll_Click(object sender, RoutedEventArgs e)
    {
        for (int i = 0; i < AllTargetList.Count; i++)
        {
            var item = AllTargetList[i];
            item.IsChecked = true;
        }
    }

    #endregion

    #region 取消全选事件

    /// <summary>
    /// 取消全选事件
    /// </summary>
    /// <param name="sender"></param>
    /// <param name="e"></param>
    private void UncheckedAll_Click(object sender, RoutedEventArgs e)
    {
        if (_CheckBox != null && _CheckBox.IsFocused)
        {
            for (int i = 0; i < AllTargetList.Count; i++)
            {
                var item = AllTargetList[i];
                item.IsChecked = false;
            }
            SelectedList = new List<Country>();
        }
    }

    #endregion
}

全选问题:

没有啥好办法,能找到这个全选的CheckBox,目前智能曲线救国,如果有知道怎么找她的朋友告诉我一下,感激不尽!

  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值