Question

我正在使用C＃/ XAML设计Windows 8.1应用程序。我试图复制Windows Phone上的倾斜效果。我用ScaleTransform和PointerDownThemeAnimation尝试了这个。

然而，规模效应似乎在Y方向上被打破。它会在页面上垂直向下推动UI元素，而不是仅将其缩小。我在8.1之前的Windows 8应用程序中使用过scale而没有出现此问题。

甚至更奇怪的是在设计视图中它工作正常。我已经尝试将RenderTransformOrigin设置为＆＃34; 0.5,0.5＆＃34;。下面是将文本块的比例设置为0.5时会发生什么的示例： enter image description here

您认为问题是什么以及如何解决？感谢

编辑：以下是大部分XAML：

<Grid Height="{Binding PalettePanelHeight}">
                <TextBlock Text="Palettes" FontSize="70" Margin="24,22,0,0"/>
                <StackPanel Orientation="Horizontal" Name="typePanel" HorizontalAlignment="Right" Margin="0,52,24,0">
                    <StackPanel.Resources>
                        <Style TargetType="TextBlock">
                            <Setter Property="Margin" Value="0,0,24,0"/>
                            <Setter Property="FontWeight" Value="Light"/>
                            <Setter Property="FontSize" Value="28"/>
                        </Style>
                    </StackPanel.Resources>
                    <TextBlock Text="Newest" Opacity="1" PointerPressed="on_PointerDown" PointerExited="on_PointerUp" PointerReleased="on_PointerUp" Tapped="newest_Tapped" RenderTransformOrigin="0.5,0.5">
                        <TextBlock.RenderTransform>
                            <ScaleTransform ScaleX="0.5" ScaleY="0.5"/>
                        </TextBlock.RenderTransform>
                    </TextBlock>
                    <TextBlock Text="Most popular" Opacity="0.45" PointerPressed="on_PointerDown" PointerExited="on_PointerUp" PointerReleased="on_PointerUp" Tapped="popular_Tapped" RenderTransformOrigin="0.5,0.5">
                        <TextBlock.RenderTransform>
                            <ScaleTransform/>
                        </TextBlock.RenderTransform>
                    </TextBlock>
                    <TextBlock Text="Highest rated" Opacity="0.45" PointerPressed="on_PointerDown" PointerExited="on_PointerUp" PointerReleased="on_PointerUp" Tapped="rating_Tapped" RenderTransformOrigin="0.5,0.5">
                        <TextBlock.RenderTransform>
                            <ScaleTransform/>
                        </TextBlock.RenderTransform>
                    </TextBlock>
                </StackPanel>

最新＆＃39;带有刻度0.5的文本块显示在示例图像中。＆＃39; PalettePanelHeight＆＃39;代码中只是Window.Current.Bounds.Height。

Answer 1

如果您想保留ScaleTransform，请使用VerticalAlignment确保文字位于顶部

<TextBlock VerticalAlignment="Top" Text="Newest" Opacity="1" RenderTransformOrigin="0.5,0.5">
                    <TextBlock.RenderTransform>
                        <ScaleTransform ScaleX="0.5" ScaleY="0.5"/>
                    </TextBlock.RenderTransform>
                </TextBlock>

如果你想像其他游戏一样保留它，请删除scaleTrandform并制作它： -

 <TextBlock VerticalAlignment="Top" Text="Newest" Opacity="1" RenderTransformOrigin="0.5,0.5">
</TextBlock>

Windows 8.1比例转换不正确

1 个答案: