WPF: TextBox se expande con Grid circundante pero no con texto

xaml wrap

Question

Tengo un problema con un TextBox en una aplicación ...

Una ventana tiene una cuadrícula con dos columnas. La columna de la izquierda contiene un control con un ancho constante pero con una altura que se adapta. La columna de la derecha contiene un TextBox que ocupa todo el espacio restante en la Grilla (y por lo tanto en la Ventana).

La cuadrícula tiene un ancho y una altura mínimos y está envuelta dentro de un ScrollViewer. Si el usuario cambia el tamaño de la ventana para que sea más pequeña que la anchura / altura mínima de la cuadrícula, se muestran las barras de desplazamiento.

Así es exactamente como quiero que sea. Sin embargo, se produce un problema cuando el usuario comienza a escribir texto. Si el texto es demasiado largo para caber en una línea en el TextBox, quiero que el texto se ajuste. Por lo tanto, configuro TextWrapping = "Wrap" en el TextBox. Pero dado que el TextBox tiene un ancho automático y está envuelto en un ScrollViewer (en realidad es la cuadrícula completa que está envuelta), el TextBox sigue expandiéndose hacia la derecha.

Quiero que TextBox se expanda si la ventana está expandida, pero no quiero que TextBox se expanda por el texto. Más bien, el texto debe envolver dentro del TextBox disponible. Si el texto no cabe dentro de la altura del TextBox, se debe mostrar una barra de desplazamiento dentro del TextBox.

¿Hay alguna manera de lograr esto?

A continuación se muestra un código que muestra mi problema.

<Window x:Class="AdaptingTextBoxes.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="300" Width="400" Background="DarkCyan">
<Grid Margin="10" Name="LayoutRoot">
    <ScrollViewer HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">
        <Grid MinWidth="300" MinHeight="200">
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="auto" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>

            <Button Grid.Column="0" Margin="0,0,10,0" Content="Button" Width="100" />

            <TextBox Grid.Column="1" AcceptsReturn="True" TextWrapping="Wrap" ScrollViewer.HorizontalScrollBarVisibility="Disabled" ScrollViewer.VerticalScrollBarVisibility="Auto" />
        </Grid>
    </ScrollViewer>
</Grid>
</Window>

Answer 1

¿Has intentado establecer la propiedad MaxWidth solo en el TextBox?

Editar después del comentario de OP

Intentaría deshacerme del ScrollViewer . El tamaño utilizado en el diseño de la Grid debe tener en cuenta el cambio de tamaño y la configuración de la barra de desplazamiento en el TextBox debe encargarse del resto.

Answer 2

Podrías usar un borde invisible (es cursi pero funciona, es así como tiendo a ordenar los tamaños dinámicos de los cuadros de texto):

<Border BorderThickness="0" x:Name="border" Grid.Column="1" Margin="0.5" />
                <TextBox Grid.Column="1" AcceptsReturn="True" TextWrapping="Wrap" Width="{Binding ActualWidth, ElementName=border}" Height="{Binding ActualHeight, ElementName=border}" />

Answer 3

La respuesta se basa en la respuesta de Leom.

La solución funciona muy bien cuando se amplía la ventana, pero el cambio de tamaño no es uniforme cuando se reduce la ventana. Como el cuadro de texto participa en el diseño de la cuadrícula, tiene que realizar el proceso de diseño varias veces. Puede solucionarlo colocando el texbox en el lienzo, por lo que el cambio del tamaño del cuadro de texto ya no desencadena la redistribución de la cuadrícula.

El código actualizado:

<Border BorderThickness="0" x:Name="border" Grid.Column="1" Margin="0.5" />
<Canvas Grid.Column="1">
    <TextBox AcceptsReturn="True" TextWrapping="Wrap" Width="{Binding ActualWidth, ElementName=border}" Height="{Binding ActualHeight, ElementName=border}" />
</Canvas>