Comment faire tous les contrôles redimensionner en conséquence, proportionnellement, lorsque la fenêtre est maximisée?
Lorsque j'ai cliqué sur le bouton maximiser la fenêtre est maximisée mais les contrôles ne sont pas redimensionnés proportionnellement. Quelle est la meilleure façon de redimensionner les contrôles en conséquence? Je suis en utilisant MVVM.
Voici mon code.
<Window x:Class="DataTransfer.View.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Icon="/DataTransfer;component/View/Images/ms_msnexplore.gif"
ResizeMode="CanResizeWithGrip"
Title="Window1" Height="500" Width="600">
<!--Style="{DynamicResource OfficeStyle}"-->
<Window.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<!--<ResourceDictionary Source="/DataTransfer;component/View/WindowBase.xaml" />-->
<!--<ResourceDictionary Source="/DataTransfer;component/Themes/WPFThemes/CalendarResource.xaml" />-->
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Window.Resources>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width ="*" />
</Grid.ColumnDefinitions>
<Button Content="Button" HorizontalAlignment="Left" Margin="52,28,0,0" VerticalAlignment="Top" Width="75" Height="22" />
<DatePicker Name="dp" HorizontalAlignment="Left" Margin="175,25,0,0" VerticalAlignment="Top" Width="123" Text="aaa" GotFocus="DateGotFocused" LostFocus="OnLeaveArchiveDate"/>
<Calendar HorizontalAlignment="Left" Margin="47,162,0,0" VerticalAlignment="Top"/>
<TextBox Name="t1" HorizontalAlignment="Left" Height="23" Margin="337,23,0,0" TextWrapping="Wrap" Text="TextBox" VerticalAlignment="Top" Width="120" LostFocus="LeaveField" />
<RadioButton Content="RadioButton" HorizontalAlignment="Left" Margin="88,92,0,0" VerticalAlignment="Top"/>
<CheckBox Content="CheckBox" HorizontalAlignment="Left" Margin="252,96,0,0" VerticalAlignment="Top"/>
<ComboBox Name="combo" IsEditable="False" Text="aaa" IsReadOnly="True"
HorizontalAlignment="Left" Margin="337,89,0,0" VerticalAlignment="Top" Width="120"
Focusable="True" GotFocus="ComboBoxGotFocused" >
<ComboBoxItem>January</ComboBoxItem>
<ComboBoxItem>February</ComboBoxItem>
</ComboBox>
<TextBlock HorizontalAlignment="Left" Height="40" Margin="260,184,0,0" TextWrapping="Wrap" Text="Text_Block" VerticalAlignment="Top" Width="257"/>
</Grid>
</Window>
2 réponses
Dans WPF, il y a certains contrôles 'container' qui redimensionnent automatiquement leur contenu et il y en a qui ne le font pas.
Voici quelques-uns qui font pas redimensionner leur contenu (je suppose que vous utilisez un ou plusieurs d'entre eux):
StackPanel
WrapPanel
Canvas
TabControl
Voici quelques-uns qui do redimensionner leur contenu:
Grid
UniformGrid
DockPanel
Par conséquent, il est presque toujours préférable d'utiliser un Grid
au lieu d'un StackPanel
sauf si ne veut pas que le redimensionnement automatique se produise. Veuillez noter qu'il est toujours possible pour un Grid
à pas taille de ses commandes intérieures... tout dépend de vos paramètres Grid.RowDefinition
et Grid.ColumnDefinition
:
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="100" /> <!--<<< Exact Height... won't resize -->
<RowDefinition Height="Auto" /> <!--<<< Will resize to the size of contents -->
<RowDefinition Height="*" /> <!--<<< Will resize taking all remaining space -->
</Grid.RowDefinitions>
</Grid>
Vous pouvez en savoir plus sur le contrôle Grid
à partir du Grid
Classe page sur MSDN. Vous pouvez également en savoir plus sur ces contrôles de conteneur à partir de la page WPF Container Controls Overview sur MSDN.
Plus de redimensionnement peut être réalisé à l'aide de la FrameworkElement.HorizontalAlignment
et FrameworkElement.VerticalAlignment
les propriétés. Le la valeur par défaut de ces propriétés est Stretch
qui va étirer les éléments pour s'adapter à la taille de leurs contrôles contenant. Cependant, lorsqu'ils sont définis sur une autre valeur, les éléments ne s'étirent pas .
Mise à jour > > >
En réponse aux questions de votre commentaire:
Utilisez d'abord les paramètres Grid.RowDefinition
et Grid.ColumnDefinition
pour organiser une structure de base... il est courant d'ajouter des contrôles Grid
dans les cellules des contrôles externes Grid
si nécessaire. Vous pouvez également utiliser le Grid.ColumnSpan
et Grid.RowSpan
propriétés permettant aux contrôles d'étendre plusieurs colonnes et / ou lignes d'un Grid
.
, Il est plus fréquent d'avoir au moins une ligne/colonne avec un Height
/Width
de "*"
, qui va remplir tout l'espace restant, mais vous pouvez avoir deux ou plus, avec ce paramètre, auquel cas le reste de l'espace sera divisé entre les deux (ou plus) lignes/colonnes. 'Auto' est un bon paramètre à utiliser pour les lignes / colonnes qui ne sont pas définies sur'"*"', mais cela dépend vraiment de la façon dont vous voulez que la mise en page être.
Il N'y a pas de paramètre Auto
que vous pouvez utiliser sur les contrôles dans les cellules, mais c'est tout aussi bien, car nous voulons que le Grid
dimensionne les contrôles pour nous... par conséquent, nous ne voulons pas du tout définir les Height
ou Width
de ces contrôles.
Le point que j'ai fait à propos des propriétés FrameworkElement.HorizontalAlignment
et FrameworkElement.VerticalAlignment
était juste pour vous faire connaître leur existence... comme leur valeur par défaut est déjà Stretch
, vous n'avez généralement pas besoin de les définir explicitement.
La propriété Margin
est généralement juste utilisé pour espacer vos contrôles uniformément... si vous faites glisser et déposez des contrôles de la boîte à outils Visual Studio, VS définira la propriété Margin
pour placer votre contrôle exactement là où vous l'avez déposé, mais généralement, c'est pas ce que nous voulons car cela va gâcher le dimensionnement automatique des contrôles. Si vous faites cela, supprimez ou modifiez simplement la propriété Margin
en fonction de vos besoins.
Eh Bien, c'est assez simple à faire.
Dans le gestionnaire d'événements de redimensionnement de la fenêtre, Calculez combien la fenêtre a augmenté/diminué et utilisez cette fraction pour ajuster 1) Hauteur, 2) Largeur, 3) Toile.Haut, 4) Toile.Propriétés gauche de tous les contrôles enfants à l'intérieur du canevas.
Voici le code:
private void window1_SizeChanged(object sender, SizeChangedEventArgs e)
{
myCanvas.Width = e.NewSize.Width;
myCanvas.Height = e.NewSize.Height;
double xChange = 1, yChange = 1;
if (e.PreviousSize.Width != 0)
xChange = (e.NewSize.Width/e.PreviousSize.Width);
if (e.PreviousSize.Height != 0)
yChange = (e.NewSize.Height / e.PreviousSize.Height);
foreach (FrameworkElement fe in myCanvas.Children )
{
/*because I didn't want to resize the grid I'm having inside the canvas in this particular instance. (doing that from xaml) */
if (fe is Grid == false)
{
fe.Height = fe.ActualHeight * yChange;
fe.Width = fe.ActualWidth * xChange;
Canvas.SetTop(fe, Canvas.GetTop(fe) * yChange);
Canvas.SetLeft(fe, Canvas.GetLeft(fe) * xChange);
}
}
}