0

しばらくテストLongListMultiSelectorした後、合計で画面の高さを超えない場合は要素が少し広くなり、超える場合は少し短くなることに気付きました。

この動作を示す 2 つの画像を次に示します。

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 に答える