使 ScaleTransform 从中心而不是左上角开始答案

【问题标题】：Make ScaleTransform start from Center instead of Top-Left Corner使 ScaleTransform 从中心而不是左上角开始
【发布时间】：2011-06-30 22:59:23
【问题描述】：

我有一个按钮的以下样式，当鼠标悬停它时，它应该增长到 1.5 倍。问题是按钮从左上角而不是中心增长。有谁知道如何解决这个问题？

<Style x:Key="sizeButton" TargetType="Button">
    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter Property="RenderTransform">
                <Setter.Value>
                    <ScaleTransform ScaleX="1.5" ScaleY="1.5"/>
                </Setter.Value>
            </Setter>
        </Trigger>
    </Style.Triggers>
</Style>

尝试了 Henk Holterman 提供的解决方案，但我无法使用以下代码。好像没有效果还是我做错了？

<Window.Resources>
    <Style x:Key="sizeButton" TargetType="Button">
        <Style.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="RenderTransform">
                    <Setter.Value>
                        <ScaleTransform CenterX="0.5" CenterY="0.5" ScaleX="1.5" ScaleY="1.5"/>
                    </Setter.Value>
                </Setter>
            </Trigger>
        </Style.Triggers>
    </Style>
</Window.Resources>
<StackPanel>
    <Button Content="Increase Size" Width="100" Height="50" Style="{StaticResource sizeButton}"/>
</StackPanel>

【问题讨论】：

标签： c# .net wpf xaml button

【解决方案1】：

您可以将RenderTransformOrigin 设置为"0.5, 0.5"

<Style x:Key="sizeButton" TargetType="Button">
    <Setter Property="RenderTransformOrigin" Value="0.5, 0.5"/>
    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter Property="RenderTransform">
                <Setter.Value>
                    <ScaleTransform ScaleX="1.5" ScaleY="1.5"/>
                </Setter.Value>
            </Setter>
        </Trigger>
    </Style.Triggers>
</Style>

【讨论】：

【解决方案2】：

ScaleTransform.CenterX 和 ScaleTransform.CenterY 不是 [0, 1] 之间的值，而是绝对像素值。

<ScaleTransform CenterX="50" CenterY="25" ScaleX="1.5" ScaleY="1.5"/>

【讨论】：