web-dev-qa-db-ja.com

ScaleTransformを左上隅ではなく中央から開始する

マウスをホバーするとサイズの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#.netwpfxamlbutton
36
ImJames

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>
65
Fredrik Hedblad

ScaleTransform.CenterXとScaleTransform.CenterYは[0、1]の間の値ではなく、絶対ピクセル値である必要があります。

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