背水一战 Windows 10 (58) - 控件(集合类): ListViewBase - ListView, GridView

2021-05-12 19:26

阅读:539

标签:grid   static   and   log   lan   present   源码下载   name   mobile   

原文:背水一战 Windows 10 (58) - 控件(集合类): ListViewBase - ListView, GridView

[源码下载]


背水一战 Windows 10 (58) - 控件(集合类): ListViewBase - ListView, GridView

作者:webabcd


介绍
背水一战 Windows 10 之 控件(集合类 - ListViewBase)

  • ListView
  • GridView

示例
1、ListView 的示例
Controls/CollectionControl/ListViewBaseDemo/ListViewDemo.xaml

Page
    x:Class="Windows10.Controls.CollectionControl.ListViewDemo"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Windows10.Controls.CollectionControl"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"

    xmlns:common="using:Windows10.Common">

    Page.Resources>
        Style x:Key="ListViewItemStyle" TargetType="ListViewItem">
            Setter Property="Background" Value="Transparent"/>
            Setter Property="Template">
                Setter.Value>
                    ControlTemplate TargetType="ListViewItem">
                        
                        
                        ListViewItemPresenter Margin="10" SelectedBackground="Red" SelectedPointerOverBackground="Red"
                                               Tag="{Binding IsSelected, RelativeSource={RelativeSource Mode=TemplatedParent}, Mode=TwoWay}" />
                    ControlTemplate>
                Setter.Value>
            Setter>
        Style>
        common:BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter" />
    Page.Resources>

    Grid Background="Transparent">

        

        ListView x:Name="listView" Margin="10 0 10 10" 
                  ItemContainerStyle="{StaticResource ListViewItemStyle}"
                  SelectionMode="Multiple"
                  ItemsSource="{x:Bind Employees}">
            ListView.ItemTemplate>
                DataTemplate x:DataType="common:Employee">
                    StackPanel Height="100" Width="100" Background="Blue">
                        TextBlock x:Name="lblName" Text="{x:Bind Name}" />
                        TextBlock x:Name="lblIsMale" Text="{x:Bind IsMale}" />
                        
                        TextBlock x:Name="lblAge" Text="{x:Bind Age}" 
                                   Visibility="{Binding Path=Tag, RelativeSource={RelativeSource Mode=TemplatedParent}, Converter={StaticResource BooleanToVisibilityConverter}}" />
                    StackPanel>
                DataTemplate>
            ListView.ItemTemplate>
        ListView>


        

    Grid>
Page>

Controls/CollectionControl/ListViewBaseDemo/ListViewDemo.xaml.cs

/*
 * ListView - ListView 控件(继承自 ListViewBase, 请参见 /Controls/CollectionControl/ListViewBaseDemo/)
 */

using System.Collections.ObjectModel;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows10.Common;

namespace Windows10.Controls.CollectionControl
{
    public sealed partial class ListViewDemo : Page
    {
        public ObservableCollection Employees { get; set; } = new ObservableCollection(TestData.GetEmployees());

        public ListViewDemo()
        {
            this.InitializeComponent();
        }
    }
}


2、GridView 的示例
Controls/CollectionControl/ListViewBaseDemo/GridViewDemo.xaml

Page
    x:Class="Windows10.Controls.CollectionControl.GridViewDemo"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Windows10.Controls.CollectionControl"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    
    xmlns:common="using:Windows10.Common">

    Page.Resources>
        Style x:Key="GridViewItemStyle" TargetType="GridViewItem">
            Setter Property="Background" Value="Transparent"/>
            Setter Property="Template">
                Setter.Value>
                    ControlTemplate TargetType="GridViewItem">
                        
                        ListViewItemPresenter Margin="10" SelectionCheckMarkVisualEnabled="True" SelectedBackground="Red" CheckBrush="Yellow" />
                    ControlTemplate>
                Setter.Value>
            Setter>
        Style>
    Page.Resources>

    Grid Background="Transparent">

        

        GridView x:Name="gridView" Margin="10 0 10 10" 
                  ItemContainerStyle="{StaticResource GridViewItemStyle}"
                  SelectionMode="Multiple"
                  ItemsSource="{x:Bind Employees}">
            GridView.ItemTemplate>
                DataTemplate x:DataType="common:Employee">
                    StackPanel Height="100" Width="100" Background="Blue">
                        TextBlock x:Name="lblName" Text="{x:Bind Name}" Foreground="Yellow" />
                        TextBlock x:Name="lblAge" Text="{x:Bind Age}" Foreground="Aqua" />
                        TextBlock x:Name="lblIsMale" Text="{x:Bind IsMale}" Foreground="Gray" />
                    StackPanel>
                DataTemplate>
            GridView.ItemTemplate>
        GridView>

        
        
        
    Grid>
Page>

Controls/CollectionControl/ListViewBaseDemo/GridViewDemo.xaml.cs

/*
 * GridView - GridView 控件(继承自 ListViewBase, 请参见 /Controls/CollectionControl/ListViewBaseDemo/)
 */

using System.Collections.ObjectModel;
using Windows.UI.Xaml.Controls;
using Windows10.Common;

namespace Windows10.Controls.CollectionControl
{
    public sealed partial class GridViewDemo : Page
    {
        public ObservableCollection Employees { get; set; } = new ObservableCollection(TestData.GetEmployees());

        public GridViewDemo()
        {            
            this.InitializeComponent();
        }
    }
}

OK
[源码下载]

背水一战 Windows 10 (58) - 控件(集合类): ListViewBase - ListView, GridView

标签:grid   static   and   log   lan   present   源码下载   name   mobile   

原文地址:http://www.cnblogs.com/lonelyxmas/p/7568327.html


评论


亲,登录后才可以留言!