Sorush
Sorush

Reputation: 4129

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, i.e. textbox width is get from parent grid

enter image description here

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

enter image description here

To .Net 4.6.2, I get same result but changing to .Net 4.7.2 the problem is solved i.e. 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

enter image description here

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.

enter image description here

Upvotes: 0

Views: 2312

Answers (2)

Pavel Anikhouski
Pavel Anikhouski

Reputation: 23228

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

Upvotes: 1

Sorush
Sorush

Reputation: 4129

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).

Upvotes: 0

Related Questions