wpf - 在 XAML 中设置 TextBox 的宽度，以便它能够显示 x 位

Question

我想设置 WPF 文本框的宽度，以便它有足够的空间容纳任何 5 位数的 TCP 端口号。它不应该更大，也不应该动态调整大小，即 Width="Auto"不是我想要的。

我正在寻找一种通用方式，即一种尊重所使用字体的方式，并且我不想在字体或其他任何可能改变像素宽度 5 的情况下摆弄像素精确的宽度值数字 - 已更改。

我想有可能——如果尴尬的话——通过 MeasureString 在代码中做，但是 这在 XAML 中可能吗？

Answer 1

好吧，它可能并不完美，但这是一个可能的解决方案。

创建 ControlTemplate其中将包含所需的 CharacterLength和 GhostString依赖属性。

public class DynamicTextBox : TextBox
{
    public int CharacterLength
    {
        get { return (int)GetValue(CharacterLengthProperty); }
        set { SetValue(CharacterLengthProperty, value); }
    }

    // Using a DependencyProperty as the backing store for CharacterLength.  This enables animation, styling, binding, etc...
    public static readonly DependencyProperty CharacterLengthProperty =
        DependencyProperty.Register("CharacterLength", typeof(int), typeof(DynamicTextBox), new PropertyMetadata(5, new PropertyChangedCallback(CharacterLengthChanged)));

    public string GhostString
    {
        get { return (string)GetValue(GhostStringProperty); }
        private set { SetValue(GhostStringProperty, value); }
    }

    // Using a DependencyProperty as the backing store for GhostString.  This enables animation, styling, binding, etc...
    public static readonly DependencyProperty GhostStringProperty =
        DependencyProperty.Register("GhostString", typeof(string), typeof(DynamicTextBox), new PropertyMetadata("#####"));

    static DynamicTextBox()
    {
        DefaultStyleKeyProperty.OverrideMetadata(typeof(DynamicTextBox), new FrameworkPropertyMetadata(typeof(DynamicTextBox)));
    }

    private static void CharacterLengthChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
    {
        DynamicTextBox textbox = d as DynamicTextBox;

        string ghost = string.Empty;

        for (int i = 0; i < textbox.CharacterLength; i++)
            ghost += "#";

        textbox.GhostString = ghost;
    }
}

每当 CharacterLength属性更改，然后 GhostString属性将被重新计算，您将在一分钟内看到神奇之处。

设置 Style和 ControlTemplate对于这个新控件。

<Style TargetType="{x:Type local:DynamicTextBox}"
       BasedOn="{StaticResource {x:Type TextBox}}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type local:DynamicTextBox}">
                <Border Background="{TemplateBinding Background}"
                        BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}">
                    <Grid>
                        <TextBlock Text="{TemplateBinding GhostString}"
                                   Visibility="Hidden"
                                   Margin="3,0"/>

                        <ScrollViewer Margin="0"
                                  x:Name="PART_ContentHost" />
                    </Grid>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

GhostString属性放置在 内隐藏 TextBlock , 这意味着渲染了宽度，但是文本是不可见的，它被放置在 TextBox 后面反正。

您可以像这样使用控件:

<Controls:DynamicTextBox CharacterLength="12" HorizontalAlignment="Left"/>
    <Controls:DynamicTextBox CharacterLength="6" HorizontalAlignment="Left"/>
    <Controls:DynamicTextBox CharacterLength="2" HorizontalAlignment="Left"/>

注意:我把 Horizo​​ntalAlignment 放在那里只是为了强制宽度折叠。

结果如下所示:



它并不完美，但它肯定是一个开始。如果您想进一步限制 TextBox 的宽度，我相当肯定你可以在 ControlTemplate 中做一些巧妙的绑定(bind)。 .