WPF Penceresi Nasıl Yapılır Duyarlı

Question

Blend İfadesi kullanıyorum ve yeni WPF ile başladım.

Birden çok Izgara barındırabilen ve pencere boyutuna göre boyutlandırılacak minimum bir genişliğe kadar pencereye duyarlı bir pencere oluşturmaya çalışıyorum.

Olacak gibi: Ben Bir Margin ve diğeri Width ve Height ile 'Hizalamalarını' kullanılması olduğunu burada 2 şeyler denedim

<Window x:Class="Blend.MainWindow" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    Title="MainWindow" WindowState="Maximized"> 
<Grid> 
<Border CornerRadius="5" BorderBrush="RoyalBlue" BorderThickness="1" 
       Padding="5" HorizontalAlignment="Left" Margin="20,10,0,0" 
       VerticalAlignment="Top" Height="211.5" Width="484.5"> 
<Grid Background="#FFEDF3F8"> 

</Grid> 
</Border> 
<Border CornerRadius="5" BorderBrush="RoyalBlue" BorderThickness="1" 
    Padding="5" Margin="523.333,10,16.334,283.5"> 
    <Grid Background="#FFEDF3F8"/> 
</Border> 
<Border CornerRadius="5" BorderBrush="RoyalBlue" BorderThickness="1" 
    Padding="5" Margin="21.333,234,16.334,144"> 
    <Grid Background="#FFEDF3F8"/> 
</Border> 
<Border CornerRadius="5" BorderBrush="RoyalBlue" BorderThickness="1" 
    Padding="5" Margin="21.333,372,16.334,31.5"> 
    <Grid Background="#FFEDF3F8"/> 
</Border> 
<Button Content="Button" HorizontalAlignment="Left" Margin="626.833,478.5,0,0" 
VerticalAlignment="Top" Width="49" Background="#FF00458C"/> 
<Button Content="Button" HorizontalAlignment="Left" Margin="693.166,478.5,0,0" 
VerticalAlignment="Top" Width="49" Background="#FF00458C"/> 
</Grid> 
</Window> 

: So Far

Benim Kod

.

Amacımın hangisini çözeceğinden ve ikinci olarak ekran boyutuna cevap vereceğinden emin değil misiniz?

Dinamik Izgara'yı * kullanarak okudum, ancak burada çalışmıyor gibi görünüyor.

sayesinde Doğru şekilde ızgara kullanmadığınız

Answer 1

.

WPF Izgaraları, sütun ve satırların ayarlanmasına izin veren bir özelliğe sahiptir. Daha sonra, kılavuzun içine elemanlar koyar ve hangi satır/sütuna gitmeleri gerektiğini ayarlarsınız.

Tabii ki ızgaralar içinde ızgaralar olabilir.

Daha sonra Genişlik = "2 *" ile oynayabilir ve sütunları diğerlerinden daha büyük veya daha küçük yapmak için "duyarlı bir şekilde" yapabilirsiniz.

Aşağıdaki kod, elde etmeye çalıştığınız şeylere "benzer" bir şey vermelidir. Sen genişlik ve sütun ve satır yüksekliği için "*" ve "Auto" ile oynayabilir

<Grid> 

    <Grid.ColumnDefinitions> 
     <ColumnDefinition Width="2*" /> 
     <ColumnDefinition Width="*" /> 
    </Grid.ColumnDefinitions> 

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

    <Grid Grid.Row="0" 
      Grid.Column="0" 
      Background="Red" /> 

    <Grid Grid.Row="0" 
      Grid.Column="1" 
      Background="Blue" /> 

    <Grid Grid.Row="1" 
      Grid.Column="0" 
      Grid.ColumnSpan="2" 
      Background="Violet" /> 

    <Grid Grid.Row="2" 
      Grid.Column="0" 
      Grid.ColumnSpan="2" 
      Background="Green" /> 

    <StackPanel Grid.Row="3" 
       Grid.ColumnSpan="2" 
       Orientation="Horizontal"> 
     <Button>OK</Button> 
     <Button>Cancel</Button> 
    </StackPanel> 
</Grid> 

, "*" her zaman geçerli pencere genişlik ve yükseklikte bir "yüzde" olarak tanımlanmaktadır. Eğer "*" ve diğeri "2 *" olan bir sütununuz varsa, "2 *" olanı 2/3 1/3 ayırma yapacak olan "*" ile iki kat daha büyük olacaktır.

"Otomatik", "sütunun içini göstermeyi sağlayan daha küçük genişliği veya yüksekliği" alacağı anlamına gelir.