WPF 网格列 def auto 始终从右侧剪切

Question

我有一个 WPF 应用程序，其中有一个网格，其中 2 列设置为 * 和自动。问题是，当我减小窗口的大小时，第二列中的子项将从右侧而不是左侧被剪切。我希望它们从左侧剪辑，因为我已将水平对齐设置为右侧。有没有办法可以剪切左侧的第二列元素？

<Window x:Class="WpfApp2.MainWindow"

        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"

        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"

        xmlns:local="clr-namespace:WpfApp2"

        mc:Ignorable="d"

        Title="MainWindow" Height="450" Width="800" >

    <Grid>

        <Grid.ColumnDefinitions>

            <ColumnDefinition Width="*" MinWidth="60"/>

            <ColumnDefinition Width="auto"/>

        </Grid.ColumnDefinitions>

        <DockPanel  HorizontalAlignment="Right" Grid.Column="1">

            <Button Click="Button_Click" Content="click me" Width="150" DockPanel.Dock="Right" />

            <Label Content="abcdef" Width="200" DockPanel.Dock="Right" />

            <Label x:Name="mLog"/>

        </DockPanel>

        <Button Click="Button_Click" DockPanel.Dock="Right" Content="click me" Width="150"/>

        <Label Content="abcdef" Width="200" DockPanel.Dock="Right"/>

    </Grid>

</Window>

Answer 1

&nbsp;而不是这个：<Window x:Class="WpfApp2.MainWindow"&nbsp; &nbsp; &nbsp; &nbsp; xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"&nbsp; &nbsp; &nbsp; &nbsp; xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"&nbsp; &nbsp; &nbsp; &nbsp; xmlns:d="http://schemas.microsoft.com/expression/blend/2008"&nbsp; &nbsp; &nbsp; &nbsp; xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"&nbsp; &nbsp; &nbsp; &nbsp; xmlns:local="clr-namespace:WpfApp2"&nbsp; &nbsp; &nbsp; &nbsp; mc:Ignorable="d"&nbsp; &nbsp; &nbsp; &nbsp; Title="MainWindow" Height="450" Width="800" >&nbsp; &nbsp; <Grid>&nbsp; &nbsp; &nbsp; &nbsp; <Grid.ColumnDefinitions>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <ColumnDefinition Width="*" MinWidth="60"/>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <ColumnDefinition Width="auto"/>&nbsp; &nbsp; &nbsp; &nbsp; </Grid.ColumnDefinitions>&nbsp; &nbsp; &nbsp; &nbsp; <DockPanel&nbsp; HorizontalAlignment="Right" Grid.Column="1">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <Button Click="Button_Click" Content="click me" Width="150" DockPanel.Dock="Right" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <Label Content="abcdef" Width="200" DockPanel.Dock="Right" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <Label x:Name="mLog"/>&nbsp; &nbsp; &nbsp; &nbsp; </DockPanel>&nbsp; &nbsp; &nbsp; &nbsp; <Button Click="Button_Click" DockPanel.Dock="Right" Content="click me" Width="150"/>&nbsp; &nbsp; &nbsp; &nbsp; <Label Content="abcdef" Width="200" DockPanel.Dock="Right"/>&nbsp; &nbsp; </Grid></Window>尝试这个：<Window x:Class="WpfApp2.MainWindow"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; xmlns:d="http://schemas.microsoft.com/expression/blend/2008"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; xmlns:local="clr-namespace:WpfApp2"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; mc:Ignorable="d"&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; Title="MainWindow" Height="450" Width="800" >&nbsp; &nbsp; &nbsp; &nbsp; <Grid>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <Grid.ColumnDefinitions>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <ColumnDefinition Width="*" MinWidth="60"/>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <ColumnDefinition Width="auto"/>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </Grid.ColumnDefinitions>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <DockPanel&nbsp; HorizontalAlignment="Right" Grid.Column="1">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <Button Click="Button_Click" Content="click me" Width="150" DockPanel.Dock="Right" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <Label Content="abcdef" Width="200" DockPanel.Dock="Right" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <Label x:Name="mLog"/>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; </DockPanel>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <Button Click="Button_Click" DockPanel.Dock="Right" Content="click me"/>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <Label Content="abcdef" Width="200" DockPanel.Dock="Right"/>&nbsp; &nbsp; &nbsp; &nbsp; </Grid>&nbsp; &nbsp; </Window>我删除了最后一个按钮宽度属性。

Answer 2

我猜你正在尝试制作 3 列布局，两侧各有 1 个按钮，中间有 1 个内容通道。因此，您可以尝试这样的操作，其中所有内容都位于具有不同 z-index 和水平对齐的同一网格中，现在，当您调整窗口大小时，标签保持在中间，按钮“夹在”标签内容的右侧和后面左边。<Grid>&nbsp; &nbsp; <Button HorizontalAlignment="Left" Content="click me" Width="150" />&nbsp; &nbsp; <Button HorizontalAlignment="Right" Content="click me" Width="150" />&nbsp; &nbsp; <Label HorizontalAlignment="Center" Content="abcdef" Width="200" Background="White" /></Grid>

Answer 3

在 DockPanel 中，HorizontalAlignment 仅当 DockPanel 的宽度大于其所有子项的总宽度时才有用。按钮和标签的大小固定为 200 和 150，我相信 WPF 的行为将从左侧剪切元素。第一个棘手的方法是让 DockPanel 填充两列，当网格变小时，DockPanel 的一部分将进入第一列的内容下方，给人一种从左侧剪切的感觉。&nbsp;<Grid>&nbsp; &nbsp; &nbsp;<Grid.ColumnDefinitions>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<ColumnDefinition Width="*" MinWidth="60"/>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<ColumnDefinition Width="*"/>&nbsp; &nbsp; &nbsp;</Grid.ColumnDefinitions>&nbsp; &nbsp; &nbsp;<DockPanel HorizontalAlignment="Right" Grid.ColumnSpan="2" LastChildFill="True">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<Button Click="Button_Click" Content="click me 2" Width="150" DockPanel.Dock="Right" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<Label Content="abcdef 2" Width="200" />&nbsp; &nbsp; &nbsp; &nbsp; &nbsp;<Label x:Name="mLog" DockPanel.Dock="Right"/>&nbsp; &nbsp; &nbsp;</DockPanel>&nbsp; &nbsp; &nbsp;<Button Click="Button_Click" Content="click me 1" HorizontalContentAlignment="Stretch"/>&nbsp; &nbsp; &nbsp;<Label Content="abcdef 1" HorizontalContentAlignment="Stretch"/>&nbsp;</Grid>另一种正确的方法是使用另一个 Grid 而不是 DockPanel，确保我们让第一列填充空间，以便与容器一起减小尺寸。&nbsp; &nbsp; <Grid HorizontalAlignment="Right" Grid.Column="1">&nbsp; &nbsp; &nbsp; &nbsp; <Grid.ColumnDefinitions>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <ColumnDefinition Width="*"/>&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <ColumnDefinition Width="150"/>&nbsp; &nbsp; &nbsp; &nbsp; </Grid.ColumnDefinitions>&nbsp; &nbsp; &nbsp; &nbsp; <Button Click="Button_Click" Content="click me" Grid.Column="1" MinWidth="150"/>&nbsp; &nbsp; &nbsp; &nbsp; <Label Content="abcdef" Grid.Column="0"/>&nbsp; &nbsp; &nbsp; &nbsp; <Label x:Name="mLog"/>&nbsp; &nbsp; </Grid>