Question

我有一个宽度为100的TextBlock。当文本长度很大时，我想显示该文本块中包含的字符和文本旁边的（...）按钮，以指定用户更多文本是还有。单击该（...）按钮后，全文将显示在单独的弹出窗口中。

所以我想要在文本长度超过文本块大小时如何显示动态（...）按钮。请回答

Answer 1

这不是你想要的，但它是一个类似的想法，只是使用烘焙的东西：

<TextBlock MaxWidth="200"
           Text="{Binding YourLongText}"
           TextTrimming="WordEllipsis"
           ToolTip="{Binding YourLongText}" />

所以你有一个最大宽度的TextBlock，当文本不适合时，它会显示省略号（“...”）。使用鼠标将鼠标悬停在TextBlock上将在工具提示中显示完整文本。

Answer 2

只需要在按钮上添加省略号的相同要求，以便在此处添加解决方案

<Style x:Key="editButton" TargetType="{x:Type Button}">
            <Setter Property="Background" Value="Transparent" />                          
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type Button}">
                        <Border Background="{TemplateBinding Background}">
                            <ContentPresenter HorizontalAlignment="Left" VerticalAlignment="Center" >
                                <ContentPresenter.Resources>
                                    <Style TargetType="TextBlock">
                                        <Setter Property="TextTrimming" Value="CharacterEllipsis"></Setter>
                                    </Style>
                                </ContentPresenter.Resources>
                            </ContentPresenter>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
            <Style.Triggers>
                <Trigger Property="IsMouseOver" Value="True">
                    <Setter Property="Background" Value="Transparent"/>                      
                </Trigger>
            </Style.Triggers>
        </Style>

注意内容演示者中的资源。

Answer 3

我相信你想要的是设置TextTrimming property.将它设置为WordElilipsis或者CharacterEllipsis应该提供你需要的东西。

Answer 4

我对此问题的解决方案可能有点过分，但允许进行一些配置和控制。我创建了一个允许我为每个绑定设置字符限制的行为。

 internal class EllipsisStringBehavior
{
    public static readonly DependencyProperty CharacterLimitDependencyProperty = DependencyProperty.RegisterAttached("CharacterLimit", typeof(int), typeof(EllipsisStringBehavior), new PropertyMetadata(255, null, OnCoerceCharacterLimit));
    public static readonly DependencyProperty InputTextDependencyProperty = DependencyProperty.RegisterAttached("InputText", typeof(string), typeof(EllipsisStringBehavior), new PropertyMetadata(string.Empty, OnInputTextChanged));

    // Input Text
    public static string GetInputText(DependencyObject dependencyObject)
    {
        return Convert.ToString(dependencyObject.GetValue(InputTextDependencyProperty));
    }
    public static void SetInputText(DependencyObject dependencyObject, string inputText)
    {
        dependencyObject.SetValue(InputTextDependencyProperty, inputText);
    }

    // Character Limit
    public static int GetCharacterLimit(DependencyObject dependencyObject)
    {
        return Convert.ToInt32(dependencyObject.GetValue(CharacterLimitDependencyProperty));
    }
    public static void SetCharacterLimit(DependencyObject dependencyObject, object characterLimit)
    {
        dependencyObject.SetValue(CharacterLimitDependencyProperty, characterLimit);
    }

    private static void OnInputTextChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
    {
        TextBlock textblock = (TextBlock)d;

        string input = e.NewValue == null ? string.Empty : e.NewValue.ToString();
        int limit = GetCharacterLimit(d);

        string result = input;

        if (input.Length > limit && input.Length != 0)
        {
            result = $"{input.Substring(0, limit)}...";
        }

        textblock.Text = result;
    }

    private static object OnCoerceCharacterLimit(DependencyObject d, object baseValue)
    {
        return baseValue;
    }
}

然后我只需将使用添加到我的用户控件...

<UserControl 
 xmlns:behavior="clr-namespace:My_APP.Helper.Behavior"
 d:DesignHeight="300" d:DesignWidth="300">

...并将该行为应用于我希望在其上使用的TextBlock控件。

<TextBlock Margin="0,8,0,8"
 behavior:EllipsisStringBehavior.CharacterLimit="10" 
 behavior:EllipsisStringBehavior.InputText="{Binding Path=DataContext.FeedItemTwo.Body, Mode=OneWay, UpdateSourceTrigger=PropertyChanged}"
 Style="{StaticResource MaterialDesignSubheadingTextBlock}"  
 FontSize="14"/>

希望这有帮助。

当文本超出范围WPF时显示省略号（...）按钮

4 个答案: