LoopingSelectorItem的单个ItemSize

时间:2014-01-22 20:34:09

标签: xaml windows-phone-8 windows-phone-toolkit

我正在尝试使用Windows phone工具包中的LoopingSelector。 选择器本身工作正常,但我对各个项目的ItemSize有问题。

我没有一个与另一个项目大小相同的项目,所以我希望每个项目只占用屏幕上的必要空间。

但我一直无法得到这种行为。任何人都有任何反馈?我已将代码附加在底部。我必须在这里错过一些明显的东西。

<Style TargetType="toolkitPrimitives:LoopingSelectorItem">
        <Setter Property="Foreground" Value="{StaticResource PhoneSubtleBrush}"/>
        <Setter Property="Padding" Value="6"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate>
                    <Border x:Name="root" CacheMode="BitmapCache" Background="Transparent" Padding="{TemplateBinding Padding}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">

                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">

                                <VisualStateGroup.Transitions>
                                    <VisualTransition From="Normal" To="Expanded" GeneratedDuration="0:0:0.33" />
                                    <VisualTransition From="Expanded" To="Normal" GeneratedDuration="0:0:0.33" />
                                </VisualStateGroup.Transitions>

                                <VisualState x:Name="Normal" />

                                <VisualState x:Name="Expanded">
                                    <Storyboard>
                                        <DoubleAnimation Storyboard.TargetName="border" Storyboard.TargetProperty="Opacity" To="0.8" Duration="0"/>
                                    </Storyboard>
                                </VisualState>

                                <VisualState x:Name="Selected">
                                    <Storyboard>
                                        <DoubleAnimation Storyboard.TargetName="Text" Storyboard.TargetProperty="Opacity" To="1" Duration="0"/>
                                        <DoubleAnimation Storyboard.TargetName="border" Storyboard.TargetProperty="Opacity" To="1" Duration="0"/>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="border" Storyboard.TargetProperty="BorderBrush" Duration="0">
                                            <ObjectAnimationUsingKeyFrames.KeyFrames>
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="DarkGray" />
                                            </ObjectAnimationUsingKeyFrames.KeyFrames>
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="contentControl" Storyboard.TargetProperty="Foreground" Duration="0">
                                            <ObjectAnimationUsingKeyFrames.KeyFrames>
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="White" />
                                            </ObjectAnimationUsingKeyFrames.KeyFrames>
                                        </ObjectAnimationUsingKeyFrames>

                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="contentControl" Storyboard.TargetProperty="FontWeight" Duration="0">
                                            <ObjectAnimationUsingKeyFrames.KeyFrames>
                                                <DiscreteObjectKeyFrame KeyTime="0" Value="Bold" />
                                            </ObjectAnimationUsingKeyFrames.KeyFrames>
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>

                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>

                        <Border.RenderTransform>
                            <TranslateTransform x:Name="Transform"/>
                        </Border.RenderTransform>

                        <Grid HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
                            <Rectangle x:Name="background" Margin="0" Opacity="0" Fill="{StaticResource PhoneAccentBrush}" CacheMode="BitmapCache"/>

                            <Border x:Name="border" Opacity="0" BorderThickness="0" BorderBrush="{StaticResource PhoneSubtleBrush}" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
                                <ContentControl x:Name="contentControl" HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch" VerticalAlignment="Stretch" VerticalContentAlignment="Stretch">
                                    <TextBlock x:Name="Text" TextWrapping="Wrap" Opacity="0.7" Text="{Binding Text}" Foreground="{StaticResource PhoneForegroundBrush}" VerticalAlignment="Stretch" HorizontalAlignment="Stretch" />
                                </ContentControl>
                            </Border>
                        </Grid>

                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

    <toolkitPrimitives:LoopingSelector x:Name="LoopingSelector" ItemMargin="10" ItemSize="430,120"   HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />

1 个答案:

答案 0 :(得分:1)

我看到几个VerticalAlignment值设置为“stretch”。这将垂直拉伸元素,直到它填充其父元素。尝试将这些元素的Height属性设置为“auto”。 VerticalAlignment值应该被删除或设置为除“拉伸”之外的任何值。 Width和Horizo​​ntalAlignment也一样。

<Border.RenderTransform>
    <TranslateTransform x:Name="Transform"/>
</Border.RenderTransform>
<Grid HorizontalAlignment="Stretch" Height="auto">
    <Rectangle x:Name="background" Margin="0" Opacity="0" Fill="{StaticResource PhoneAccentBrush}" CacheMode="BitmapCache"/>
    <Border x:Name="border" Opacity="0" BorderThickness="0" BorderBrush="{StaticResource PhoneSubtleBrush}" Height="auto" HorizontalAlignment="Stretch">
        <ContentControl x:Name="contentControl" HorizontalAlignment="Stretch" HorizontalContentAlignment="Stretch" Height="auto" VerticalContentAlignment="Stretch">
            <TextBlock x:Name="Text" TextWrapping="Wrap" Opacity="0.7" Text="{Binding Text}" Foreground="{StaticResource PhoneForegroundBrush}" Height="auto" HorizontalAlignment="Stretch" />
        </ContentControl>
    </Border>
</Grid>