WPF 使Button字体自适应屏幕大小

2021-07-19  本文已影响0人  分享学习

使用Viewbox可以拉伸和缩放单个子元素以填满可用空间。
把viewbox直接放在默认格式的button外面

<Viewbox>
   <Button>left</Button>
</Viewbox>
默认格式的button

放在圆角button外:

<ControlTemplate x:Key="radiusBtnTemplate" TargetType="Button">
      <Border CornerRadius="48" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
          <ContentPresenter Content="{TemplateBinding ContentControl.Content}" HorizontalAlignment="Center" VerticalAlignment="Center" />
      </Border>
</ControlTemplate>
圆角button

此时button中的文字虽然随着屏幕放大而变大,但是文字已经超出了圆角button显示区域,并不美观。

当我们把viewbox加在ContentPresenter外时,同样的CornerRadius获得的button:


viewbox加在ContentPresenter外

如果对button内容和边框的间隔不满意,还可以通过padding或者加一个TextBlock来进行调节:


ContentPresenter外加一个TextBlock
<ControlTemplate x:Key="radiusBtnTemplate" TargetType="Button">
    <Border CornerRadius="48" Name="PART_Background" Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
        <Viewbox>
            <TextBlock Margin="10">
                <ContentPresenter Content="{TemplateBinding ContentControl.Content}" HorizontalAlignment="Center" VerticalAlignment="Center" />
             </TextBlock>
        </Viewbox>
    </Border>
</ControlTemplate>
上一篇下一篇

猜你喜欢

热点阅读