简体   繁体   中英

Width of Textbox, which placed in grid column, extends when inserting long text

When I put a Textbox in a grid column like below

<StackPanel>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" MinWidth="115"/>
            <ColumnDefinition Width="3*"/>
            <ColumnDefinition Width="90"/>
        </Grid.ColumnDefinitions>
        <TextBlock Grid.Column="0" Text="hello"/>
        <TextBox Grid.Column="1" />
        <Button Grid.Column="2" Content="push me"/>
    </Grid>
</StackPanel>

I get proper result, ie textbox width is get from parent grid

在此处输入图像描述

But when I type a long text, the textbox starts exceeding its column and it stops extending after several extra letters

在此处输入图像描述

To.Net 4.6.2, I get same result but changing to.Net 4.7.2 the problem is solved ie the textbox width is not changing. My software is compiled.Net 4.0, is there a solution to solve this for lower .net than 4.7.2?

Tried Pavel's first idea: removing stackpanel and adding another grid row in, still not working in .net 4.6.2

在此处输入图像描述

Tried Pavel's second idea: making the width of first column "Auto" instead of "1*". This works, the textbox doesn't extend (.net 4.6.2), however I really wanted the first and second column be responsive to resize.

在此处输入图像描述

You can solve this be removing the StackPanel and adding RowDefinition to Grid . You can also set TextWrapping="Wrap" for TextBox for wrapping a long text

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="3*"/>
            <ColumnDefinition Width="90"/>
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>

        <TextBlock Grid.Column="0" Text="hello" MinWidth="115"/>
        <TextBox Grid.Column="1" TextWrapping="Wrap"/>
        <Button Grid.Column="2" Content="push me"/>
    </Grid>

StackPanel Y dimension is constrained to content, it will be automatically expanded to its content, more details can be found at panels overview

To me this is a bug that Textbox text size can change its parent width (grid width). This is happening in VS2019.Net 4->4.6.2 but not in and after.Net 4.7.2.

For anybody faces this problem, I found below workaround by defining an invisible grid which contains textblocks. I get the widths of columns and give them to controls placed in a StackPanel.

 <some container>
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition  Width="1*" MinWidth="115"/>
                <ColumnDefinition  Width="3*" />
                <ColumnDefinition  MinWidth="90"/>
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="0"/>
            </Grid.RowDefinitions>
            <TextBlock x:Name="C0" Grid.Column="0" />
            <TextBlock x:Name="C1" Grid.Column="1" Margin="5"/>
            <TextBlock x:Name="C2" Grid.Column="2" />
        </Grid>


        <StackPanel Orientation="Horizontal">
            <TextBlock Width="{Binding ElementName=C0, Path=ActualWidth }" Text="hello" />
            <TextBox Width="{Binding ElementName=C1, Path=ActualWidth }" Margin="5" />
            <Button Width="{Binding ElementName=C2, Path=ActualWidth }" Content="push me"/>
        </StackPanel>
    </some container>

The margin should be the same for column in grid and control in StackPanel (see second column).

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM