Nasıl yapılır: GridSplitter ile Sütunları Yeniden Boyutlandırma

  • Makale

Bu örnekte, bir içindeki iki sütun Grid arasındaki boşluğun boyutlarını değiştirmeden yeniden dağıtmak için nasıl dikey GridSplitter oluşturulacağı gösterilmektedirGrid.

Örnek

Bir sütunun kenarına yer paylaşımlı GridSplitter oluşturma

bir içindeki bitişik sütunları yeniden boyutlandıran bir Gridbelirtmek GridSplitter için, ekli özelliği yeniden boyutlandırmak istediğiniz sütunlardan birine ayarlayınColumn. Birden fazla satırınız Grid varsa, ekli özelliği satır sayısına ayarlayın RowSpan . Ardından özelliğini Left veya Right olarak ayarlayın HorizontalAlignment (hangi hizalamayı ayarladığınız, yeniden boyutlandırmak istediğiniz iki sütuna bağlıdır). Son olarak özelliğini olarak StretchayarlayınVerticalAlignment.

<GridSplitter Grid.Column="1" 
              Grid.RowSpan="3" 
              HorizontalAlignment="Left" 
              VerticalAlignment="Stretch"
              Background="Black" 
              ShowsPreview="true"
              Width="5"/>

GridSplitter Kendi sütunu olmayan bir, içindeki diğer denetimler tarafından gizlenebilirGrid. Bu sorunu önleme hakkında daha fazla bilgi için bkz . GridSplitter'ın Görünür Olduğundan Emin Olun.

Bir sütunu kaplayan GridSplitter oluşturma

içindeki bir sütunu kaplayan bir Gridbelirtmek GridSplitter için, ekli özelliği yeniden boyutlandırmak istediğiniz sütunlardan birine ayarlayınColumn. Kılavuzunuzda birden fazla satır varsa, eklenen özelliği satır sayısına ayarlayın RowSpan . Ardından değerini olarak ayarlayınHorizontalAlignment, özelliğini olarak Stretchayarlayın VerticalAlignment ve öğesini içeren GridSplitterAutosütunun değerini olarak ayarlayın.WidthCenter

Aşağıdaki örnekte, bir sütunu kaplayan ve her iki tarafındaki sütunları yeniden boyutlandıran bir dikeyin GridSplitter nasıl tanımlanacağı gösterilmektedir.

<Grid.ColumnDefinitions>
  <ColumnDefinition/>
  <ColumnDefinition Width="Auto" />
  <ColumnDefinition/>
</Grid.ColumnDefinitions>

<GridSplitter Grid.Column="1"
              HorizontalAlignment="Center"
              VerticalAlignment="Stretch"
              Background="Black" 
              ShowsPreview="True"
              Width="5"
              />

Ayrıca bkz.