Question

我正在尝试创建一个Button ControlTemplate，其中文本将在控件中缩放。我有一些成功，但有一个问题仍然困扰着我：我添加到按钮的文字越多，TextBlock就越窄 - 因此文本不会超出按钮的宽度。举例说明：

这是我的模板代码：

    <Style
        x:Key="OptionButton"
        TargetType="{x:Type Button}">

    <Setter Property="BorderBrush" Value="{StaticResource WhiteBrush}" />
    <Setter Property="BorderThickness" Value="2" />
    <Setter Property="TextBlock.Foreground" Value="{StaticResource WhiteBrush}" />
    <Setter Property="HorizontalAlignment" Value="Stretch" />
    <Setter Property="VerticalAlignment" Value="Center" />
    <Setter Property="VerticalContentAlignment" Value="Center" />
    <Setter Property="HorizontalContentAlignment" Value="Center" />
    <Setter Property="MinWidth" Value="100" />
    <Setter Property="MinHeight" Value="75" />
    <Setter Property="Padding" Value="5,0,5,0" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type Button}">
                <Grid Height="70">
                    <Rectangle
                        Width="{TemplateBinding Width}"
                        Height="{TemplateBinding Height}"
                        Stretch="Fill"
                        Fill="{TemplateBinding Background}"
                        Stroke="{TemplateBinding BorderBrush}"
                        StrokeThickness="1">
                        <Rectangle.Clip>
                            <RectangleGeometry Rect="{Binding Path=ActualWidth, RelativeSource={RelativeSource AncestorType={x:Type Grid}}, Converter={StaticResource ButtonBackRectConverter}}" />
                        </Rectangle.Clip>
                    </Rectangle>
                    <Ellipse
                        Width="70"
                        Height="70"
                        Stretch="Fill"
                        HorizontalAlignment="Left"
                        Fill="{TemplateBinding Background}"
                        Stroke="{TemplateBinding BorderBrush}"
                        StrokeThickness="1">
                        <Ellipse.Clip>
                            <RectangleGeometry Rect="0,0,35,70" />
                        </Ellipse.Clip>
                    </Ellipse>
                    <Ellipse
                        Width="70"
                        Height="70"
                        Stretch="Fill"
                        HorizontalAlignment="Right"
                        Fill="{TemplateBinding Background}"
                        Stroke="{TemplateBinding BorderBrush}"
                        StrokeThickness="1">
                        <Ellipse.Clip>
                            <RectangleGeometry Rect="35,0,35,70" />
                        </Ellipse.Clip>
                    </Ellipse>

                    <Viewbox
                        StretchDirection="DownOnly"
                        Stretch="Uniform">

                        <ContentPresenter
                            Name="ToastButtonContentPresenter"
                            TextBlock.Foreground="{TemplateBinding TextBlock.Foreground}"
                            Style="{StaticResource LargeText}"
                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                            RecognizesAccessKey="True"
                            SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" >

                            <ContentPresenter.Resources>
                                <Style TargetType="{x:Type TextBlock}">
                                    <Setter Property="TextWrapping" Value="Wrap" />
                                    <Setter Property="Width" Value="{Binding ActualWidth, RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type Button}}}" />
                                    <Setter Property="Padding" Value="5" />
                                    <Setter Property="TextAlignment" Value="Center" />
                                    <Setter Property="HorizontalAlignment" Value="Stretch" />
                                </Style>
                            </ContentPresenter.Resources>
                        </ContentPresenter>
                    </Viewbox>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

非常感谢帮助我解决这个问题的任何指导。

Answer 1

一个想法是在按钮的width和height属性中使用转换器，并将文本长度作为参数传递。

根据长度，您可以编写逻辑并返回新的长度。

Width =“{Binding ButtonText，Converter = {StaticResource TextToLengthConverter}，ConverterParameter = ButtonText}“

以上只是伪代码。试着让我知道。

Button ControlTemplate - 随着更多文本的添加，TextBlock变窄

1 个答案: