Как обернуть текст в сетке - PullRequest
Новая
       9

Как обернуть текст в сетке

0 голосов
/ 27 сентября 2018

Я делаю программное обеспечение для управления библиотекой.

У меня есть следующий xaml: 

<GridView ItemsSource="{x:Bind Path=ViewModel.Books, Mode=OneWay}">
        <GridView.ItemTemplate>
            <DataTemplate x:DataType="data:Book">

                <StackPanel Margin="5" HorizontalAlignment="Center">

                    <Image Width="200" Height="200" Source="{x:Bind Path=CoverImageLocation, Mode=OneWay}" /> 

                    <StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
                        <StackPanel>
                            <TextBlock FontSize="16" Text="{x:Bind Path=Title, Mode=OneWay}" 
                                       TextWrapping="WrapWholeWords"/>
                            <TextBlock FontSize="10" Text="{x:Bind Path=Author, Mode=OneWay}" 
                                       Margin="0, 3, 0, 0" TextWrapping="WrapWholeWords"/>
                        </StackPanel>

                        <TextBlock FontSize="20" Text="{x:Bind Path=Quantity, Mode=OneWay}"
                                   VerticalAlignment="Bottom" HorizontalAlignment="Right"/>
                    </StackPanel>
                </StackPanel>

            </DataTemplate>
        </GridView.ItemTemplate>
    </GridView>

Текст в текстовом блоке получен из базы данных.Детали реализации не требуются, я чувствую.Текстовые блоки представляют название, автора и количество книги соответственно.

У меня есть книга под названием: «Тонкое искусство не давать аф * кк».Как вы могли заметить, TextWrapping имеет значение WrapWholeWords.Но это скриншот приложения: screenshot

Обратите внимание на две вещи:

  1. Текст не переносится
  2. Количество отсутствует

Как указать, чтобы текстовый блок был обернут?Или, если это невозможно, по крайней мере, показывать эллипсы в конце длинных текстов, чтобы количество не было скомпрометировано?

1 Ответ

0 голосов
/ 27 сентября 2018

  1. Используйте сетку вместо StackPanel, чтобы получить правильное усечение текста со свойством TextTrimming . 

    <DataTemplate x:DataType="data:Book">
    <StackPanel Margin="5" HorizontalAlignment="Center">
        <Image Width="200" Height="200" Source="{x:Bind Path=CoverImageLocation, Mode=OneWay}" /> 
        <Grid HorizontalAlignment="Stretch">
            <Grid.ColumnDefinitions>
                <ColumnDefinition />
                <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>
            <StackPanel>
                <TextBlock FontSize="16" Text="{x:Bind Path=Title, Mode=OneWay}" 
                          TextTrimming="CharacterEllipsis"/>
                <TextBlock FontSize="10" Text="{x:Bind Path=Author, Mode=OneWay}" 
                           Margin="0, 3, 0, 0" TextWrapping="WrapWholeWords"/>
            </StackPanel>
            <TextBlock FontSize="20" Text="{x:Bind Path=Quantity, Mode=OneWay}"
                       Grid.Column="1" VerticalAlignment="Bottom" HorizontalAlignment="Right"/>
        </Grid>
    </StackPanel>
</DataTemplate>
...