How to set 50% of my monitor width in a grid?

Question

I want to set width 50% from my monitor.

The first line should be the same as the second:

My code:

<DataTemplate x:Key="RowTemplate">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <TextBox Grid.Column="0"
                 Grid.Row="1"
                 TextWrapping="Wrap"
                     Text="{Binding Mask}"/>
        <TextBox Grid.Column="1"
                 Grid.Row="1"
                 TextWrapping="Wrap"
                     Text="{Binding Value}"/>
    </Grid>
</DataTemplate>

*"The first line should be the same as the second"* - do you mean columns shouls have the same width on all lines? Use `ColumnDefinition.SharedSizeGroup`. You have to set [Grid.IsSharedSizeScope](https://learn.microsoft.com/en-us/dotnet/api/system.windows.controls.grid.issharedsizescope) (and you will find an example there). — Sinatr, Aug 12 '20 at 08:20
Does this answer your question? [How can I make my Grid Columns always be the same width?](https://stackoverflow.com/questions/7558795/how-can-i-make-my-grid-columns-always-be-the-same-width) — Sinatr, Aug 12 '20 at 08:21
And now I read the title.. which is totally different problem. You'll have parent container as a part of window visual tree. Question is how it should looks like? Do you want fullscreen window where grid takes half? Or how it should looks like? — Sinatr, Aug 12 '20 at 08:25
I add an image with description: @It should looks like that@ — casyap, Aug 12 '20 at 08:33

Andy · Accepted Answer · 2020-08-12T15:15:26.387

I reproduced your issue using a listbox.

The behaviour is because there's a scrollviewer in a listbox and that tells the content it can have as much width as it likes ( and height ). Hence there's no set amount for the * measure to be half of.

You can avoid this behaviour by disabling the horizontal scroll. I had to also force the row to stretch to fit it's parent.

Working markup:

<Window.Resources>
    <DataTemplate x:Key="RowTemplate">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>
            <TextBox Grid.Column="0"
             TextWrapping="Wrap"
                 Text="{Binding Mask}"/>
            <TextBox Grid.Column="1"
             TextWrapping="Wrap"
                 Text="{Binding Value}"/>
        </Grid>
    </DataTemplate>
</Window.Resources>
<Grid>
    <ListBox ItemTemplate="{StaticResource RowTemplate}"
             ItemsSource="{Binding MyRows}"
             HorizontalContentAlignment="Stretch"
             ScrollViewer.HorizontalScrollBarVisibility="Disabled" >
    </ListBox>
</Grid>
</Window>

The two key lines here are:

             HorizontalContentAlignment="Stretch"
             ScrollViewer.HorizontalScrollBarVisibility="Disabled" >

With some test data I see:

Then what other markup do you have? The above definitely works for me. — Andy, Aug 12 '20 at 10:22

How to set 50% of my monitor width in a grid?

1 Answers1