TextBlock TextWrapping не переносит

Question

Когда я помещаю TextBlock внутри горизонтально выровненной StackPanel, он не переносится. Я понимаю, что это потому, что доступной шириной StackPanel является PositiveInfinity, но есть ли обходные пути?

Мой макет намного сложнее, чем этот пример, поэтому я не могу удалить StackPanel или Горизонтальная ориентация. Я просто попытался воспроизвести самый простой пример, демонстрирующий поведение.

    <StackPanel Orientation="Horizontal">
        <Rectangle Width="50" Height="50" Fill="Blue" VerticalAlignment="Top" />
        <Rectangle Width="50" Height="50" Fill="Red" VerticalAlignment="Top" />
        <TextBlock TextWrapping="Wrap"
                Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus leo lectus, viverra ut lobortis vel, mollis eget lectus. Suspendisse laoreet consequat ultrices. Curabitur ultricies, tortor feugiat porttitor faucibus, lorem eros pretium nisl, eu ullamcorper mauris tortor sit amet augue." />
    </StackPanel>

Обновление: Ширина текстового блока должна быть динамической. Мне нужно, чтобы оно текло вместе с окном при изменении его размера.

Обновление 2: Добавлен еще один элемент в StackPanel, потому что мне нужно, чтобы дочерние элементы были расположены горизонтально.

Обновление 3 (решение): Замена StackPanel на DockPanel.

<DockPanel>
    <DockPanel DockPanel.Dock="Top">
        <Rectangle Width="50" Height="50" Fill="Blue" VerticalAlignment="Top" DockPanel.Dock="Left" />
        <Rectangle Width="50" Height="50" Fill="Red" VerticalAlignment="Top" DockPanel.Dock="Left" />
        <TextBlock TextWrapping="Wrap"
                Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus leo lectus, viverra ut lobortis vel, mollis eget lectus. Suspendisse laoreet consequat ultrices. Curabitur ultricies, tortor feugiat porttitor faucibus, lorem eros pretium nisl, eu ullamcorper mauris tortor sit amet augue." />
    </DockPanel>
</DockPanel>

Answer 1

Это потому, что вы используете горизонтальную ориентацию на StackPanel. Это означает, что StackPanel предоставляет полную width каждому дочернему элементу управления, а затем размещает их горизонтально - даже если это означает превышение его ограниченной / видимой ширины. Поскольку ширина TextBlock ничем не ограничена, он не переносится.

Если вы переключитесь на Вертикальную ориентацию, то обертка работает, но я думаю, есть причина, по которой вы указываете иначе. Можете ли вы показать, какой макет вы пытаетесь достичь?

Answer 2

Вы можете использовать сетку вместо StackPanel (которая, как объяснено, не ограничивает ее содержимое.). Сетка позволяет намного больше контролировать расположение элементов, чем StackPanel, и если ваше изображение свернуто, то столбец 'auto' будет иметь ширину 0.

<DockPanel>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Rectangle Width="50" Height="50" Fill="Blue" VerticalAlignment="Top" />
        <TextBlock TextWrapping="Wrap" Grid.Column="1"
            Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus leo lectus, viverra ut lobortis vel, mollis eget lectus. Suspendisse laoreet consequat ultrices. Curabitur ultricies, tortor feugiat porttitor faucibus, lorem eros pretium nisl, eu ullamcorper mauris tortor sit amet augue." />
    </Grid>

</DockPanel>

Answer 3

Я получил пару решений для этой проблемы.

1) привязка родительской ширины к ширине текстового блока.(В следующем случае я считал usercontrol родительским).

<UserControl x:Class="WpfApplication1.MyWindow"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" Name="userctrl">   
    <DockPanel>
        <StackPanel Orientation="Horizontal" DockPanel.Dock="Top" HorizontalAlignment="Left" >
            <TextBlock TextWrapping="Wrap" MaxWidth="{Binding ElementName=userctrl,Path=ActualWidth}"
                Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus leo lectus, viverra ut lobortis vel, mollis eget lectus. Suspendisse laoreet consequat ultrices. Curabitur ultricies, tortor feugiat porttitor faucibus, lorem eros pretium nisl, eu ullamcorper mauris tortor sit amet augue." />

        </StackPanel>       
    </DockPanel>
</UserControl>

2) другое решение использует Grid вместо stackpanel

<UserControl x:Class="WpfApplication1.MyWindow"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" Name="userctrl">   
    <DockPanel>
        <Grid DockPanel.Dock="Top" HorizontalAlignment="Left" >
            <Grid.ColumnDefinitions>
                <ColumnDefinition></ColumnDefinition>
                <ColumnDefinition></ColumnDefinition>
            </Grid.ColumnDefinitions>
            <TextBlock TextWrapping="Wrap" 
                Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus leo lectus, viverra ut lobortis vel, mollis eget lectus. Suspendisse laoreet consequat ultrices. Curabitur ultricies, tortor feugiat porttitor faucibus, lorem eros pretium nisl, eu ullamcorper mauris tortor sit amet augue." />
            <TextBlock TextWrapping="Wrap" Grid.Column="1" Margin="20 0 0 0"
                Text="Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus leo lectus, viverra ut lobortis vel, mollis eget lectus. Suspendisse laoreet consequat ultrices. Curabitur ultricies, tortor feugiat porttitor faucibus, lorem eros pretium nisl, eu ullamcorper mauris tortor sit amet augue." />

        </Grid>       
    </DockPanel>
</UserControl>

Answer 4

Если вы похожи на меня и вам интересно, почему текстовый блок все еще не переносится после определения ширины.

Попробуйте добавить MaxWidth в текстовый блок с тем же значением, что и ширина,

Это останавливает увеличение ширины элемента управления после запуска приложения.

Надеюсь, это поможет!