0

经过LongListMultiSelector一段时间的测试，我注意到如果它们的总高度不超过屏幕高度，它会使它的元素更宽一些，如果它们超过屏幕高度，它会更短一些。

以下是说明此行为的两张图片：

LongListMultiSelector 的高度超过了屏幕，并且 2 和屏幕边缘之间有一个空间。
在此处输入图像描述

LongListMultiSelector 的高度不超过屏幕，并且 2 和屏幕边缘之间没有空间。
在此处输入图像描述

这是我的 XAML： 

<toolkit:LongListMultiSelector ItemsSource="{Binding}">
    <toolkit:LongListMultiSelector.ItemTemplate>
        <DataTemplate>
            <Grid Margin="0,0,24,0">
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="Auto" />
                </Grid.ColumnDefinitions>

                <TextBlock FontSize="30" Text="1" Grid.Column="0" />
                <TextBlock FontSize="30" Text="2" Grid.Column="1" />
            </Grid>
        </DataTemplate>
    </toolkit:LongListMultiSelector.ItemTemplate>
</toolkit:LongListMultiSelector>

如何更改此行为以使项目的宽度始终相同？

4

1 回答 1

1

这是因为当内容大于屏幕高度时会添加滚动条。您可以通过在 LongListMultiSelector 的模板内修改底层 LongListSelector 的样式来移除滚动条。

<phone:PhoneApplicationPage.Resources>
    <Style x:Key="LongListSelectorStyle1" TargetType="phone:LongListSelector">
        <Setter Property="Background" Value="Transparent"/>
        <Setter Property="Foreground" Value="{StaticResource PhoneForegroundBrush}"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="phone:LongListSelector">
                    <Grid Background="{TemplateBinding Background}" d:DesignWidth="480" d:DesignHeight="800">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="ScrollStates">
                                <VisualStateGroup.Transitions>
                                    <VisualTransition GeneratedDuration="00:00:00.5"/>
                                </VisualStateGroup.Transitions>
                                <VisualState x:Name="Scrolling">
                                    <Storyboard>
                                        <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="VerticalScrollBar"/>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="NotScrolling"/>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>

                        <!-- We change the default template here so that the scrollbar appears ON TOP of the content -->
                        <Grid Margin="{TemplateBinding Padding}">
                            <ViewportControl x:Name="ViewportControl" VerticalAlignment="Top" HorizontalContentAlignment="Stretch"/>
                            <ScrollBar x:Name="VerticalScrollBar" Opacity="0" Margin="4,0,4,0" Orientation="Vertical" HorizontalAlignment="Right"/>
                        </Grid>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <ControlTemplate x:Key="LongListMultiSelectorControlTemplate1" TargetType="toolkit:LongListMultiSelector">
        <phone:LongListSelector x:Name="InnerSelector"
            GridCellSize="{TemplateBinding GridCellSize}"
            GroupFooterTemplate="{TemplateBinding GroupFooterTemplate}"
            GroupHeaderTemplate="{TemplateBinding GroupHeaderTemplate}"
            HideEmptyGroups="{TemplateBinding HideEmptyGroups}"
            IsGroupingEnabled="{TemplateBinding IsGroupingEnabled}"
            ItemsSource="{TemplateBinding ItemsSource}"
            JumpListStyle="{TemplateBinding JumpListStyle}"
            ListFooter="{TemplateBinding ListFooter}"
            ListFooterTemplate="{TemplateBinding ListFooterTemplate}"
            ListHeader="{TemplateBinding ListHeader}"
            ListHeaderTemplate="{TemplateBinding ListHeaderTemplate}"
            Style="{StaticResource LongListSelectorStyle1}"
            >
            <phone:LongListSelector.ItemTemplate>
                <DataTemplate>
                    <toolkit:LongListMultiSelectorItem
                        x:Name="LLSItem"
                        HorizontalContentAlignment="Stretch"
                        VerticalAlignment="Stretch"
                        Content="{Binding}"
                            />
                </DataTemplate>
            </phone:LongListSelector.ItemTemplate>
        </phone:LongListSelector>
    </ControlTemplate>
</phone:PhoneApplicationPage.Resources>

<Grid x:Name="LayoutRoot">
    <!-- The width of the items in this LLMS will not change -->
    <toolkit:LongListMultiSelector Template="{StaticResource LongListMultiSelectorControlTemplate1}"/>
</Grid>
于 2013-03-02T23:33:16.703 回答