Wie alle Objekte auf meiner wpf Form, um die Größe, wenn das Fenster zu maximieren

Question

gesetzt

Ich bin neu mit WPF Formen so so einfach sein kann, aber ...

habe ich eine neue wpf Form und 12 hinzugefügt Bilder dazu. Ich setze das Fenster so, dass es maximiert wird. Ich glaube, es passt zu jedem Monitor, auf dem es angezeigt wird, oder? Wie verschiebe ich meine Objekte, sodass sie im maximierten Modus im Allgemeinen gleich aussehen?

Das erste Bild ist, wie es im Designer aussieht, das zweite ist, wie es aussieht, wenn das Programm läuft.

Answer 1

Natürlich wollen Sie Ihre gesamte UI strecken. Dann ist das ViewBox-Steuerelement extrem hilfreich:

<Window ...> 
    <ViewBox> 
     <Grid Height="800" Width="600"> 
      <!-- Everything inside viewbox will be stretched as you resize window 
       Place you UI assuming you have virtual resolution 800x600 --> 
     </Grid> 
    </ViewBox> 
</Window> 

Answer 2

Ich schlage vor, Sie WrapPanel zu verwenden, um Ihre Bilder zu legen:

<WrapPanel> 
<Image x:Name="b1" HorizontalAlignment="Left" Height="50" VerticalAlignment="Top" Source="blackCircle.png" Visibility="Hidden"/> 
    <Image x:Name="b2" HorizontalAlignment="Left" Height="50" VerticalAlignment="Top" Source="blackCircle.png"/> 
    <Image x:Name="b4" HorizontalAlignment="Left" Height="50" VerticalAlignment="Top" Source="blackCircle.png"/> 
    <Image x:Name="b3" HorizontalAlignment="Left" Height="50" VerticalAlignment="Top" Source="blackCircle.png" Visibility="Hidden"/> 
    <Image x:Name="b5" HorizontalAlignment="Left" Height="50" VerticalAlignment="Top" Source="blackCircle.png" Visibility="Hidden"/> 
    <Image x:Name="b6" HorizontalAlignment="Left" Height="50" VerticalAlignment="Top" Source="blackCircle.png"/>   
    <Image x:Name="y1" HorizontalAlignment="Left" Height="50" VerticalAlignment="Top" Width="51" Source="yellowCircle.png"/> 
    <Image x:Name="y2" HorizontalAlignment="Left" Height="50" VerticalAlignment="Top" Width="51" Source="yellowCircle.png" Visibility="Hidden"/> 
    <Image x:Name="y3" HorizontalAlignment="Left" Height="50" VerticalAlignment="Top" Width="51" Source="yellowCircle.png"/> 
    <Image x:Name="y4" HorizontalAlignment="Left" Height="50" VerticalAlignment="Top" Source="yellowCircle.png" Visibility="Hidden"/> 
    <Image x:Name="y5" HorizontalAlignment="Left" Height="50" VerticalAlignment="Top" Source="yellowCircle.png"/> 
    <Image x:Name="y6" HorizontalAlignment="Left" Height="50" VerticalAlignment="Top" Source="yellowCircle.png" Visibility="Hidden"/> 
</WrapPanel> 

WrapPanel wickelt automatisch auf neue Linien, wenn es nicht nicht genug Platz vorhanden ist.

Update:

ich einen Test für 5 Bilder gemacht haben, aber Sie können für 12 Bilder tun. Um 12 Bilder zu machen, sollten Sie 12 Spalten hinzufügen. Lassen Sie mich ein Beispiel zeigen:

<Window x:Class="SOWpfApplication.MainWindow" 
     <!--The code omitted for the brevity--> 
     > 
    <Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="Auto"/> 
      <RowDefinition Height="2*"/> 
      <RowDefinition/> 
     </Grid.RowDefinitions> 
     <Grid> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition/> 
       <ColumnDefinition/> 
       <ColumnDefinition/> 
       <ColumnDefinition/> 
       <ColumnDefinition/> 
      </Grid.ColumnDefinitions> 
      <Image Source="/Images/Back.jpg" Stretch="UniformToFill"/> 
      <Image Source="/Images/Forward.jpg" Grid.Column="1" Stretch="UniformToFill"/> 
      <Image Source="/Images/Back.jpg" Grid.Column="2" Stretch="UniformToFill"/> 
      <Image Source="/Images/Back.jpg" Grid.Column="3" Stretch="UniformToFill"/> 
      <Image Source="/Images/Forward.jpg" Grid.Column="4" Stretch="UniformToFill"/> 
     </Grid> 

     <TextBlock Text="Time is up!" Grid.Row="1" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="50"/>   
     <Button Margin="10" Grid.Row="2" HorizontalAlignment="Left" Height="42" Width="150" Content="Close" /> 
    </Grid> 
</Window> 

Answer 3

Was ich in der Regel tun, ist im Editor des Teils, den Sie erweitern möchten, wählen Sie Anker für oben und rechts, wie dies in der Regel genug ist, Stretching für meine Zwecke. Spielen Sie jedoch mit dem Anker herum, denn das wird Ihnen die Skalierung geben, nach der Sie suchen. In Ihrem Fall möchten Sie vielleicht alle vier Seiten von allem, das Sie skalieren möchten, verankern.

bearbeiten

Alternativ können Sie auch wählen Sie Strecke sowohl für vertikale und horizontale Ausrichtung, die die Dehnung als auch verursachen. Hinweis: Stellen Sie sicher, dass Sie Ränder verwenden, um die Bilder an der gewünschten Position zu positionieren.

Answer 4

Versuchen Sie, Höhe & Breite Eigenschaft als "Auto", Dies wird automatisch die Größe aller Elemente auf Ihrem Formular.

Grüßen, Vishal