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>
31
demandé sur Robert Harvey 2013-10-16 05:23:52

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 StackPanelsauf 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.

77
répondu Sheridan 2018-02-09 16:45:57

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);

                }
            }
        }
3
répondu Ron16 2016-09-08 14:42:52