UWP ListView 绑定 单击 选中项 颜色

于 2018-09-11 17:38:00 发布
阅读量142 收藏
点赞数
CC 4.0 BY-SA版权
文章标签： ui runtime
原文链接：http://www.cnblogs.com/wgscd/p/9629189.html
本文档提供了一个使用UWP（通用Windows平台）进行应用程序开发的示例代码，包括页面初始化、数据绑定及UI元素的样式设置等内容。通过示例展示了如何创建一个带有列表视图的主页面，并实现图片加载、项点击事件处理等功能。

refer: https://www.cnblogs.com/lonelyxmas/p/7650259.html

 

 

using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Diagnostics;
using System.IO;
using System.Linq;
using System.Runtime.InteropServices.WindowsRuntime;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Popups;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;

// The Blank Page item template is documented at https://go.microsoft.com/fwlink/?LinkId=402352&clcid=0x409

namespace TestTaobao
{
    /// <summary>
    /// An empty page that can be used on its own or navigated to within a Frame.
    /// </summary>
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
           
            this.InitializeComponent();
            listView.DataContext = listData;
            bindData();//?????????
            Loaded += MainPage_Loaded;
          
           
        }

     

        ObservableCollection<data> listData = new ObservableCollection<data>();//????????????   
        
         private void MainPage_Loaded(object sender, RoutedEventArgs e)
        {
          
           
        }
  

        void bindData()
        {

            listData.Add(new data() { title = "ttttt1", picUrl = "Assets/3.png" });
            listData.Add(new data() { title = "ttttt1", picUrl = "Assets/3.png" });
            listData.Add(new data() { title = "ttttt1", picUrl = "Assets/3.png" });
            listData.Add(new data() { title = "ttttt1", picUrl = "Assets/3.png" });
            listView.ItemsSource = listData;
        }

   

        private async  void Button_Click(object sender, RoutedEventArgs e)
        {
            bindData();

           // var  s= await  web.InvokeScriptAsync("eval",new string[] { "document.cookie;"});
           // new MessageDialog(s).ShowAsync();

        }
        public class data
        {
            public string title { get; set; }
            public string picUrl { get; set; }
        }

   

        private void listView_ItemClick(object sender, ItemClickEventArgs e)
        {
            new MessageDialog("" + (e.ClickedItem as data).picUrl).ShowAsync();

            listView.SelectedItem=null ;
        }
    }
}



