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" />