WP8.1 模仿手机通讯记录的选择框
2016年11月6日 更新：
其实 这个有一个非常简单的方法.非常简单...
ListView SelectionMode="Multiple"
这个一XAML 代码就可以解决了..
制作侧边点击效果也是和上一个一样的，等我找时间 弄一下
建议使用ItemsControl作为列表，使用ListView的时候，ListView的方法ContainerFromItem会在当数据超出15的时候出现错误 实在是没招使用了ItemsControl外套上ScrollViewer就可以了，然后将所有的For循环替换模板的方法直接变成 PivotItem_Listview.ItemTemplate = this.Resources["LvItem"] as DataTemplate; 或者
PivotItem_Listview.ItemTemplate = this.Resources["LvItem1"] as DataTemplate; 就可以了
好吧 我承认 突然之间原现那个又可以了..不要问我为什么 我也不知道
模仿WP8.1 通讯记录的ChenkBox的方式
这个是我写出来的效果
首先得有两套DataTemplate，一套是没开启ChenkBox，一套是开启的ChenkBox的 当然还有绑定的资源，这个随意啦
<FontFamily x:Key="ContentControlThemeFontFamily">Segoe WP</FontFamily> <x:Double x:Key="ControlContentThemeFontSize">12</x:Double> <Thickness x:Key="ListViewItemMargin">0</Thickness> <SolidColorBrush x:Key="CheckBoxBackgroundThemeBrush" Color="Transparent"/> <x:Double x:Key="CheckBoxBorderThemeThickness">2.5</x:Double> <x:Double x:Key="ListViewItemContentOffsetX">-40.5</x:Double> <Thickness x:Key="ListViewItemMultiselectCheckBoxMargin">0,9.5,0,0</Thickness> <Thickness x:Key="GridViewItemMultiselectBorderThickness">2.5</Thickness> <x:Double x:Key="ListViewItemDisabledThemeOpacity">0.4</x:Double> <x:Double x:Key="ListViewItemContentTranslateX">40.5</x:Double> <x:Double x:Key="ListViewItemReorderHintThemeOffset">32</x:Double> <Style x:Key="ListViewItemStyle1" TargetType="ListViewItem"> <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}"/> <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}"/> <Setter Property="Background" Value="Transparent"/> <Setter Property="TabNavigation" Value="Local"/> <Setter Property="IsHoldingEnabled" Value="False"/> <Setter Property="Margin" Value="{ThemeResource ListViewItemMargin}"/> <Setter Property="HorizontalContentAlignment" Value="Left"/> <Setter Property="VerticalContentAlignment" Value="Top"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="ListViewItem"> <Border x:Name="OuterContainer" RenderTransformOrigin="0.5,0.5"> <Border.RenderTransform> <ScaleTransform x:Name="ContentScaleTransform"/> </Border.RenderTransform> <VisualStateManager.VisualStateGroups> <VisualStateGroup x:Name="CommonStates"> <VisualStateGroup.Transitions> <VisualTransition From="Pressed" To="Normal"> <Storyboard> <PointerUpThemeAnimation Storyboard.TargetName="TiltContainer"/> </Storyboard> </VisualTransition> </VisualStateGroup.Transitions> <VisualState x:Name="Normal"/> <VisualState x:Name="Pressed"> <!--<Storyboard> <PointerDownThemeAnimation Storyboard.TargetName="TiltContainer"/> </Storyboard>--> </VisualState> <VisualState x:Name="CheckboxPressed"> <Storyboard> <PointerDownThemeAnimation Storyboard.TargetName="CheckboxTiltContainer"/> <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="NormalRectangle"> <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource CheckBoxPressedBackgroundThemeBrush}"/> </ObjectAnimationUsingKeyFrames> <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="CheckGlyph"> <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource CheckBoxPressedForegroundThemeBrush}"/> </ObjectAnimationUsingKeyFrames> </Storyboard> </VisualState> <VisualState x:Name="Disabled"> <Storyboard> <DoubleAnimation Duration="0" To="{ThemeResource ListViewItemDisabledThemeOpacity}" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="contentPresenter"/> <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetProperty="Stroke" Storyboard.TargetName="NormalRectangle"> <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource CheckBoxDisabledBorderThemeBrush}"/> </ObjectAnimationUsingKeyFrames> <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetProperty="Fill" Storyboard.TargetName="CheckGlyph"> <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource CheckBoxDisabledForegroundThemeBrush}"/> </ObjectAnimationUsingKeyFrames> <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="SelectedBorder"> <DiscreteObjectKeyFrame KeyTime="0" Value="Transparent"/> </ObjectAnimationUsingKeyFrames> <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetProperty="Fill" Storyboard.TargetName="SelectedEarmark"> <DiscreteObjectKeyFrame KeyTime="0" Value="Transparent"/> </ObjectAnimationUsingKeyFrames> <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetProperty="Fill" Storyboard.TargetName="SelectedGlyph"> <DiscreteObjectKeyFrame KeyTime="0" Value="Transparent"/> </ObjectAnimationUsingKeyFrames> </Storyboard> </VisualState> </VisualStateGroup> <VisualStateGroup x:Name="SelectionStates"> <VisualState x:Name="Unselected"/> <VisualState x:Name="Selected"> <Storyboard> <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="CheckGlyph"/> <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="SelectedCheckMark"/> </Storyboard> </VisualState> <VisualState x:Name="SelectedUnfocused"> <Storyboard> <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="CheckGlyph"/> <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="SelectedCheckMark"/> </Storyboard> </VisualState> </VisualStateGroup> <VisualStateGroup x:Name="DataVirtualizationStates"> <VisualState x:Name="DataAvailable"/> <VisualState x:Name="DataPlaceholder"> <Storyboard> <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetProperty="Visibility" Storyboard.TargetName="PlaceholderTextBlock"> <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/> </ObjectAnimationUsingKeyFrames> <ObjectAnimationUsingKeyFrames Duration="0" Storyboard.TargetProperty="Visibility" Storyboard.TargetName="PlaceholderRect"> <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/> </ObjectAnimationUsingKeyFrames> </Storyboard> </VisualState> </VisualStateGroup> <VisualStateGroup x:Name="MultiSelectStates"> <VisualStateGroup.Transitions> <VisualTransition From="ListMultiSelect" GeneratedDuration="0:0:0.15" To="NoMultiSelect"/> <VisualTransition From="NoMultiSelect" GeneratedDuration="0:0:0.15" To="ListMultiSelect"/> </VisualStateGroup.Transitions> <VisualState x:Name="NoMultiSelect"/> <VisualState x:Name="ListMultiSelect"> <Storyboard> <DoubleAnimation Duration="0" To="0" Storyboard.TargetProperty="X" Storyboard.TargetName="CheckboxContainerTranslateTransform"/> <DoubleAnimation Duration="0" To="{ThemeResource ListViewItemContentTranslateX}" Storyboard.TargetProperty="X" Storyboard.TargetName="ContentBorderTranslateTransform"/> </Storyboard> </VisualState> <VisualState x:Name="GridMultiSelect"> <Storyboard> <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="SelectedBorder"/> </Storyboard> </VisualState> </VisualStateGroup> <VisualStateGroup x:Name="ReorderModeStates"> <VisualStateGroup.Transitions> <VisualTransition From="ReorderEnabled" GeneratedDuration="00:00:00.2" To="ReorderDisabled"/> </VisualStateGroup.Transitions> <VisualState x:Name="ReorderEnabled"> <Storyboard> <DropTargetItemThemeAnimation Storyboard.TargetName="OuterContainer"/> </Storyboard> </VisualState> <VisualState x:Name="Reorderable"> <Storyboard> <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="ScaleX" Storyboard.TargetName="ContentScaleTransform"> <LinearDoubleKeyFrame KeyTime="00:00:00.075" Value="1.05"/> <LinearDoubleKeyFrame KeyTime="00:00:00.2" Value="1.0"/> </DoubleAnimationUsingKeyFrames> <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="ScaleY" Storyboard.TargetName="ContentScaleTransform"> <LinearDoubleKeyFrame KeyTime="00:00:00.075" Value="1.05"/> <LinearDoubleKeyFrame KeyTime="00:00:00.2" Value="1.0"/> </DoubleAnimationUsingKeyFrames> </Storyboard> </VisualState> <VisualState x:Name="ReorderDisabled"/> </VisualStateGroup> <VisualStateGroup x:Name="ReorderHintStates"> <VisualStateGroup.Transitions> <VisualTransition GeneratedDuration="0:0:0.2" To="NoReorderHint"/> </VisualStateGroup.Transitions> <VisualState x:Name="NoReorderHint"/> <VisualState x:Name="BottomReorderHint"> <Storyboard> <DragOverThemeAnimation Direction="Bottom" ToOffset="{ThemeResource ListViewItemReorderHintThemeOffset}" Storyboard.TargetName="ReorderHintContent"/> </Storyboard> </VisualState> <VisualState x:Name="RightReorderHint"> <Storyboard> <DragOverThemeAnimation Direction="Right" ToOffset="{ThemeResource ListViewItemReorderHintThemeOffset}" Storyboard.TargetName="ReorderHintContent"/> </Storyboard> </VisualState> <VisualState x:Name="TopReorderHint"> <Storyboard> <DragOverThemeAnimation Direction="Top" ToOffset="0" Storyboard.TargetName="ReorderHintContent"/> </Storyboard> </VisualState> <VisualState x:Name="LeftReorderHint"> <Storyboard> <DragOverThemeAnimation Direction="Left" ToOffset="0" Storyboard.TargetName="ReorderHintContent"/> </Storyboard> </VisualState> </VisualStateGroup> </VisualStateManager.VisualStateGroups> <Grid x:Name="ReorderHintContent" Background="Transparent"> <Border x:Name="CheckboxTiltContainer" HorizontalAlignment="Left" Margin="{ThemeResource ListViewItemMultiselectCheckBoxMargin}" VerticalAlignment="Top"> <Border x:Name="CheckboxOuterContainer"> <Border.Clip> <RectangleGeometry Rect="0,0,25.5,25.5"/> </Border.Clip> <Grid x:Name="CheckboxContainer"> <Grid.RenderTransform> <TranslateTransform x:Name="CheckboxContainerTranslateTransform" X="{ThemeResource ListViewItemContentOffsetX}"/> </Grid.RenderTransform> <Rectangle x:Name="NormalRectangle" Fill="{ThemeResource CheckBoxBackgroundThemeBrush}" Height="25.5" Stroke="{ThemeResource CheckBoxBorderThemeBrush}" StrokeThickness="{ThemeResource CheckBoxBorderThemeThickness}" Width="25.5"/> <Path x:Name="CheckGlyph" Data="M0,123 L39,93 L124,164 L256,18 L295,49 L124,240 z" Fill="{ThemeResource CheckBoxForegroundThemeBrush}" FlowDirection="LeftToRight" HorizontalAlignment="Center" Height="17" IsHitTestVisible="False" Opacity="0" Stretch="Fill" StrokeThickness="2.5" StrokeLineJoin="Round" VerticalAlignment="Center" Width="18.5"/> </Grid> </Border> </Border> <Border x:Name="ContentContainer"> <Border x:Name="TiltContainer"> <Border x:Name="ContentBorder" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}"> <Border.RenderTransform> <TranslateTransform x:Name="ContentBorderTranslateTransform"/> </Border.RenderTransform> <Grid> <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding ContentTemplate}" ContentTransitions="{TemplateBinding ContentTransitions}" Content="{TemplateBinding Content}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> <TextBlock x:Name="PlaceholderTextBlock" AutomationProperties.AccessibilityView="Raw" Foreground="{x:Null}" IsHitTestVisible="False" Margin="{TemplateBinding Padding}" Opacity="0" Text="Xg"/> <Rectangle x:Name="PlaceholderRect" Fill="{ThemeResource ListViewItemPlaceholderBackgroundThemeBrush}" IsHitTestVisible="False" Visibility="Collapsed"/> </Grid> </Border> </Border> </Border> <Border x:Name="SelectedBorder" BorderBrush="{ThemeResource ListViewItemSelectedBackgroundThemeBrush}" BorderThickness="{ThemeResource GridViewItemMultiselectBorderThickness}" IsHitTestVisible="False" Opacity="0"> <Grid x:Name="SelectedCheckMark" HorizontalAlignment="Right" Height="34" Opacity="0" VerticalAlignment="Top" Width="34"> <Path x:Name="SelectedEarmark" Data="M0,0 L40,0 L40,40 z" Fill="{ThemeResource ListViewItemSelectedBackgroundThemeBrush}" Stretch="Fill"/> <Path x:Name="SelectedGlyph" Data="M0,123 L39,93 L124,164 L256,18 L295,49 L124,240 z" Fill="{ThemeResource ListViewItemCheckThemeBrush}" FlowDirection="LeftToRight" HorizontalAlignment="Right" Height="14.5" Margin="0,1,1,0" Stretch="Fill" VerticalAlignment="Top" Width="17"/> </Grid> </Border> </Grid> </Border> </ControlTemplate> </Setter.Value> </Setter> </Style> <Thickness x:Key="PhoneBorderThickness">2.5</Thickness> <x:Double x:Key="TextStyleLargeFontSize">18.14</x:Double> <FontFamily x:Key="PhoneFontFamilyNormal">Segoe WP</FontFamily> <Thickness x:Key="CheckBoxAndRadioButtonTextPaddingThickness">8,0,0,0</Thickness> <x:Double x:Key="CheckBoxAndRadioButtonMinWidthSize">168</x:Double> <Thickness x:Key="PhoneTouchTargetLargeOverhang">0,16</Thickness> <SolidColorBrush x:Key="CheckBoxDisabledBackgroundThemeBrush" Color="Transparent"/> <Style x:Key="CheckBoxStyle1" TargetType="CheckBox"> <Setter Property="Background" Value="{ThemeResource CheckBoxBackgroundThemeBrush}"/> <Setter Property="BorderBrush" Value="{ThemeResource CheckBoxBorderThemeBrush}"/> <Setter Property="BorderThickness" Value="{ThemeResource PhoneBorderThickness}"/> <Setter Property="FontSize" Value="{ThemeResource TextStyleLargeFontSize}"/> <Setter Property="FontFamily" Value="{ThemeResource PhoneFontFamilyNormal}"/> <Setter Property="HorizontalContentAlignment" Value="Left"/> <Setter Property="VerticalContentAlignment" Value="Top"/> <Setter Property="HorizontalAlignment" Value="Left"/> <Setter Property="VerticalAlignment" Value="Top"/> <Setter Property="Padding" Value="{ThemeResource CheckBoxAndRadioButtonTextPaddingThickness}"/> <Setter Property="MinWidth" Value="{ThemeResource CheckBoxAndRadioButtonMinWidthSize}"/> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="CheckBox"> <Grid Background="Transparent"> <VisualStateManager.VisualStateGroups> <VisualStateGroup x:Name="CommonStates"> <VisualStateGroup.Transitions> <VisualTransition From="Pressed" To="PointerOver"> <Storyboard> <PointerUpThemeAnimation Storyboard.TargetName="Grid"/> </Storyboard> </VisualTransition> <VisualTransition From="PointerOver" To="Normal"> <Storyboard> <PointerUpThemeAnimation Storyboard.TargetName="Grid"/> </Storyboard> </VisualTransition> <VisualTransition From="Pressed" To="Normal"> <Storyboard> <PointerUpThemeAnimation Storyboard.TargetName="Grid"/> </Storyboard> </VisualTransition> </VisualStateGroup.Transitions> <VisualState x:Name="Normal"/> <VisualState x:Name="MouseOver"/> <VisualState x:Name="PointerOver"/> <VisualState x:Name="Pressed"> <Storyboard> <PointerDownThemeAnimation Storyboard.TargetName="Grid"/> <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="CheckBackground"> <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource CheckBoxPressedBackgroundThemeBrush}"/> </ObjectAnimationUsingKeyFrames> <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="CheckGlyph"> <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource CheckBoxPressedForegroundThemeBrush}"/> </ObjectAnimationUsingKeyFrames> <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="NormalRectangle"> <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource CheckBoxPressedBackgroundThemeBrush}"/> </ObjectAnimationUsingKeyFrames> </Storyboard> </VisualState> <VisualState x:Name="Disabled"> <Storyboard> <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="BorderBrush" Storyboard.TargetName="CheckBackground"> <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource CheckBoxDisabledBorderThemeBrush}"/> </ObjectAnimationUsingKeyFrames> <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="CheckGlyph"> <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource CheckBoxDisabledForegroundThemeBrush}"/> </ObjectAnimationUsingKeyFrames> <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Fill" Storyboard.TargetName="NormalRectangle"> <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource CheckBoxDisabledBackgroundThemeBrush}"/> </ObjectAnimationUsingKeyFrames> <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Foreground" Storyboard.TargetName="ContentPresenter"> <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource CheckBoxDisabledForegroundThemeBrush}"/> </ObjectAnimationUsingKeyFrames> </Storyboard> </VisualState> </VisualStateGroup> <VisualStateGroup x:Name="CheckStates"> <VisualState x:Name="Checked"> <Storyboard> <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="CheckGlyph"> <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/> </ObjectAnimationUsingKeyFrames> </Storyboard> </VisualState> <VisualState x:Name="Unchecked"/> <VisualState x:Name="Indeterminate"> <Storyboard> <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Visibility" Storyboard.TargetName="NormalRectangle"> <DiscreteObjectKeyFrame KeyTime="0" Value="Visible"/> </ObjectAnimationUsingKeyFrames> </Storyboard> </VisualState> </VisualStateGroup> </VisualStateManager.VisualStateGroups> <Grid x:Name="Grid"> <Grid.ColumnDefinitions> <ColumnDefinition Width="25.5"/> <ColumnDefinition Width="*"/> </Grid.ColumnDefinitions> <Grid Grid.Column="0" VerticalAlignment="Top"> <Border x:Name="CheckBackground" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" HorizontalAlignment="Left" Height="25.5" IsHitTestVisible="False" VerticalAlignment="Center" Width="25.5"/> <Rectangle x:Name="NormalRectangle" Fill="{ThemeResource CheckBoxBackgroundThemeBrush}" HorizontalAlignment="Center" Height="13" IsHitTestVisible="False" Visibility="Collapsed" VerticalAlignment="Center" Width="13"/> <Path x:Name="CheckGlyph" Data="M0,123 L39,93 L124,164 L256,18 L295,49 L124,240 z" Fill="{ThemeResource CheckBoxForegroundThemeBrush}" FlowDirection="LeftToRight" HorizontalAlignment="Center" Height="17" IsHitTestVisible="False" Stretch="Fill" StrokeThickness="2.5" StrokeLineJoin="Round" Visibility="Collapsed" VerticalAlignment="Center" Width="18.5"/> </Grid> <ContentPresenter x:Name="ContentPresenter" AutomationProperties.AccessibilityView="Raw" ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" Grid.Column="1" Foreground="{TemplateBinding Foreground}" FontWeight="Normal" FontSize="{ThemeResource TextStyleLargeFontSize}" FontFamily="{ThemeResource PhoneFontFamilyNormal}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" Margin="{TemplateBinding Padding}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/> </Grid> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> <DataTemplate x:Key="LvItem1" > <!--<Grid x:Name="The_Fast_Gird" Width="{Binding DataWidth}" Height="140"> <Grid.ColumnDefinitions> <ColumnDefinition Width="18*" /> <ColumnDefinition Width="217*"/> </Grid.ColumnDefinitions> <Grid x:Name="The_Fast_Gird_InGird" Grid.Column="1" > <Grid.Resources> <Storyboard x:Name="ListView_Word_Start"> <DoubleAnimation From="1" To="0" Duration="0:0:0.2" AutoReverse="False" EnableDependentAnimation="True" Storyboard.TargetName="The_Chenkbox_Storyboard_Border" Storyboard.TargetProperty="Opacity"/> </Storyboard> </Grid.Resources> <Border Background="Transparent" > <FlyoutBase.AttachedFlyout> <MenuFlyout> <MenuFlyoutItem Text="删除" /> </MenuFlyout> </FlyoutBase.AttachedFlyout> <Grid> <Grid.RowDefinitions> <RowDefinition Height="9*"/> <RowDefinition Height="19*"/> </Grid.RowDefinitions> <Border > <TextBlock Text="{Binding DataName}" FontSize="30"/> </Border> <Border Grid.Row="1"> <TextBlock FontSize="20" TextWrapping="Wrap" Text="{Binding DataWord}"/> </Border> </Grid> </Border> </Grid> <Grid x:Name="The_Gird_InLeftGird" Tapped="The_Gird_InLeftGird_Tapped"> <Border x:Name="The_Chenkbox_Storyboard_Border" Background="Transparent" > </Border> <Border x:Name="The_Chenkbox_Border" Tapped="The_Gird_InLeftGird_Tapped" Visibility="Visible"> </Border> <CheckBox x:Name="The_Grid_ChenkBox" IsThreeState="False"/> </Grid> </Grid>--> <Grid x:Name="The_Fast_Gird" Width="{Binding DataWidth}" Height="140"> <Grid.ColumnDefinitions> <ColumnDefinition Width="18*" /> <ColumnDefinition Width="217*"/> </Grid.ColumnDefinitions> <Grid x:Name="The_Fast_Gird_InGird" Grid.Column="1" > <Grid.Resources> <Storyboard x:Name="ListView_Word_Start"> <DoubleAnimation From="1" To="0" Duration="0:0:0.2" AutoReverse="False" EnableDependentAnimation="True" Storyboard.TargetName="The_Chenkbox_Storyboard_Border" Storyboard.TargetProperty="Opacity"/> </Storyboard> </Grid.Resources> <Border Background="Transparent" > <FlyoutBase.AttachedFlyout> <MenuFlyout> <MenuFlyoutItem Text="删除" /> </MenuFlyout> </FlyoutBase.AttachedFlyout> <Grid> <Grid.RowDefinitions> <RowDefinition Height="9*"/> <RowDefinition Height="19*"/> </Grid.RowDefinitions> <Border > <TextBlock Text="{Binding DataName}" FontSize="30"/> </Border> <Border Grid.Row="1"> <TextBlock FontSize="20" TextWrapping="Wrap" Text="{Binding DataWord}"/> </Border> </Grid> </Border> </Grid> <Grid> <Grid.RowDefinitions> <RowDefinition Height="27*"/> <RowDefinition Height="113*"/> </Grid.RowDefinitions> <CheckBox x:Name="The_Grid_ChenkBox" IsThreeState="False" Style="{StaticResource CheckBoxStyle1}" /> <Grid x:Name="The_Gird_InLeftGird" Grid.Row="1" Tapped="The_Gird_InLeftGird_Tapped"> <Border Grid.RowSpan="2" x:Name="The_Chenkbox_Storyboard_Border" Background="Transparent" > </Border> <Border x:Name="The_Chenkbox_Border" Visibility="Visible"> </Border> </Grid> </Grid> </Grid> </DataTemplate> <DataTemplate x:Key="LvItem" > <Grid x:Name="The_Fast_Gird" Holding="The_Fast_Gird_Holding" Width="{Binding DataWidth}" Height="140"> <FlyoutBase.AttachedFlyout> <MenuFlyout> <MenuFlyoutItem Text="删除" /> </MenuFlyout> </FlyoutBase.AttachedFlyout> <Grid.ColumnDefinitions> <ColumnDefinition Width="10*" /> <ColumnDefinition Width="217*"/> </Grid.ColumnDefinitions> <Grid x:Name="The_Fast_Gird_InGird" Grid.Column="1" > <Grid.Resources> <Storyboard x:Name="ListView_Word_Start"> <DoubleAnimation From="1" To="0" Duration="0:0:0.5" AutoReverse="False" EnableDependentAnimation="True" Storyboard.TargetName="The_Chenkbox_Storyboard_Border" Storyboard.TargetProperty="Opacity"/> </Storyboard> </Grid.Resources> <Border Background="Transparent" > <Grid> <Grid.RowDefinitions> <RowDefinition Height="9*"/> <RowDefinition Height="19*"/> </Grid.RowDefinitions> <Border > <TextBlock Text="{Binding DataName}" FontSize="30"/> </Border> <Border Grid.Row="1"> <TextBlock FontSize="20" TextWrapping="Wrap" Text="{Binding DataWord}"/> </Border> </Grid> </Border> </Grid> <Grid x:Name="The_Gird_InLeftGird" Tapped="The_Gird_InLeftGird_Tapped"> <Border x:Name="The_Chenkbox_Storyboard_Border" Background="Transparent" > </Border> <Border x:Name="The_Chenkbox_Border" Visibility="Collapsed"> <CheckBox x:Name="The_Grid_ChenkBox" IsThreeState="False"/> </Border> </Grid> </Grid> </DataTemplate>
之后内，这其中未开启的ChenkBox的模板中，有动画，也有一个渐变色的Border。然后加上一个Tapped事件就OK了
private async void The_Gird_InLeftGird_Tapped(object sender, TappedRoutedEventArgs e) { ItemShowChenkBox_Nub++;//计数器 if (ItemShowChenkBox_Nub == 1) { ItemLeftGird = ((Grid)sender) as Grid; ItemColorBorder = ItemLeftGird.FindName("The_Chenkbox_Storyboard_Border") as Border; ItemGird = ItemLeftGird.FindName("The_Fast_Gird") as Grid; ItemLeftStoryboard = ItemLeftGird.FindName("ListView_Word_Start") as Storyboard; ItemChenkBoxBorder = ItemLeftGird.FindName("The_Chenkbox_Border") as Border; ItemColorBorder.Background = new SolidColorBrush(Colors.Green);//变色 var grid_cd = ItemGird.ColumnDefinitions;//更改列表的宽度 var the_get_CD = grid_cd.ElementAt(0); the_get_CD.Width = new GridLength(18, GridUnitType.Star); ItemLeftStoryboard.Begin();//开启动画 var DataCount = await GetSaveWord.GetData(); for (int i = 0; i < DataCount.Count; i++) { var Getlistview_Item = PivotItem_Listview.ContainerFromItem(PivotItem_Listview.Items.ElementAt(i)) as ListViewItem;//获取每一个ListViewItem Getlistview_Item.ContentTemplate = this.Resources["LvItem1"] as DataTemplate;//更换模板 }
for (int i = 0; i < PivotItem_Listview.Items.Count; i++)
{
var Getlistview_Item = PivotItem_Listview.ContainerFromItem(PivotItem_Listview.Items.ElementAt(i)) as ListViewItem;//获取每一个ListViewItem
Getlistview_Item.ContentTemplate = this.Resources["LvItem1"] as DataTemplate;//更换模板
}
ItemLeftStoryboard.Completed += ItemLeftStoryboard_Completed; } if (ItemShowChenkBox_Nub == 2 )//第二次按下的时候 换回没有开启ChenkBox的模板 { var DataCount = await GetSaveWord.GetData();
for (int i = 0; i < PivotItem_Listview.Items.Count; i++) { var Getlistview_Item = PivotItem_Listview.ContainerFromItem(PivotItem_Listview.Items.ElementAt(i)) as ListViewItem; Getlistview_Item.ContentTemplate = this.Resources["LvItem"] as DataTemplate; } ItemShowChenkBox_Nub = 0; } } void ItemLeftStoryboard_Completed(object sender, object e) { // ItemChenkBoxBorder.Visibility = Visibility.Visible;//开启隐藏的ChenkBOX ItemColorBorder.Visibility = Visibility.Collapsed; }
