0

我正在尝试制作一个ListBox在 Item 右侧包含一个字符串，在左侧包含一个字符串的方法，我已经尝试过，但是这些字符串彼此重叠。

<ListBox Name="ChaptersList" Height="200" Margin="10,10,10,0" VerticalAlignment="Top" SelectionChanged="ChaptersList_SelectionChanged" MouseDoubleClick="ChaptersList_MouseDoubleClick" RenderTransformOrigin="0.5,0.5" TextOptions.TextHintingMode="Animated">
    <ListBox.RenderTransform>
        <TransformGroup>
            <ScaleTransform/>
            <SkewTransform/>
            <RotateTransform/>
            <TranslateTransform/>
        </TransformGroup>
    </ListBox.RenderTransform>

    <ListBox.ItemTemplate>
        <DataTemplate>
            <Grid>
                <Label Content="{Binding Path=Title}" VerticalAlignment="Center" Margin="5"/>
                <Label Content="{Binding Path=Name}" HorizontalAlignment="Right" Margin="5"/>
            </Grid>
        </DataTemplate>
    </ListBox.ItemTemplate>
</ListBox>

（我的第一个字符串应该是多行的）

4

3 回答 3

2

您可以使用Grid两行（其中Height设置为Auto）和文本换行行为，您必须将ScrollViewer.HorizontalScrollBarVisibility="Disabled"属性添加到ListBox.

<ListBox Name="ChaptersList" 
                 Height="250" Margin="10,10,10,0" VerticalAlignment="Top"  RenderTransformOrigin="0.5,0.5" TextOptions.TextHintingMode="Animated"
                 ScrollViewer.HorizontalScrollBarVisibility="Disabled"
                 >
            <ListBox.RenderTransform>
                <TransformGroup>
                    <ScaleTransform/>
                    <SkewTransform/>
                    <RotateTransform/>
                    <TranslateTransform/>
                </TransformGroup>
            </ListBox.RenderTransform>
            <ListBox.ItemTemplate>
                <DataTemplate>
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="Auto" />
                        </Grid.RowDefinitions>
                        <TextBlock Grid.Row="0" Text="{Binding Path=Title}" TextWrapping="Wrap" HorizontalAlignment="Left" Margin="5"/>
                        <TextBlock Grid.Row="1" Text="{Binding Path=Name}" HorizontalAlignment="Right" Margin="5"/>
                    </Grid>
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
于 2012-11-29T22:32:01.720 回答
0

编辑：我找到了一个简单的解决方案：使用 Expression Blend 结束编辑模板。它为您提供了一个设计师来调整布局。

于 2012-12-05T18:00:14.140 回答
0

使用堆栈面板：

    <ListBox Name="ChaptersList" Height="200" Margin="10,10,10,0" VerticalAlignment="Top" SelectionChanged="ChaptersList_SelectionChanged" MouseDoubleClick="ChaptersList_MouseDoubleClick" RenderTransformOrigin="0.5,0.5" TextOptions.TextHintingMode="Animated">
        <ListBox.RenderTransform>
            <TransformGroup>
                <ScaleTransform/>
                <SkewTransform/>
                <RotateTransform/>
                <TranslateTransform/>
            </TransformGroup>
        </ListBox.RenderTransform>
        <ListBox.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal">
                        <Label Content="{Binding Path=Title}" VerticalAlignment="Center" Margin="5"/>
                        <Label Content="{Binding Path=Name}" HorizontalAlignment="Right" Margin="5"/>
                </StackPanel>
            </DataTemplate>
        </ListBox.ItemTemplate>
    </ListBox>
于 2012-11-29T22:22:34.417 回答