标签: gridsplitter

我希望有一个简单的3列网格,可调整列,MinWidth为80.

代码如下所示:

<Grid>
  <Grid.ColumnDefinitions>
    <ColumnDefinition Width="120" MinWidth="80"/>
    <ColumnDefinition Width="Auto"/>
    <ColumnDefinition Width="*" MinWidth="80"/>
    <ColumnDefinition Width="Auto"/>
    <ColumnDefinition Width="120" MinWidth="80"/>
  </Grid.ColumnDefinitions>
  <GridSplitter Grid.Column="1" Width="5" HorizontalAlignment="Center" />
  <GridSplitter Grid.Column="3" Width="5" HorizontalAlignment="Center" />
</Grid>

但它不能按我想要的方式工作.当分离器被推到左侧时,一切正常.当第二个分离器向右推时,一切正常.但是如果第一个分离器被推到右侧,它会将第3列和第二个分离器推出网格(或使其宽度= 0).

我使用单独的列作为gridsplitters,就像它在msdn示例中所做的那样:

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

我还将对齐设置为居中,因为我在某处读取了右对齐可能是一个问题并尝试了不同的ResizeBehaviors.

有谁知道,如何解决这个问题,以便始终可见3列宽度至少为80px？

谢谢你的帮助

我遇到了一个奇怪的问题......
看起来使用GridSplitter调整Grid列的大小会禁用(或以其他方式停用)Grid列上定义的触发器.

这是我的设置:

Grid有3列,定义如下:

<Grid.ColumnDefinitions>
    <ColumnDefinition Width="*" />
    <ColumnDefinition>
        <ColumnDefinition.Style>
            <Style>
                <Setter Property="ColumnDefinition.Width" Value="Auto"/>
                <Style.Triggers>
                    <DataTrigger Binding="{Binding Path=OpenItemViewModels.Count}" Value="0">
                        <Setter Property="ColumnDefinition.Width" Value="0"/>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </ColumnDefinition.Style>
    </ColumnDefinition>
    <ColumnDefinition>
        <ColumnDefinition.Style>
            <Style>
                <Setter Property="ColumnDefinition.Width" Value="4*"/>
                <Style.Triggers>
                    <DataTrigger Binding="{Binding Path=OpenItemViewModels.Count}" Value="0">
                        <Setter Property="ColumnDefinition.Width" Value="0"/>
                    </DataTrigger>
                </Style.Triggers>
            </Style>
        </ColumnDefinition.Style>
    </ColumnDefinition>
</Grid.ColumnDefinitions>

期望的是,当第三列中没有构成用于控件的ItemsSource的项时,将为第二列和第三列分配0宽度(分别托管GridSplitter和辅助项控件).

只要我不接触Splitter(当辅助控件中的所有选项卡都关闭时,只有第一列仍然可见),这种方法效果很好.
如果我移动分离器,问题就会开始,从而有效地改变列## 0和2之间的比例.在这种情况下,当右侧控制中的所有项目都关闭时,这些列的宽度不会被重置.

我怀疑这与GridSplitter"覆盖"我在XAML中的定义有关.

有人可以确认/反驳这一理论,并建议如何解决这个问题？

我正在将WinForms应用程序迁移到WPF.到目前为止,一切都进展顺利,除了我尝试使用GridSplitter,我无法在运行时调整大小.

为了确保它不仅仅是我的代码,我试图从LearnWPF.com 编译GridSplitter示例,它似乎也不起作用.我希望看到标准的调整大小光标,当我将鼠标悬停在分割器上时没有发生,并且据我所知,窗口中的分割器也没有其他可视化表示.

我在这里错过了什么？

<Window x:Class="UI.Test"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="Test" Height="300" Width="300">
<Grid>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <StackPanel Background="#feca00" Grid.Column="0">
            <TextBlock FontSize="35" Foreground="#58290A"
               TextWrapping="Wrap">Left Hand Side</TextBlock>
        </StackPanel>
        <GridSplitter/>
        <Border CornerRadius="10" BorderBrush="#58290A"
          BorderThickness="5" Grid.Column="1">
            <TextBlock FontSize="25" Margin="20" Foreground="#FECA00"
               TextWrapping="Wrap">Right Hand Side</TextBlock>
        </Border>
    </Grid>

我在网格分割器上遇到了困难.我已将RowDefinition.Height依赖属性绑定到模型的clr属性,如下所示.

    <Grid.RowDefinitions>
        <RowDefinition Height='{Binding Path=Height, Mode=OneWay}' />
        <RowDefinition Height='*' />
    </Grid.RowDefinitions>

这个工作正常,直到GridSplitter使用.当手动更改行的高度时GridSplitter,它将使用新的固定大小替换绑定(并删除绑定).

您是否有任何想法或变通方法如何创建两行可以使用GridSplitter调整大小但仍然根据clr属性/绑定更改其高度？

我是wpf的初学者,今天我遇到一个奇怪的问题,如果我向网格列添加动画,gridsplitter停止工作,下面是代码片段,它是一个毫无意义但很简单的测试代码,除了当鼠标进入右列,其宽度将从15扩展到100

    <Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Name="c1"/>
        <ColumnDefinition Name="c2" Width="15" MinWidth="15"/>
    </Grid.ColumnDefinitions>
    <Border Grid.Column="0" Background="Gray"></Border>
    <GridSplitter Width="8" Background="Yellow"></GridSplitter>
    <Border Grid.Column="1" Background="Silver" Name="bdRight" MouseEnter="bdRight_MouseEnter"></Border>
</Grid>

