XAML

2008-09-17 28 views
7

'daki Pencere veya Ekran Boyutuna Bağlı Olarak Izgara Sütunu MaxWidth Nasıl Ayarlanır İlk sütunda GridSplitter içeren bir pencerede 3 sütun ızgaram var. İlk sütunun MaxWidth değerini ana pencerenin üçte birine veya (veya ActualWidth) üçüncü kümesine ayarlamak istiyorum ve bunu mümkünse XAML'de yapmayı tercih ederim.XAML

Bu, yaptığım şeyi gösteren XamlPad (veya benzeri) ile çalınacak bazı örnek XAML'dir.

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:sys="clr-namespace:System;assembly=mscorlib" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" > 
    <Grid> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition x:Name="Column1" Width="200"/> 
      <ColumnDefinition x:Name="Column2" MinWidth="50" /> 
      <ColumnDefinition x:Name="Column3" Width="{ Binding ElementName=Column1, Path=Width }"/> 
      </Grid.ColumnDefinitions> 

     <Label Grid.Column="0" Background="Green" /> 
     <GridSplitter Grid.Column="0" Width="5" /> 
     <Label Grid.Column="1" Background="Yellow" /> 
     <Label Grid.Column="2" Background="Red" /> 
    </Grid> 
</Page> 

Gördüğünüz gibi, sağ sütun genişliği ilk sütunun genişliğine bağlıdır, bu nedenle ayırıcı kullanılarak sol sütun slayt zaman slayt ise sağ sütun aynı :) yapar sağdaki sol sütun, sonunda sayfa/pencere ve pencerenin sağ tarafına doğru kaydırılır, 2 ve 3 numaralı sütunlara doğru itilir.

Bunu önlemek için, sütun 1'in MaxWidth değerini ayarlayarak bunu engellemek istiyorum. Pencere genişliğinin üçte biri (ya da bunun gibi bir şey). Bunu kod içinde oldukça kolay bir şekilde yapabilirim, ancak "XAML Only" de nasıl yapabilirim?

EDIT: David Schmitt mükemmel bir öneri olan ciltleme yerine SharedSizeGroup'u kullanmayı önerdi. Benim örnek kod bu o şekilde görünecektir:

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:sys="clr-namespace:System;assembly=mscorlib" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" > 
     <Grid IsSharedSizeScope="True"> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition x:Name="Column1" SharedSizeGroup="ColWidth" Width="40"/> 
       <ColumnDefinition x:Name="Column2" MinWidth="50" Width="*" /> 
       <ColumnDefinition x:Name="Column3" SharedSizeGroup="ColWidth"/> 
      </Grid.ColumnDefinitions> 
      <Label Grid.Column="0" Background="Green" /> 
      <GridSplitter Grid.Column="0" Width="5" /> 
      <Label Grid.Column="1" Background="Yellow" /> 
      <Label Grid.Column="2" Background="Red" /> 
     </Grid> 
</Page> 

cevap

7

Yalnızca XAML yaklaşımının biraz dolambaçlı olduğunu düşünüyorum, ama burada bunu yapmanın bir yolu var.

<Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:sys="clr-namespace:System;assembly=mscorlib" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" > 

    <!-- This contains our real grid, and a reference grid for binding the layout--> 
    <Grid x:Name="Container"> 

     <!-- hidden because it's behind the grid below --> 
     <Grid x:Name="LayoutReference"> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="*"/> 
      <ColumnDefinition Width="*"/> 
      <ColumnDefinition Width="*"/> 
     </Grid.ColumnDefinitions> 
     <!-- We need the border, because the column doesn't have an ActualWidth --> 
     <Border x:Name="ReferenceBorder" 
       Background="Black" /> 
     <Border Background="White" Grid.Column="1" /> 
     <Border Background="Black" Grid.Column="2" /> 
     </Grid> 

     <!-- I made this transparent, so we can see the reference --> 
     <Grid Opacity="0.9"> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition x:Name="Column1" 
           MaxWidth="{Binding ElementName=ReferenceBorder,Path=ActualWidth}"/> 
       <ColumnDefinition x:Name="Column2" 
           MinWidth="50" /> 
       <ColumnDefinition x:Name="Column3" 
           Width="{ Binding ElementName=Column1, Path=Width }"/> 
       </Grid.ColumnDefinitions> 

      <Label Grid.Column="0" Background="Green"/> 
      <GridSplitter Grid.Column="0" Width="5" /> 
      <Label Grid.Column="1" Background="Yellow" /> 
      <Label Grid.Column="2" Background="Red" /> 
     </Grid> 
    </Grid> 

</Page> 
+4

Lütfen başka bir sütunun genişliğine Bağlama yerine bir SharedSizeGroup kullanın! –

+0

XamlPad'in yukarısındaki xaml'ı denedim ve garip davranıyordu, ama ben sizin dikkatinizi çekiyorum! Teşekkürler. –

0

Çok tembel aslında kendim yazma, ancak (her iki isimle ya ile ana pencere genişliğine matematiksel dönüştürücü kullanmak ve bağlamak gerekir için Bir RelativeSource atası araması).

//I know I borrowed this from someone, sorry I forgot to add a comment from whom 
public class ScaledValueConverter : IValueConverter 
{ 
    public Object Convert(Object value, Type targetType, Object parameter, System.Globalization.CultureInfo culture) 
    { 
    Double scalingFactor = 0; 
    if (parameter != null) 
    { 
     Double.TryParse((String)(parameter), out scalingFactor); 
    } 

    if (scalingFactor == 0.0d) 
    { 
     return Double.NaN; 
    } 

    return (Double)value * scalingFactor; 
    } 

    public Object ConvertBack(Object value, Type targetType, Object parameter, System.Globalization.CultureInfo culture) 
    { 
    throw new Exception("The method or operation is not implemented."); 
    } 
}