Question

在WPF应用程序中，一个包含3列的网格面板，如下所述

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

第二列中有一个滑块，当窗口宽度减小时滑块的宽度需要减小，在某些时候滑块需要消失（响应式设计的种类）。我尝试将第二列和滑块的绑定宽度命名为列的“ActualWidth”属性，但它没有帮助。还有另一种方法来处理窗口的大小更改事件并进行一些调整。还有其他简单方法吗？

更新1：添加更多我的代码

 <Grid VerticalAlignment="Top" HorizontalAlignment="Stretch">
<Grid.ColumnDefinitions>
    <ColumnDefinition Width="250"/>
    <ColumnDefinition Width="*"/>
    <ColumnDefinition Width="250"/>
</Grid.ColumnDefinitions>
<!-- some other elements in cell 0-->
<StackPanel Grid.Column="1"  Orientation="Horizontal" HorizontalAlignment="Center">
            <Button Width="22" Height="22">
                <Image Source="a.png"/>
            </Button>
            <Slider MinWidth="100" MaxWidth="320" Width="320"/>
            <Button Width="22" Height="22" >
                <Image Source="b.png"/>
            </Button>
  <!-- some other elements in cell 2-->
 </StackPanel>
 </Grid>

Answer 1

假设滑块是一个通用的WPF滑块控件，那么只需将滑块放在第二列中就可以了，因为默认情况下控件应该填充所有可用的列空间。您应用于滑块的样式是否会影响此功能？滑块应填满列，如果使用此代码，窗口/列调整大小时缩小为虚无

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="250"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="250"/>
    </Grid.ColumnDefinitions>
    <Slider Grid.Column='1'></Slider>
</Grid>

修改

根据您的新代码，或许这可能更符合您的目标？

<DockPanel VerticalAlignment="Top">  <Grid Width="250" DockPanel.Dock="Left"/>  <Grid Width="250" DockPanel.Dock="Right"/>  <DockPanel> <Button DockPanel.Dock="Left" Width="22" Height="22"> <Rectangle Fill="Blue"/> </Button> <Button DockPanel.Dock="Right" Width="22" Height="22" > <Rectangle Fill="Blue"/> </Button> <Slider/> </DockPanel> </DockPanel>

滑块将相应调整大小并消失，并且在调整窗口大小期间滑块位置将保持一致

Answer 2

这是因为ActualWidth的{{1}}不是ColumnDefinition，DependencyProperty在此属性发生变化时无法通知。

而是尝试将第2列中的所有控件分组到ColumnDefinition内并绑定到网格的Grid。

WPF，控制宽度随窗口宽度的变化而变化

2 个答案: