Wie zum Einstellen der Grid-Spalte MaxWidth je nach Fenster-oder Bildschirmgröße in XAML

Ich habe ein 3-Spalten-grid in ein Fenster mit einem GridSplitter auf die erste Spalte. Ich möchte, um die MaxWidth der ersten Spalte, die ein Drittel der das übergeordnete Fenster oder Seite Width (oder ActualWidth) und ich würde es vorziehen, dies zu tun in XAML, wenn möglich.

Dies ist eine Beispiel für die XAML-spielen mit in XamlPad (oder ähnlich), das zeigt, was ich Tue. 

<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>

Wie Sie sehen können, die rechts Spalte-Breite an die Breite der ersten Spalte, so dass, wenn Sie schieben Sie die linke Spalte mit dem splitter, die Rechte Spalte das gleiche tut 🙂
Wenn Sie schieben Sie die linke Spalte nach rechts, irgendwann wird es schieben über die Hälfte der Seite/Fenster und über der rechten Seite des Fensters, die Abstoßung der Spalte 2 und 3.

Möchte ich verhindern, dass diese durch die MaxWidth-in Spalte 1, um ein Drittel der Fensterbreite (oder so ähnlich). Kann ich dies in den code hinter ganz leicht, aber wie man es in "XAML Nur"?

EDIT: David Schmitt vorgeschlagen, um zu verwenden SharedSizeGroup anstelle von Bindung, das ist ein ausgezeichneter Vorschlag. Mein Beispiel-code würde dann so Aussehen:

<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>
InformationsquelleAutor Johan Danforth | 2008-09-17
  1. 7

    Ich denke, dass die XAML-nur die Vorgehensweise ist etwas umständlich, aber hier ist ein Weg, es zu tun.

    <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>
    • Bitte verwenden Sie einen SharedSizeGroup anstelle der Bindung an die Breite der anderen Spalte!
    • Ich habe versucht, die xaml-Code oben in XamlPad und es verhielt sich irgendwie seltsam, aber ich sehe deinen Punkt! Danke.
    InformationsquelleAutor Christopher Bennage
  2. 0

    Zu faul, um tatsächlich schreiben Sie es mir, aber Sie sollten in der Lage zu verwenden ein mathematisches Konverter und eine Bindung zu Ihrem übergeordneten windows-Breite (entweder mit Namen, oder mit einem RelativeSource ancestor-Suche). 

    //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.");
  }
}
    InformationsquelleAutor Thomas
Schreibe einen Kommentar