边框无法调整为文本块

Question

为了解决另一个问题中描述的问题：Segoe UI Symbol smiley is sometimes colorful, sometimes not (WP8.1 + XAML)，我尝试了以下方法：用带有圆角的 Border 元素包裹我的 Textblock（高CornerRadius)。这样我可以改变边框的背景颜色，看起来就像笑脸本身有背景颜色一样......几乎。

还有一个小问题我无法理解：TextBlock 的高度似乎超出了我的控制范围。我想要显示的“Segoe UI 符号”（笑脸）就像它有某种 padding 一样阻止边框完全适合图标。最后，我的圆形笑脸周围出现了某种椭圆形……这与我的想法不太一样。

我将 XAML 剥离到其本质，并在一个新的空白应用程序中使用它（只需将其粘贴到一个新应用程序中，您应该会看到下面的屏幕截图）：

<Grid>
    <Border Background="Red" Grid.Column="0" 
            CornerRadius="50" BorderThickness="0" 
            HorizontalAlignment="Center" VerticalAlignment="Center">
        <TextBlock Text="&#x1F620;" 
                   FontFamily="Segoe UI Symbol" FontSize="50" 
                   HorizontalAlignment="Center" VerticalAlignment="Center" />
    </Border>
</Grid>

这给了你：

知道我可以在那里调整什么吗？

Answer 1

问题是文字（表情）的高度和宽度不一样。您可以通过将自定义样式应用于文本框并更改其填充来进行自定义修复，直到获得所需的结果。这不是一个动态解决方案，但如果图标的大小是标准的，我认为这个解决方案会起作用。

首先创建一个新样式：

<phone:PhoneApplicationPage.Resources>
    <Style x:Key="CustomTextBlockStyle" TargetType="TextBlock">
        <Setter Property="Padding" Value="10,0,10,3"/>
    </Style>
</phone:PhoneApplicationPage.Resources>

然后将其应用到 TextBlock

<Grid>
    <Border Background="Red" Grid.Column="0" 
CornerRadius="50" BorderThickness="0" 
HorizontalAlignment="Center" VerticalAlignment="Center">
        <TextBlock Text="&#x1F620;" 
       FontFamily="Segoe UI Symbol" FontSize="50" 
       HorizontalAlignment="Center" VerticalAlignment="Center" Style="{StaticResource CustomTextBlockStyle}" />
    </Border>
</Grid>

结果：

如果你想要这样的东西：

也尝试使用 padding 和 margin

<Style x:Key="CustomTextBlockStyle" TargetType="TextBlock">
        <Setter Property="Margin" Value="-2,-13,-2,-9"/>
        <Setter Property="Padding" Value="0,0,0,0"/>
</Style>