xaml 如何在模板化按钮中居中文本答案

【问题标题】：xaml how center text in a templated buttonxaml 如何在模板化按钮中居中文本
【发布时间】：2017-08-27 07:48:36
【问题描述】：

我无法将模板按钮中的文本居中。 “OK”停留在底部中心，甚至低于按钮边框。

 <Window.Resources>
    <ControlTemplate x:Key="BT_Kids" TargetType="{x:Type Button}">
        <Grid>
            <Ellipse HorizontalAlignment="Left" Height="44.8" Stroke="Black" VerticalAlignment="Top" Width="71.2">
                <Ellipse.Fill>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                        <GradientStop Color="Black" Offset="0"/>
                        <GradientStop Color="#FF4363EA" Offset="1"/>
                    </LinearGradientBrush>
                </Ellipse.Fill>
            </Ellipse>
            <Viewbox>
                <ContentControl Margin="10" Content="{TemplateBinding Content}"/>
            </Viewbox>
        </Grid>
    </ControlTemplate>
</Window.Resources>
<Grid Margin="0,0,0,2.4">

    <Button 
            HorizontalAlignment="Left" 
            VerticalAlignment="Top" 
            Width="75" Margin="189.6,24.6,0,0" 
            Template="{DynamicResource BT_Kids}"  FontSize="15">OK</Button>

</Grid>

【问题讨论】：

标签： wpf xaml templates button viewbox

【解决方案1】：

试试这个：

<Button ...>
  <Button.Content>
            <StackPanel Padding="0" HorizontalAlignment="Center" VerticalAlignment="Center">
            <TextBlock Text="OK"/>
            </StackPanel>
        </Button.Content>
</Button>

【讨论】：

【解决方案2】：

去掉ViewBox，调整Button的FontSize，设置ContentPresenter的HorizontalAlignment和VerticalAlignment属性为Center：

<ControlTemplate x:Key="BT_Kids" TargetType="{x:Type Button}">
    <Grid>
        <Ellipse HorizontalAlignment="Left" Height="44.8" Stroke="Black" VerticalAlignment="Top" Width="71.2">
            <Ellipse.Fill>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="Black" Offset="0"/>
                    <GradientStop Color="#FF4363EA" Offset="1"/>
                </LinearGradientBrush>
            </Ellipse.Fill>
        </Ellipse>
        <ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
    </Grid>
</ControlTemplate>

<Button 
        HorizontalAlignment="Left" 
        VerticalAlignment="Top" 
        Width="75" Margin="189.6,24.6,0,0"
        HorizontalContentAlignment="Center"
        VerticalContentAlignment="Center"
        Template="{DynamicResource BT_Kids}" FontSize="30">OK</Button>

当Ellipse 具有固定大小时，将内容放入ViewBox 是没有意义的。

【讨论】：