1

На скриншоте представлены две группы элементов управления. Хочу выровнять их по верхнему левому краю и чтобы они там оставались при изменении размеров окна.

Но если увеличивать размер окна, то ни почему-то съезжают к центру. Уже перепробовал все виды контейнеров и все выравнивания.

   <Grid VerticalAlignment="Top">
        <Grid.RowDefinitions>
            <RowDefinition Height="44*"/>
            <RowDefinition Height="237*"/>
            <RowDefinition Height="36*"/>
            <RowDefinition Height="96*"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="121*"/>
            <ColumnDefinition Width="471*"/>
        </Grid.ColumnDefinitions>

        <TextBlock Text="Battery:" Margin="5,5,0,0"  Grid.Row="1" Height="20" VerticalAlignment="Top" HorizontalAlignment="Left" Width="40" />
        <ProgressBar Height="25" VerticalAlignment="Top" Margin="5,25,0,0" Grid.Row="1" RenderTransformOrigin="0,0.5" Value="75" HorizontalAlignment="Left" Width="110"/>

        <TextBlock Text="Hacking progress:" Margin="5,55,0,0"  Grid.Row="1" Height="20" VerticalAlignment="Top" HorizontalAlignment="Left" Width="95" />
        <ProgressBar Height="25" VerticalAlignment="Top" Margin="5,75,0,0" Grid.Row="1" Value="7" HorizontalAlignment="Left" Width="110"/>

        <Button Grid.Row="2" x:Name="button1" Content="Add Note" HorizontalAlignment="Left" 
                    Margin="5,7,0,0" Width="50" Height="25"
                    BorderThickness="1" BorderBrush="Gray"
                    Style="{DynamicResource SquareButtonStyle}" FontSize="9.333" VerticalAlignment="Top" VerticalContentAlignment="Top" />
        <Button x:Name="button2" Content="Close " HorizontalAlignment="Left" 
                    Margin="65,7,0,0" Width="50"  Height="25"
                    BorderThickness="1" BorderBrush="Gray"
                    Style="{DynamicResource SquareButtonStyle}" FontSize="9.333" VerticalAlignment="Top" VerticalContentAlignment="Top" Grid.Row="2" />
</Grid>

введите сюда описание изображения

1
  • Спасибо за ответы. Даже не догадался, что проблема связана с настройкаи Grid, все боролся с выравниванием отдельных элементов Commented 13 окт. 2015 в 7:29

2 ответа 2

3

Это происходит из-за того, что вы используете * для задания размеров. У вас первый столбец занимает 121/(121 + 471) долю от ширины грида. Поэтому при изменении ширины грида увеличивается и ширина столбца.

Я набросал примерно то, чего вы хотите добиться:

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="200"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>

    <Grid Grid.Column="0">
        <Grid.RowDefinitions>
            <RowDefinition Height="auto"/>
            <RowDefinition Height="auto"/>
            <RowDefinition Height="auto"/>
            <RowDefinition Height="auto"/>
            <RowDefinition Height="auto"/>
        </Grid.RowDefinitions>

        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>

        <TextBlock Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2" Margin="5,15,5,5"  Text="Battery:"/>
        <ProgressBar Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2" Height="25" Value="70"/>

        <TextBlock Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="2" Margin="5,15,5,5" Text="Hacking Progress:"/>
        <ProgressBar Grid.Row="3" Grid.Column="0" Grid.ColumnSpan="2" Height="25" Value="30"/>

        <Button Grid.Row="4" Grid.Column="0" Margin="10,100,5,10" Content="Add note"/>
        <Button Grid.Row="4" Grid.Column="1" Margin="5,100,10,10" Content="Close"/>
    </Grid>

    <Grid Grid.Column="1">
        <Rectangle Fill="Orange"/>
    </Grid>
</Grid>

Вот результат:

введите сюда описание изображения

3

Мне кажется что собака покопалась здесь:

<Grid.RowDefinitions>
    <RowDefinition Height="44*"/>
    <RowDefinition Height="237*"/>
    <RowDefinition Height="36*"/>
    <RowDefinition Height="96*"/>
</Grid.RowDefinitions>

Обратите внимание что высота строки у вас задана в относительных размерах. Таким образом при изменении размера окна у вас изменяются и размеры строк и соответственно все привязанные к ним элементы смещаются.

Ваш ответ

Нажимая «Отправить ответ», вы соглашаетесь с условиями пользования и подтверждаете, что прочитали политику конфиденциальности.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.