0

私は5列のレイアウトを持っています。目的は、3 つの主要な列 (左、中央、右) を作成し、それを拡大および縮小できるようにすることです。これを実現するために、スプリッターを含む 2 つの列を追加しました。1 つは左と中央の列の間、もう 1 つは中央と右の間にあります。

アプリケーションを起動し、最初のスプリッターを左に移動すると、最後の列 (右) が突然左にスナップし、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>
4

1 に答える 1

1

あなたのコードは私のために働きます。
しかし、スプリッターに固定幅を使用して中央に配置する方がきれいだと思います。
スプリッターが次の列に対してある場合、時折、うまくいかないように見えます。

多くの場合、1 つを除くすべてに Auto を使用する必要があります。
相対的なサイジングのために 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>
于 2012-12-07T18:09:30.397 に答える