还有这个:

        bool flag = true;
    private void bdRight_MouseEnter(object sender, MouseEventArgs e)
    {
        if (flag)
        {
            flag = false;
            var da = new GridLengthAnimation();
            da.From = new GridLength(c2.MinWidth);
            da.To = new GridLength(100);
            var ef = new BounceEase();
            ef.EasingMode = EasingMode.EaseOut;
            da.EasingFunction = ef;
            this.c2.BeginAnimation(ColumnDefinition.WidthProperty, da);
        }
    }

这里是GridLengthAnimation,我发现DoubleAnimation不能用于网格列的宽度,我从互联网上得到它.

public class GridLengthAnimation : AnimationTimeline
{
    public static readonly DependencyProperty FromProperty; …

我有一个垂直的网格分析器,但我得到一个水平的.这是我的XAML

<GroupBox Header="Phase Management">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="5"/>
                <ColumnDefinition Width="*"/>
            </Grid.ColumnDefinitions>

            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"/>
                <RowDefinition Height="70*"/>
                <RowDefinition Height="30*"/>
            </Grid.RowDefinitions>

            <Button>Test column 0</Button>

            <GridSplitter Grid.Column="1" Width="5" HorizontalAlignment="Stretch" Background="#FFFFFF" ResizeBehavior="PreviousAndNext"/>

            <Button Grid.Column="2">Test column 2</Button>

        </Grid>
    </GroupBox>

在网格中我有一个堆栈面板,一个数据网格和一些文本框.知道为什么我的行为有错吗？

我有以下XAML:

<Window x:Class="MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="Auto" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>
        <TextBlock Text="0,0" Grid.Column="0" Background="Yellow" />
        <TextBlock Text="1,0" Grid.Column="1" Background="SkyBlue" />
        <GridSplitter Width="20" Grid.Column="2" HorizontalAlignment="Center" VerticalAlignment="Stretch" ShowsPreview="True" />
        <TextBlock Text="3,0" Grid.Column="3" Grid.Row="0" />
    </Grid>
</Window>

当只有一个ColumnDefinition用Width的Auto,在GridSplitter正常工作.然而,一旦存在与多个列Width的Auto,所述第一Auto列中的时也被调整大小GridSplitter移动(可在细胞中可以看出1,0).

在调整大小之前:

调整大小后:

如何防止GridSplitter调整第二列的大小？

我希望使用Grid作为我的顶级布局.网格将有1列和n行.Grid中的每一行还应包含一个Grid,该Grid应包含3列和1行.在第二列是GridSplitter,我试图使用SharedSizeGroup,这样就可以改变所有嵌套网格中第一列的大小.

这就是我所拥有的...它的工作原理!! ......很好......如果你点击分离器并调整大小而不放手它可以工作......但出于某种原因,如果你调整大小并放开鼠标,然后尝试使用不同的行调整大小,似乎"坚持".

有任何想法吗？

<!-- Parent Grid -->
<Grid Grid.IsSharedSizeScope="True">
    <Grid.RowDefinitions>
        <RowDefinition></RowDefinition>
        <RowDefinition></RowDefinition>
    </Grid.RowDefinitions>

    <!-- First Grid -->
    <Grid Grid.Row="0">
        <Grid.ColumnDefinitions>
            <ColumnDefinition SharedSizeGroup="A" Width="Auto"></ColumnDefinition>
            <ColumnDefinition SharedSizeGroup="B" Width="Auto"></ColumnDefinition>
            <ColumnDefinition SharedSizeGroup="C" Width="Auto"></ColumnDefinition>
        </Grid.ColumnDefinitions>

        <Label Grid.Column="0">One-Left</Label>
        <GridSplitter Grid.Column="1" Width="5" Background="DarkGray"></GridSplitter>
        <Label Grid.Column="2">One-Right</Label>
    </Grid>

    <!-- Second Grid -->
    <Grid Grid.Row="1">
        <Grid.ColumnDefinitions>
            <ColumnDefinition SharedSizeGroup="A" Width="Auto"></ColumnDefinition>
            <ColumnDefinition SharedSizeGroup="B" Width="Auto"></ColumnDefinition>
            <ColumnDefinition SharedSizeGroup="C" Width="Auto"></ColumnDefinition>
        </Grid.ColumnDefinitions>

        <Label Grid.Column="0">Two-Left</Label>
        <GridSplitter Grid.Column="1" Width="5" Background="DarkGray"></GridSplitter>
        <Label Grid.Column="2">Two-Right</Label>
    </Grid>

</Grid>

我在WPF窗口中使用GridSplitter.分割器上方是一个TreeView,下面是一个DockPanel,其中包含一个文本框.当我在TreeView中选择一个项目时,DockPanel的内容将通过数据绑定进行更新.

根据TextBox的内容,窗口的下部窗格会扩展和缩小.我希望它从高度X开始,并保持在那个高度,除非用户拖动GridSplitter.

我尝试在XAML中设置下部DockPanel的高度,但这会修复DockPanel的高度,以便在移动GridSplitter时不会调整大小.也许解决方案涉及Grid.Row Heights？

这是我的页面的一般结构.

Window
  Grid
    row1 Height="*":    TreeView
    row2 Height="5":    GridSplitter
    row3 Height="auto": DockPanel  // gets taller and shorter depending on its content.
      ...
      TextBox

BTW:在我拖动GridSplitter之后,调整大小停止发生,UI表现我想要的样子.

当我将GridSplitter向左拖动时,下面的XAML会将元素推出窗口.如何将所有元素保留在窗口框架内？

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="auto"/>
        <ColumnDefinition Width="auto"/>
    </Grid.ColumnDefinitions>

    <Button Grid.Column="0" Content="0" />
    <Button Grid.Column="1" Content="1" />
    <Button Grid.Column="2" Content="2" />
    <GridSplitter Grid.Column="1" Width="5" HorizontalAlignment="Left" />
</Grid>

谢谢