加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > Windows > 正文

xaml – LongListMultiSelector中项之间的空格

发布时间:2020-12-14 02:03:29 所属栏目:Windows 来源:网络整理
导读:在我的LongListMultiSelector中,如何在项目之间设置垂直空间,使其不被选择矩形覆盖?只需在下面的XAML中添加一个边距,就会有矩形覆盖的边距. toolkit:LongListMultiSelector ItemsSource="{Binding Items}" toolkit:LongListMultiSelector.ItemTemplate Data
在我的LongListMultiSelector中,如何在项目之间设置垂直空间,使其不被选择矩形覆盖?只需在下面的XAML中添加一个边距,就会有矩形覆盖的边距.

<toolkit:LongListMultiSelector ItemsSource="{Binding Items}">
    <toolkit:LongListMultiSelector.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="Some Text" Margin="0,50" />
        </DataTemplate>
    </toolkit:LongListMultiSelector.ItemTemplate>
</toolkit:LongListMultiSelector>

我尝试选择项目时显示其行为方式的图片. (注意蓝色矩形)

下面是一个标准邮件应用程序的示例,其中项目有一些空间,但选择矩形不覆盖它. (这就是我要的)

解决方法

这是一个关于XAML基本概念的非常重要的问题:ItemsControl数据绑定. C#中的所有ItemsControl都能够获取数据类(称为“Items”)并将它们转换为可视化UIElements(称为“容器”).例如,ListBox可以从其ItemSource中获取Items,创建新的ListBoxItems并将每个项目设置为其容器的DataContext.这基本上是数据绑定如何适用于所有ItemsControls.

为什么这很有趣?因为LongListMultiSelector是另一个ItemsControl,它生成LongListMultiSelectorItems.在ListBoxItem和LongListMultiSelectorItem的情况下,实例化的DataTemplate都嵌套在ItemTemplate中,而ItemTemplate只是Container的一部分.但是,您无法从DataTemplate内部控制容器的属性.这就是为什么你在这里做的事似乎没有用.

解决方案:使用ItemContainerStyle更改Container自身的属性.

1)在具有以下C#和XAML代码的项目中打开混合:

this.DataContext = "foo bar baz".Split(' ');
<Toolkit:LongListMultiSelector ItemsSource="{Binding}">
    <Toolkit:LongListMultiSelector.ItemTemplate>
        <DataTemplate>
            <TextBlock Text="{Binding}" />
        </DataTemplate>
    </Toolkit:LongListMultiSelector.ItemTemplate>
</Toolkit:LongListMultiSelector>

2)选择LongListMultiSelector.在顶部菜单上选择“对象 – >编辑其他样式 – >编辑ItemContainerSyle – >创建空”并点击“确定”.

3)由于LongListMultiSelectorItem在Grid和List之间更改其ItemContainerStyle,您需要手动替换所有< Setter />您的样式中的元素,以及以下某个样式中的所有setter.例如,我将LongListMultiSelectorItemListStyle中的所有setter复制到我的新LongListMultiSelectorItemStyle1中.