/*-----------UI--------------------------------------------*/
 
     
     <Page
    x:Class="TestTaobao.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:TestTaobao"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    Background="{ThemeResource ApplicationPageBackgroundThemeBrush}" >
    <Page.Resources>
        <Style x:Name="MyListViewItemStyle" TargetType="ListViewItem">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ListBoxItem">
                        <Grid Background="{TemplateBinding Background}">
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup>
                                    <!--????-->
                                    <VisualState x:Name="Normal" />
                                    <!--????????-->
                                    <VisualState x:Name="PointerOver">
                                        <Storyboard>
                                            <ObjectAnimationUsingKeyFrames 
                        Storyboard.TargetName="ContentBackground"
                        Storyboard.TargetProperty="Background">
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="Red" />
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Grid x:Name="ContentBackground">
                                <ContentPresenter
                  Content="{TemplateBinding Content}"
                  Margin="{TemplateBinding Padding}" />
                            </Grid>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </Page.Resources>
    <Grid>




        <ListView Name="listView"  IsItemClickEnabled="True" ItemsSource="{Binding}" Background="WhiteSmoke" ItemClick="listView_ItemClick"  SelectionMode="None">
            <ListView.Resources>
                <Style x:Key="ListViewItemStyle1" TargetType="ListViewItem">
                    <!--HorizontalContentAlignment ListViewItem ??????-->
                    <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}" />
                    <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}" />
                    <Setter Property="Background" Value="{ThemeResource ListViewItemBackground}" />
                    <Setter Property="Foreground" Value="{ThemeResource ListViewItemForeground}" />
                    <Setter Property="TabNavigation" Value="Local" />
                    <Setter Property="IsHoldingEnabled" Value="True" />
                    <Setter Property="Padding" Value="12,0,12,0" />
                    <Setter Property="HorizontalContentAlignment" Value="Stretch" />
                    <Setter Property="VerticalContentAlignment" Value="Center" />
                    <Setter Property="MinWidth" Value="{ThemeResource ListViewItemMinWidth}" />
                    <Setter Property="MinHeight" Value="{ThemeResource ListViewItemMinHeight}" />
                    <Setter Property="AllowDrop" Value="False" />
                    <Setter Property="UseSystemFocusVisuals" Value="True" />
                    <Setter Property="FocusVisualMargin" Value="0" />
                    <Setter Property="FocusVisualPrimaryBrush" Value="{ThemeResource ListViewItemFocusVisualPrimaryBrush}" />
                    <Setter Property="FocusVisualPrimaryThickness" Value="2" />
                    <Setter Property="FocusVisualSecondaryBrush" Value="{ThemeResource ListViewItemFocusVisualSecondaryBrush}" />
                    <Setter Property="FocusVisualSecondaryThickness" Value="1" />
                    <Setter Property="Template">
                        <Setter.Value>
                            <ControlTemplate TargetType="ListViewItem">
                                <ListViewItemPresenter
                                    HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                                    VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                                    CheckBoxBrush="{ThemeResource ListViewItemCheckBoxBrush}"
                                    CheckBrush="{ThemeResource ListViewItemCheckBrush}"
                                    CheckMode="{ThemeResource ListViewItemCheckMode}"
                                    ContentMargin="{TemplateBinding Padding}"
                                    ContentTransitions="{TemplateBinding ContentTransitions}"
                                    Control.IsTemplateFocusTarget="True"
                                    DisabledOpacity="{ThemeResource ListViewItemDisabledThemeOpacity}"
                                    DragBackground="{ThemeResource ListViewItemDragBackground}"
                                    DragForeground="{ThemeResource ListViewItemDragForeground}"
                                    DragOpacity="{ThemeResource ListViewItemDragThemeOpacity}"
                                    FocusBorderBrush="{ThemeResource ListViewItemFocusBorderBrush}"
                                    FocusSecondaryBorderBrush="{ThemeResource ListViewItemFocusSecondaryBorderBrush}"
                                    FocusVisualMargin="{TemplateBinding FocusVisualMargin}"
                                    FocusVisualPrimaryBrush="{TemplateBinding FocusVisualPrimaryBrush}"
                                    FocusVisualPrimaryThickness="{TemplateBinding FocusVisualPrimaryThickness}"
                                    FocusVisualSecondaryBrush="{TemplateBinding FocusVisualSecondaryBrush}"
                                    FocusVisualSecondaryThickness="{TemplateBinding FocusVisualSecondaryThickness}"
                                    PlaceholderBackground="{ThemeResource ListViewItemPlaceholderBackground}"
                                    PointerOverBackground="Green"
                                    PointerOverForeground="{ThemeResource ListViewItemForegroundPointerOver}"
                                    PressedBackground="#FFFFAA"
                                    ReorderHintOffset="{ThemeResource ListViewItemReorderHintThemeOffset}"
                                    SelectedBackground="#FFFFAA"
                                    SelectedForeground="{ThemeResource ListViewItemForegroundSelected}"
                                    SelectedPointerOverBackground="Red"
                                    SelectedPressedBackground="#FFFFAA"
                                    SelectionCheckMarkVisualEnabled="{ThemeResource ListViewItemSelectionCheckMarkVisualEnabled}" />
                                <!--
                                    PointerOverBackground ????????;SelectedBackground ??????;SelectedPressedBackground ?????????;
                                    PressedBackground ??????????;SelectedPointerOverBackground ????????????
                                -->
                            </ControlTemplate>
                        </Setter.Value>
                    </Setter>
                </Style>
            </ListView.Resources>
            <ListView.ItemContainerStyle>
                <StaticResource ResourceKey="ListViewItemStyle1" />
            </ListView.ItemContainerStyle>

            <ListView.ItemTemplate>
                <DataTemplate>
                    <Grid  x:Name="tpbg"   Width="232"  Height="270" Margin="0,8,0,12">
                        <Grid.Triggers>
                            <EventTrigger RoutedEvent="Grid.Loaded">
                                <EventTrigger.Actions>
                                    <BeginStoryboard>
                                        <Storyboard  x:Name="graphAnimation" x:Uid="sb">
                                            <DoubleAnimation Duration="0:0:2" From="0" To="1" Storyboard.TargetName="tpbg" Storyboard.TargetProperty="Grid.Opacity"></DoubleAnimation>
                                        </Storyboard>
                                    </BeginStoryboard>
                                </EventTrigger.Actions>
                            </EventTrigger>
                            <!--??????????-->
                            <!--<EventTrigger RoutedEvent="Grid.Unloaded">
                                <EventTrigger.Actions>
                                    <BeginStoryboard >
                                        <Storyboard>
                                            -->
                            <!--<DoubleAnimation Duration="0:0:2" From="1" To="0.5" Storyboard.TargetName="tpbg" Storyboard.TargetProperty="Grid.Opacity"></DoubleAnimation>-->
                            <!--<ColorAnimation From="AliceBlue" To="White" Storyboard.TargetName="tpbg" Storyboard.TargetProperty="(Grid.Background).(SolidColorBrush.Color)"></ColorAnimation>-->
                            <!--
                                        </Storyboard>
                                    </BeginStoryboard>
                                </EventTrigger.Actions>
                            </EventTrigger>-->
                        </Grid.Triggers>

                        <Rectangle RadiusX="8" RadiusY="8" Fill="White"></Rectangle>
                        <Image Stretch="Fill" Source="Assets/3.png" Margin="0,2,0,0" HorizontalAlignment="Center" Height="170" VerticalAlignment="Top"/>
                        <Rectangle RadiusX="8" RadiusY="8"  Height="23" Width="78" Fill="Red"  HorizontalAlignment="Left" Margin="0,210,0,0" VerticalAlignment="Top"></Rectangle>
                        <TextBlock Foreground="Gray" FontSize="16" Text="????????????" VerticalAlignment="Top" Margin="7,180,0,0" HorizontalAlignment="Left"  />


                        <TextBlock Foreground="White" FontSize="12" Text="34.66" VerticalAlignment="Top" Margin="8,213,0,0" HorizontalAlignment="Left" Width="50" />
                        <TextBlock Foreground="Gray" FontSize="12" Text="34.66" VerticalAlignment="Top" Margin="7,250,0,0" HorizontalAlignment="Left" Width="51" />
                        <TextBlock Foreground="Gray" FontSize="12" Text="??238?" VerticalAlignment="Top" Margin="97,250,0,0" HorizontalAlignment="Left" Width="45" />


                    </Grid>

                  
                        
                        <!--<Image Stretch="UniformToFill" Width="190"  Height="250" Source="{Binding picUrl}"></Image>
                        <TextBlock Text="{Binding title}"></TextBlock>-->
                        
                        
                        
                 



                </DataTemplate>

            </ListView.ItemTemplate>

            <ListView.ItemsPanel>
                <ItemsPanelTemplate>
                    <ItemsWrapGrid MaximumRowsOrColumns="8" Orientation="Horizontal"></ItemsWrapGrid>
                </ItemsPanelTemplate>
            </ListView.ItemsPanel>
        </ListView>

        <Button HorizontalAlignment="Left" Height="94" Margin="0,0,0,274" VerticalAlignment="Bottom" Width="415" Click="Button_Click" PointerEntered="Button_PointerEntered">gfggfgf</Button>

        <Grid  x:Name="tpbg444"   Width="232" HorizontalAlignment="Left" Height="270" VerticalAlignment="Top">
            <Rectangle RadiusX="8" RadiusY="8" Fill="White"></Rectangle>
            <Image Stretch="Fill" Source="Assets/3.png" Margin="0,2,0,0" HorizontalAlignment="Center" Height="170" VerticalAlignment="Top"/>
            <Rectangle RadiusX="8" RadiusY="8"  Height="23" Width="78" Fill="Red"  HorizontalAlignment="Left" Margin="0,210,0,0" VerticalAlignment="Top"></Rectangle>
            <TextBlock Foreground="Gray" FontSize="16" Text="????????????" VerticalAlignment="Top" Margin="7,180,0,0" HorizontalAlignment="Left"  />


            <TextBlock Foreground="White" FontSize="12" Text="34.66" VerticalAlignment="Top" Margin="8,213,0,0" HorizontalAlignment="Left" Width="50" />
            <TextBlock Foreground="Gray" FontSize="12" Text="34.66" VerticalAlignment="Top" Margin="7,250,0,0" HorizontalAlignment="Left" Width="51" />
            <TextBlock Foreground="Gray" FontSize="12" Text="??238?" VerticalAlignment="Top" Margin="97,250,0,0" HorizontalAlignment="Left" Width="45" />


        </Grid>
    </Grid>
</Page>

　　

 

转载于:https://www.cnblogs.com/wgscd/p/9629189.html

评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值