Scale Checkbox without scaling content

2019-07-27 22:13发布

问题:

I want to double the size of a checkbox. I used ScaleTransform but the problem is, it also scales the Content (in my case the text on the right of the checkbox):

<CheckBox VerticalAlignment="Center" Content="Test">
    <CheckBox.LayoutTransform>
        <ScaleTransform ScaleX="2" ScaleY="2" />
    </CheckBox.LayoutTransform>
</CheckBox>

I could just leave the Content empty and write the description in a separate TextBlock but then, when I click on the text, the CheckBox is of course not toggled.
Can I do this without completely replacing the control template?

回答1:

Something like this may work for you:

(Obviously you should use a converter to change the ScaleTransform and the TranslateTransform based on databinding for better support).

    <CheckBox VerticalAlignment="Center">
        <CheckBox.Content>
            <TextBlock Text="Test" VerticalAlignment="Center">
                <TextBlock.RenderTransform>
                    <TransformGroup>
                        <TranslateTransform Y="7"/>
                        <ScaleTransform ScaleX="0.5" ScaleY="0.5"/>
                    </TransformGroup>
                </TextBlock.RenderTransform>
            </TextBlock>
        </CheckBox.Content>
        <CheckBox.RenderTransform>
            <ScaleTransform ScaleX="2" ScaleY="2"/>
        </CheckBox.RenderTransform>
    </CheckBox>