ScaleTransform无法正常工作

Question

我的想法是创建自定义平铺控件，用作 Live Tile （将其渲染为位图图像并用作平铺背景）并在我的应用程序中 LongListSelector 。通过对两种方案使用相同的控件，可以确保它看起来完全相同。

这是我的自定义平铺控件的简短示例：

public class Tile : ContentControl
{
    public override void OnApplyTemplate()
    {
        base.OnApplyTemplate();

        Content = GetTileLayout();
    }

    private Grid GetTileLayout()
    {
        double width = 336;
        double height = 336;

        StackPanel panel = new StackPanel();
        TextBlock contentTextBlock = new TextBlock();
        // ...            

        Grid layoutRoot = new Grid();
        layoutRoot.Background = new SolidColorBrush(Colors.Red);
        layoutRoot.VerticalAlignment = System.Windows.VerticalAlignment.Stretch;
        layoutRoot.HorizontalAlignment = System.Windows.HorizontalAlignment.Stretch;
        layoutRoot.Width = width;
        layoutRoot.Height = height;
        layoutRoot.Children.Add(panel);
        layoutRoot.Measure(new Size(width, height));
        layoutRoot.Arrange(new Rect(0, 0, width, height));
        layoutRoot.UpdateLayout();

        return layoutRoot;
    }
}

如果我想在 LongListSelector 中使用它，则需要将其从336x336缩小到200x200像素。我用一个简单的 ScaleTransform 尝试了它，但结果与我的预期不一样。

<phone:LongListSelector x:Name="ItemList" ItemsSource="{Binding Items}" LayoutMode="Grid" GridCellSize="222,222">
    <phone:LongListSelector.ItemTemplate>       
        <StackPanel Margin="12,12,0,0" Background="Blue">
            <DataTemplate>
                <common:Tile VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
                    <common:Tile.RenderTransform>
                        <ScaleTransform ScaleX="0.5" ScaleY="0.5" />
                    </common:Tile.RenderTransform>
                </common:Tile>
            </DataTemplate>
        </StackPanel>
    </phone:LongListSelector.ItemTemplate>
</phone:LongListSelector>

结果如下：

红色矩形是我的自定义平铺控件，带有 ScaleTransform 。在转换之后，它应该是一个正方形，从336x336缩小到168x168（仅作为示例）。在上图中，高度正确但宽度太小。

这很奇怪，因为如果我将自定义平铺控件的大小更改为200x200像素并使用相同的 ScaleTransform ，系数为0.5，则会缩小正确。

Answer 1

你的GridCellSize正在扼杀变革。把它做大，试试（400,400）。也摆脱了StackPanel。

---

<phone:LongListSelector.ItemTemplate>
    <DataTemplate>
        <Border BorderBrush="HotPink" BorderThickness="1,1,1,1" Tap="Border_Tap" HorizontalAlignment="Left" VerticalAlignment="Top">
                <Custom:Tile RenderTransformOrigin="0,0" HorizontalAlignment="Left" VerticalAlignment="Top">
                    <Custom:Tile.RenderTransform>
                        <CompositeTransform ScaleX="0.5" ScaleY="0.5"/>
                    </Custom:Tile.RenderTransform>
                </Custom:Tile>
       </Border>
    </DataTemplate>
</phone:LongListSelector.ItemTemplate>

---