<Style x:Key="LongListMultiSelectorItemGridStyle" TargetType="controls:LongListMultiSelectorItem">
    <Setter Property="Background" Value="Transparent"/>
    <Setter Property="BorderThickness" Value="0"/>
    <Setter Property="BorderBrush" Value="Transparent"/>
    <Setter Property="Padding" Value="0"/>
    <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
    <Setter Property="VerticalContentAlignment" Value="Stretch"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="controls:LongListMultiSelectorItem">
                <Border x:Name="LayoutRoot" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" HorizontalAlignment="{TemplateBinding HorizontalAlignment}" VerticalAlignment="{TemplateBinding VerticalAlignment}">
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="Normal"/>
                            <VisualState x:Name="MouSEOver"/>
                            <VisualState x:Name="Disabled">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="Background" Storyboard.TargetName="LayoutRoot">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="{StaticResource TransparentBrush}"/>
                                    </ObjectAnimationUsingKeyFrames>
                                    <DoubleAnimation Duration="0" To=".5" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="ContentContainer"/>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="SelectionStates">
                            <VisualState x:Name="Unselected"/>
                            <VisualState x:Name="Selected">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="SelectionTriangle">
                                        <DiscreteObjectKeyFrame KeyTime="0">
                                            <DiscreteObjectKeyFrame.Value>
                                                <Visibility>Visible</Visibility>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="SelectionCheck">
                                        <DiscreteObjectKeyFrame KeyTime="0">
                                            <DiscreteObjectKeyFrame.Value>
                                                <Visibility>Visible</Visibility>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup x:Name="HasSelectionStates">
                            <VisualState x:Name="Opened">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="SelectionRectangle">
                                        <DiscreteObjectKeyFrame KeyTime="0">
                                            <DiscreteObjectKeyFrame.Value>
                                                <Visibility>Visible</Visibility>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="OuterCover">
                                        <DiscreteObjectKeyFrame KeyTime="0">
                                            <DiscreteObjectKeyFrame.Value>
                                                <Visibility>Visible</Visibility>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Closed"/>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <Grid Margin="1" >
                        <ContentControl x:Name="ContentContainer"
                                Margin="3"
                                ContentTemplate="{TemplateBinding ContentTemplate}"
                                Content="{TemplateBinding Content}"
                                Foreground="{TemplateBinding Foreground}"
                                HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                                VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                                />
                        <Rectangle x:Name="SelectionRectangle" Visibility="Collapsed"
                                       Stroke="{StaticResource PhoneAccentBrush}" StrokeThickness="2"/>
                        <Polyline x:Name="SelectionTriangle" Visibility="Collapsed"
                                HorizontalAlignment="Right" VerticalAlignment="Top"
                                Points="50,0 50,50 0,0"
                                Fill="{StaticResource PhoneAccentBrush}"
                            />
                        <Polyline x:Name="SelectionCheck" Visibility="Collapsed"
                                Margin="5" HorizontalAlignment="Right" VerticalAlignment="Top"
                                Points="40,0 43,3 28,18 18,8 21,5 28,12"
                                Fill="{StaticResource PhoneForegroundBrush}"
                                />
                        <Grid x:Name="OuterCover" IsHitTestVisible="True" Visibility="Collapsed" Background="Transparent" VerticalAlignment="Stretch" HorizontalAlignment="Stretch"/>
                    </Grid>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

<Style x:Key="LongListMultiSelectorItemListStyle" TargetType="controls:LongListMultiSelectorItem">
    <Style.Setters>
        <Setter Property="Background" Value="{StaticResource PhoneAccentBrush}"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="controls:LongListMultiSelectorItem">
                    <Grid MinHeight="52">
                        <Grid.Resources>
                            <ExponentialEase EasingMode="EaseIn" Exponent="8" x:Key="ExponentialEaseIn"/>
                            <QuadraticEase EasingMode="EaSEOut" x:Key="QuadraticEaSEOut"/>
                        </Grid.Resources>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="SelectionEnabledStates">
                                <VisualStateGroup.Transitions>
                                    <VisualTransition x:Name="ClosedToExposed" 
                                                      From="Closed" To="Exposed"
                                                      GeneratedDuration="0:0:0.30">
                                        <Storyboard>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" 
                                                                           Storyboard.TargetName="OuterHintPanel">
                                                <EasingDoubleKeyFrame KeyTime="0:0:0.0" Value="0.0" EasingFunction="{StaticResource QuadraticEaSEOut}"/>
                                                <EasingDoubleKeyFrame KeyTime="0:0:0.30" Value="1.0" EasingFunction="{StaticResource QuadraticEaSEOut}"/>
                                            </DoubleAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualTransition>
                                    <VisualTransition x:Name="ExposedToClosed" 
                                                      From="Exposed" To="Closed"
                                                      GeneratedDuration="0:0:0.30">
                                        <Storyboard>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" 
                                                                           Storyboard.TargetName="OuterHintPanel">
                                                <EasingDoubleKeyFrame KeyTime="0:0:0.0" Value="1.0" EasingFunction="{StaticResource QuadraticEaSEOut}"/>
                                                <EasingDoubleKeyFrame KeyTime="0:0:0.30" Value="0.0" EasingFunction="{StaticResource QuadraticEaSEOut}"/>
                                            </DoubleAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualTransition>
                                    <VisualTransition x:Name="ExposedToOpened"
                                                      From="Exposed" To="Opened"
                                                      GeneratedDuration="0:0:0.30">
                                        <Storyboard>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" 
                                                                           Storyboard.TargetName="SelectBox">
                                                <EasingDoubleKeyFrame KeyTime="0:0:0.0" Value="-58" EasingFunction="{StaticResource ExponentialEaseIn}"/>
                                                <EasingDoubleKeyFrame KeyTime="0:0:0.15" Value="0" EasingFunction="{StaticResource ExponentialEaseIn}"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" 
                                                                           Storyboard.TargetName="Presenter">
                                                <EasingDoubleKeyFrame KeyTime="0:0:0.0" Value="24" EasingFunction="{StaticResource ExponentialEaseIn}"/>
                                                <EasingDoubleKeyFrame KeyTime="0:0:0.15" Value="86" EasingFunction="{StaticResource ExponentialEaseIn}"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Opacity)" 
                                                                           Storyboard.TargetName="OuterHintPanel">
                                                <EasingDoubleKeyFrame KeyTime="0:0:0.0" Value="1.0" EasingFunction="{StaticResource QuadraticEaSEOut}"/>
                                                <EasingDoubleKeyFrame KeyTime="0:0:0.30" Value="0.0" EasingFunction="{StaticResource QuadraticEaSEOut}"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" 
                                                                           Storyboard.TargetName="SelectBox">
                                                <DiscreteObjectKeyFrame KeyTime="0:0:0.0" Value="Visible"/>
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.IsHitTestVisible)" 
                                                                           Storyboard.TargetName="OuterHintPanel">
                                                <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="False"/>
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.IsHitTestVisible)" 
                                                                           Storyboard.TargetName="InnerHintPanel">
                                                <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="False"/>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualTransition>
                                    <VisualTransition x:Name="ClosedToOpened"
                                                      From="Closed" To="Opened"
                                                      GeneratedDuration="0:0:0.15">
                                        <Storyboard>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" 
                                                                           Storyboard.TargetName="SelectBox">
                                                <EasingDoubleKeyFrame KeyTime="0:0:0.0" Value="-58" EasingFunction="{StaticResource ExponentialEaseIn}"/>
                                                <EasingDoubleKeyFrame KeyTime="0:0:0.15" Value="0" EasingFunction="{StaticResource ExponentialEaseIn}"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" 
                                                                           Storyboard.TargetName="Presenter">
                                                <EasingDoubleKeyFrame KeyTime="0:0:0.0" Value="24" EasingFunction="{StaticResource ExponentialEaseIn}"/>
                                                <EasingDoubleKeyFrame KeyTime="0:0:0.15" Value="86" EasingFunction="{StaticResource ExponentialEaseIn}"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" 
                                                                           Storyboard.TargetName="SelectBox">
                                                <DiscreteObjectKeyFrame KeyTime="0:0:0.0" Value="Visible"/>
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.IsHitTestVisible)" 
                                                                           Storyboard.TargetName="OuterHintPanel">
                                                <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="False"/>
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.IsHitTestVisible)" 
                                                                           Storyboard.TargetName="InnerHintPanel">
                                                <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="False"/>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualTransition>
                                    <VisualTransition x:Name="OpenedToClosed"
                                                      From="Opened" To="Closed"
                                                      GeneratedDuration="0:0:0.15">
                                        <Storyboard>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" 
                                                                           Storyboard.TargetName="SelectBox">
                                                <EasingDoubleKeyFrame KeyTime="0:0:0.0" Value="0" EasingFunction="{StaticResource ExponentialEaseIn}"/>
                                                <EasingDoubleKeyFrame KeyTime="0:0:0.15" Value="-58" EasingFunction="{StaticResource ExponentialEaseIn}"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <DoubleAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" 
                                                                           Storyboard.TargetName="Presenter">
                                                <EasingDoubleKeyFrame KeyTime="0:0:0.0" Value="86" EasingFunction="{StaticResource ExponentialEaseIn}"/>
                                                <EasingDoubleKeyFrame KeyTime="0:0:0.15" Value="24" EasingFunction="{StaticResource ExponentialEaseIn}"/>
                                            </DoubleAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" 
                                                                           Storyboard.TargetName="SelectBox">
                                                <DiscreteObjectKeyFrame KeyTime="0:0:0.15" Value="Collapsed"/>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualTransition>
                                </VisualStateGroup.Transitions>
                                <VisualStateGroup.States>
                                    <VisualState x:Name="Closed"/>
                                    <VisualState x:Name="Exposed">
                                        <Storyboard>
                                            <DoubleAnimation Storyboard.TargetProperty="(UIElement.Opacity)" 
                                                             Storyboard.TargetName="OuterHintPanel"
                                                             Duration="0" To="1.0"/>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Opened">
                                        <Storyboard>
                                            <DoubleAnimation Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" 
                                                             Storyboard.TargetName="SelectBox"
                                                             Duration="0" To="0"/>
                                            <DoubleAnimation Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.TranslateX)" 
                                                             Storyboard.TargetName="Presenter"
                                                             Duration="0" To="86"/>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" 
                                                                           Storyboard.TargetName="SelectBox">
                                                <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="Visible"/>
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" 
                                                                           Storyboard.TargetName="OuterCover">
                                                <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="Visible"/>
                                            </ObjectAnimationUsingKeyFrames>
                                            <DoubleAnimation Storyboard.TargetProperty="(UIElement.Opacity)" 
                                                             Storyboard.TargetName="OuterHintPanel"
                                                             Duration="0" To="0.0"/>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.IsHitTestVisible)" 
                                                                           Storyboard.TargetName="OuterHintPanel">
                                                <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="False"/>
                                            </ObjectAnimationUsingKeyFrames>
                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.IsHitTestVisible)" 
                                                                           Storyboard.TargetName="InnerHintPanel">
                                                <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="False"/>
                                            </ObjectAnimationUsingKeyFrames>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup.States>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Grid HorizontalAlignment="Stretch">
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="*"/>
                                <ColumnDefinition Width="Auto"/>
                            </Grid.ColumnDefinitions>
                            <Grid Grid.Column="0" HorizontalAlignment="Stretch" primitives:ClipToBounds.IsEnabled="True">
                                <ContentPresenter x:Name="Presenter">
                                    <ContentPresenter.RenderTransform>
                                        <CompositeTransform TranslateX="24"/>
                                    </ContentPresenter.RenderTransform>
                                </ContentPresenter>
                            </Grid>
                            <Rectangle x:Name="InnerHintPanel" Grid.Column="0" Width="24"
                                       Height="{TemplateBinding HintPanelHeight}"
                                       HorizontalAlignment="Left"
                                       Fill="Transparent"
                                       StrokeThickness="0">
                                <Rectangle.RenderTransform>
                                    <CompositeTransform TranslateX="24"/>
                                </Rectangle.RenderTransform>
                            </Rectangle>
                            <ContentControl x:Name="InfoPresenter" Grid.Column="1" 
                                            VerticalAlignment="Top"
                                            Content="{TemplateBinding ContentInfo}"
                                            ContentTemplate="{TemplateBinding ContentInfoTemplate}"/>
                        </Grid>
                        <Rectangle x:Name="OuterHintPanel" Width="24"
                                   HorizontalAlignment="Left"
                                   Height="{TemplateBinding HintPanelHeight}"
                                   Fill="{TemplateBinding Background}"
                                   StrokeThickness="0" Opacity="0.0"/>
                        <Grid x:Name="OuterCover" IsHitTestVisible="True"
                              Visibility="Collapsed" Background="Transparent"/>
                        <Canvas HorizontalAlignment="Left">
                            <CheckBox x:Name="SelectBox" VerticalAlignment="Top" Margin="12,-20,5,0" Visibility="Collapsed"
                                      IsChecked="{Binding RelativeSource={RelativeSource TemplatedParent},Path=IsSelected,Mode=TwoWay}">
                                <CheckBox.RenderTransform>
                                    <CompositeTransform TranslateX="-58"/>
                                </CheckBox.RenderTransform>
                            </CheckBox>
                        </Canvas>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style.Setters>
</Style>

4)确保修复XMLNS引用,如工具包和基元.

5)现在您可以编辑样式.从顶部菜单转到“对象 – >编辑其他样式 – >编辑ItemContainerStyle – >编辑当前”.

6)将ItemContainerStyle Margin从“0”设置为“0,50,0”.

当我们使用修改后的ItemContainerStyle运行LongListMultiSelector时,我们可以看到项之间的以下空格:

重要的是要记住ItemContainerStyle是我们武器库中非常强大的武器.我们可以使用ItemContainerStyle来编辑容器的样式甚至模板.

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读