Question

我有一个ListBox，其中每个项目都包含一个打印TextBoxes的ItemsControl。

<Window.Resources>
    <DataTemplate x:Key="ItemTemplate">
        <Grid Margin="0,0,0,0">
            <ItemsControl
                ItemsSource="{Binding Collection2}"
                ItemTemplate="{DynamicResource SubItemTemplate}">
                <ItemsControl.ItemsPanel>
                    <ItemsPanelTemplate>
                        <StackPanel Orientation="Horizontal"></StackPanel>
                    </ItemsPanelTemplate>
                </ItemsControl.ItemsPanel>
            </ItemsControl>
        </Grid>
    </DataTemplate>
</Window.Resources>

<Grid ShowGridLines="True" DataContext="{Binding Source={StaticResource SampleDataSource}}">
    <ListBox x:Name="listBox" 
             HorizontalAlignment="Left"
             Width="280"
             ScrollViewer.HorizontalScrollBarVisibility="Disabled"
             ItemTemplate="{DynamicResource ItemTemplate}"
             ItemsSource="{Binding Collection1}"/>
</Grid>

ItemsControl列表被切断了，因为我在ListBox上禁用了HorizontalScrollBarVsibility。现在我想使用TextBoxes TextTrimming属性在列表的末尾留下点，文本被截断并隐藏在网格后面。如下图所示为红点：

我尝试使用以下ItemTemplate执行此操作，但没有任何结果：

<DataTemplate x:Key="SubItemTemplate">
    <Border BorderThickness="1" BorderBrush="Black">
        <TextBlock Margin="5, 0, 5, 0"
               TextTrimming="CharacterEllipsis"
               Text="{Binding Name}">
        </TextBlock>
    </Border>
</DataTemplate>

我的问题是：如何在水平堆叠的列表上实现TextTrimming功能，如上图所示？

我使用Visual Studio Blend使用了以下结构的示例数据：

SampleDataSource（数据上下文）
- Collection1：（集合）
  - Collection2：（集合）
    - 名称：（字符串）

更新2016-12-13
我尝试将texttrimming设置为外部样式，我尝试在Border，TextBlock和StackPanel上设置MaxWidth（如注释中建议的那样）。除此之外，我还尝试将整个ItemsControl包装在TextBlock中，并将TextTrimming属性放在其上。这些都不幸地给出了任何结果。我想要简化我提供的示例代码，基本上这就是所有相关的：

<Grid>
    <StackPanel Width="150" Orientation="Horizontal">
        <TextBlock TextTrimming="CharacterEllipsis" Text="This is textbox1"/>
        <TextBlock TextTrimming="CharacterEllipsis" Text="This is textbox2"/>
    </StackPanel>
</Grid>

看起来像这样（红点可视化我想要实现的目标）：

现在，在这个示例中，我可以合并两个文本块并使用Run，但这不适用于我的“真实”问题。

更新2017-02-24

在评论中提出了这个解决方案（注意额外的空间和边距）：

<Window.Resources>

    <Style x:Key="TextStyle" TargetType="TextBlock">
        <Setter Property="TextTrimming" Value="CharacterEllipsis"/>
        <Setter Property="Margin" Value="0, 0, -1, 0"/>
    </Style>
</Window.Resources>
<Grid>
    <DockPanel>
        <TextBlock Style="{StaticResource TextStyle}" Text="This is textbox1 "/>
        <TextBlock Style="{StaticResource TextStyle}" Text="This is textbox2 "/>
        <TextBlock Style="{StaticResource TextStyle}" Text="This is textbox3 "/>
    </DockPanel>
</Grid>

产生以下内容：

我还在文本块上尝试了许多不同数量的空格和不同的边距值而没有所需的结果。所以正确的答案并不能完全解决我的问题......

Answer 1

将模板中的StackPanel更改为DockPanel。即使你设置StackPanel里面的内容的最大宽度，它也会像没有障碍一样。 DockPanel将强制屏障，因为您的项目是水平的，所以不需要进行任何其他更改。

使用TextBlocks在水平堆叠的ItemsControl中进行WPF Textrimming

1 个答案: