5 2 gridsplitters가있는 열 레이아웃 - 예기치 않은 동작

Question

5 열 레이아웃이 있습니다. 목표는 확장 및 축소 할 수있는 3 개의 주 열 (왼쪽, 가운데, 오른쪽)을 갖는 것입니다. 이를 달성하기 위해 스플리터가 포함 된 두 개의 추가 열을 추가했습니다. 하나는 왼쪽과 가운데 열 사이에 있고 다른 하나는 가운데와 오른쪽 사이에 있습니다.

응용 프로그램을 시작한 후 첫 번째 스플리터를 왼쪽으로 이동하면 마지막 열 (오른쪽)이 갑자기 왼쪽으로 스냅되어 세 열 모두가 접 힙니다. 어떤 제안? 여기

감사

는 XAML의 :

<Window x:Class="ThreeColumns.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     Title="MainWindow" Height="350" Width="725"> 
    <Grid> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="*"></ColumnDefinition> 
      <ColumnDefinition Width="auto"></ColumnDefinition> 
      <ColumnDefinition Width="*"></ColumnDefinition> 
      <ColumnDefinition Width="auto"></ColumnDefinition> 
      <ColumnDefinition Width="*"></ColumnDefinition> 
     </Grid.ColumnDefinitions> 
     <Grid.RowDefinitions> 
      <RowDefinition></RowDefinition> 
     </Grid.RowDefinitions> 
     <Border BorderBrush="Red" BorderThickness="5" Grid.Column="0" Grid.Row="0" CornerRadius="10"> 
      <TextBlock Text="Left side" FontSize="24"></TextBlock> 
     </Border> 
     <GridSplitter Background="blue" Width="5" 
         HorizontalAlignment="Stretch" 
         VerticalAlignment="Stretch" Grid.Column="1"></GridSplitter> 
     <Border BorderBrush="Red" BorderThickness="5" Grid.Column="2" Grid.Row="0" CornerRadius="10"> 
      <TextBlock Text="Middle" FontSize="24"></TextBlock> 
     </Border> 
     <GridSplitter Background="blue" Width="5" 
         HorizontalAlignment="Stretch" 
         VerticalAlignment="Stretch" Grid.Column="3"></GridSplitter> 
     <Border BorderBrush="Red" BorderThickness="5" Grid.Column="4" Grid.Row="0" CornerRadius="10"> 
      <TextBlock Text="Right side" FontSize="24"></TextBlock> 
     </Border> 
    </Grid> 
</Window> 

나는 처음과 마지막 열을 설정하여 그것을 해결하기 위해 관리는 폭 "자동"중간 내용 열에 "*"로 :

<Window x:Class="ThreeColumns.MainWindow" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     Title="MainWindow" Height="350" Width="725"> 
    <DockPanel> 
     <Grid> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition MinWidth="50" Width="auto" Name="Col1"></ColumnDefinition> 
       <ColumnDefinition Width="7" Name="Col2"></ColumnDefinition> 
       <ColumnDefinition Name="Col3" Width="*"></ColumnDefinition> 
       <ColumnDefinition Width="7" Name="Col4"></ColumnDefinition> 
       <ColumnDefinition MinWidth="50" Width="auto"></ColumnDefinition> 
      </Grid.ColumnDefinitions> 
      <Grid.RowDefinitions> 
       <RowDefinition></RowDefinition> 
      </Grid.RowDefinitions> 
      <Border BorderBrush="Red" BorderThickness="5" Grid.Column="0" Grid.Row="0" CornerRadius="10" Margin="2 2 2 2"> 
       <TextBlock Text="Left side" Width="250" FontSize="24"></TextBlock> 
      </Border> 

      <Border BorderBrush="Red" BorderThickness="5" Grid.Column="2" Grid.Row="0" CornerRadius="10" Margin="2 2 2 2"> 
       <TextBlock Text="Middle" FontSize="24"></TextBlock> 
      </Border> 
      <Border BorderBrush="Red" BorderThickness="5" Grid.Column="4" Grid.Row="0" CornerRadius="10" Margin="2 2 2 2"> 
       <TextBlock Text="Right side" Width="250" FontSize="24"></TextBlock> 
      </Border> 
      <GridSplitter Background="blue" Width="5" 
         HorizontalAlignment="Center" ResizeDirection="Columns" 
         VerticalAlignment="Stretch" Grid.Column="1" Grid.ZIndex="1"/> 
      <GridSplitter Background="blue" Width="5" 
         HorizontalAlignment="Center" ResizeDirection="Columns" 
         VerticalAlignment="Stretch" Grid.Column="3" Grid.ZIndex="1"/> 
     </Grid> 
    </DockPanel> 
</Window> 

Answer 1

귀하의 코드는 나를 위해 작동합니다.
하지만 스플리터의 고정 너비를 사용하고 중심을 정돈하는 것이 더 깔끔합니다.
스플리터가 다음 열에 반대하는 경우가 종종 있습니다.

종종 하나를 제외하고 모두를 위해 자동을 사용할 필요가 있습니다.
상대 크기 조정을 위해 2 * 3 *과 같은 것을 시도하면 문제가 자주 발생합니다.
크기 조정을 시작하기를 원할 경우 여러 개의 단일 *이 작동 할 수 있습니다.

<Grid> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="Auto></ColumnDefinition> 
      <ColumnDefinition Width="7"></ColumnDefinition> 
      <ColumnDefinition Width="*"></ColumnDefinition> 
      <ColumnDefinition Width="7"></ColumnDefinition> 
      <ColumnDefinition Width="Auto"></ColumnDefinition> 
     </Grid.ColumnDefinitions> 
     <Grid.RowDefinitions> 
      <RowDefinition></RowDefinition> 
     </Grid.RowDefinitions> 
     <Border BorderBrush="Red" BorderThickness="5" Grid.Column="0" Grid.Row="0" CornerRadius="10"> 
      <TextBlock Text="Left side" FontSize="24"></TextBlock> 
     </Border> 
     <GridSplitter Background="blue" Width="3" 
         HorizontalAlignment="Center" 
         VerticalAlignment="Stretch" Grid.Column="1"></GridSplitter> 
     <Border BorderBrush="Red" BorderThickness="5" Grid.Column="2" Grid.Row="0" CornerRadius="10"> 
      <TextBlock Text="Middle" FontSize="24"></TextBlock> 
     </Border> 
     <GridSplitter Background="blue" Width="3" 
         HorizontalAlignment="Center" 
         VerticalAlignment="Stretch" Grid.Column="3"></GridSplitter> 
     <Border BorderBrush="Red" BorderThickness="5" Grid.Column="4" Grid.Row="0" CornerRadius="10"> 
      <TextBlock Text="Right side" FontSize="24"></TextBlock> 
     </Border> 
    </Grid>