WPF - Изменение размера элементов управления в окне с изменением размера

Так что я довольно новичок в WPF и у меня проблемы с компоновкой моего окна. В настоящее время у меня есть приложение WPF с сеткой, определенной так:

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

В самом верхнем ряду, охватывающем две колонки, у меня есть Меню. Во втором ряду у меня есть несколько меток в первом столбце, а во втором столбце - изображение и WindowsFormsHost, наконец, в третьем ряду у меня есть графический элемент управления. По умолчанию я установил размер изображения и WFH равным 570 x 413. Теперь я бы хотел, чтобы и размер изображения, и размер WFH увеличивались при изменении размеров моего окна таким образом, чтобы они сохраняли одинаковый относительный (по отношению к окну) размер. (Я действительно хотел бы, чтобы то же самое происходило и с моим графическим элементом управления, но я, вероятно, смогу выяснить это, если смогу получить другие. Я не могу понять, какую настройку мне нужно включить / выключить или что мне может понадобиться связать или что-то еще, чтобы это произошло. Любая помощь очень ценится!

Спасибо!

2 ответа

Решение

Ты пытался:

<RowDefinition Height="*" />

Обязательно присвойте свой Grid.Row в вашем изображении или элементе управления, но не подписывайте свойства высоты / ширины элементов управления. Контроль должен автоматически изменяться с расширением.

Обновить

Сделал быстрый тест, чтобы убедиться, что это работает.

<Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="23"/>
            <RowDefinition Height="*"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>

        <Label Grid.Row="0" Content="Example"/>
        <Image Grid.Row="1" Source="c:\Example.jpg"/>
        <Label Grid.Row="2" Content="Example2"/>
    </Grid>

Изображение расширяется вместе с приложением в зависимости от пропорций изображения. Он расширяется, но сохраняет свои размеры вместе с полным изображением в поле зрения. Если вы измените определение строки с ***** на Авто, вы заметите, что изображение будет расширяться, но оно будет расширяться после вашего обзора. Это означает, что вы не всегда будете видеть полное изображение.

Я бы предложил сделать простое приложение, как описано выше, и поиграть с ограничениями, чтобы выяснить, что каждый из них делает.

Вам нужно показать больше информации в своем описании, потому что все свойства сетки, изображения и т. Д. Будут учитываться при компоновке.

Тем не менее, вы, возможно, захотите взглянуть на свойства HorizontalAlignment и VerticalAlignment вашей Grid и вашего изображения, а также на свойство Stretch изображения. Кроме того, вы не хотите указывать фиксированный размер изображения (вы можете указать MinWidth и MinHeight, если вы хотите, чтобы они были определенного размера при запуске).

Вот быстрый пример, который показывает сетку, заполняющую окно, с масштабируемым изображением.

<Grid HorizontalAlignment="Stretch"
      VerticalAlignment="Stretch">
        <Grid.RowDefinitions>
            <RowDefinition Height="23" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>

    <Label Grid.Column="0" Grid.Row="0" Grid.ColumnSpan="2" Content="First Row" />
    <Label Grid.Column="0" Grid.Row="1" Content="Column 0, Row 1" />

    <Image Grid.Column="1" Grid.Row="1" 
           HorizontalAlignment="Stretch"
           VerticalAlignment="Stretch"
           Source="Resources\ExamplePicture.png"
           Stretch="Uniform" />

Другие вопросы по тегам