Question

这是关于WPF Control定位的奇怪行为。我有一个下面的控件，并在设计时间内很好地对齐。但运行时在按钮的角落给出了错位的定位

<Window x:Class="StackOverflow.LookAndWork"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="Tables" Height="388" Width="314" ResizeMode="NoResize" >
    <Grid>
        <TextBox Margin="12,12,12,41"></TextBox>
        <Button Content="OK" Height="23" Margin="205,314,12,12" Name="button3" Width="75" IsCancel="True"  IsEnabled="False" />

    </Grid>
</Window>

DesignTime Snap

Design Time

运行时快照

Runtime

假设我从Window中删除了ResizeMode =“NoResize”。我能够在运行时看到正确的定位。 ResizeMode =“NoResize”有什么问题？

Anyhelp将不胜感激!!!

Answer 1

为了更好看，请勿使用边距或尺寸。使用网格定义来拆分您的应用程序。

使用以下xaml，您的应用程序将始终具有良好的外观：

<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="23" />
    </Grid.RowDefinitions>
    <TextBox />
    <Grid Grid.Row="1">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="75" />
        </Grid.ColumnDefinitions>
        <Button Grid.Column="1" Content="OK" Name="button3" IsCancel="True"  IsEnabled="False" />
    </Grid>
</Grid>

宽度和高度可以在字典中定义。在这种情况下，在RowDefinition和ColumnDefinition属性中，使用Auto而不是值。

修改： 使用像

这样的词典

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Style TargetType="{x:Type Button}">
        <Setter Property="Width" Value="75"/>
        <Setter Property="Height" Value="23"/>
    </Style>
</ResourceDictionary>

然后

<Window.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>
            <ResourceDictionary Source="Dictionary1.xaml" />
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
</Window.Resources>
<Grid>
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="Auto" />
    </Grid.RowDefinitions>
    <TextBox />
    <Grid Grid.Row="1">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="Auto" />
        </Grid.ColumnDefinitions>
        <Button Grid.Column="1" Content="OK" Name="button3" IsCancel="True"  IsEnabled="False" />
    </Grid>
</Grid>

Answer 2

为什么不在网格级别添加最小边距，而不是在控制级别添加边距？

示例：

<Grid Margin="12,12,12,12">

这样您将获得12像素边距边框。在按钮上，不要做硬编码的左边距。相反，您可以使用HorizontalAlignment="Right"来完成这项工作。

另外，我不太喜欢在网格中添加控件而不指定Grid.RowDefinitions，Grid.ColumnDefinitions，Grid.Row和Grid.Column。它是Grid的强大工具。

Answer 3

我在VisualStudio 2012设计器中看不到同样的问题：http://screencast.com/t/TGVgUyfR 设计时和运行时看起来都一样。因此，设计师的先前版本中应该存在错误。不过，我建议您将按钮移动到单独的网格行中，或使用其他布局控件来组织视图。

Answer 4

为了扩展Xaruth的答案，我不会修复按钮行的高度，而是让它使用默认高度。宽度也一样，我按下按钮定义了宽度。

另请注意，我给按钮留了一个余量。额外的好处是没有修复网格列/行的大小，现在行高也考虑了边距：

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

    <TextBox />
    <Grid Grid.Row="1">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="Auto" />
        </Grid.ColumnDefinitions>

        <Button Grid.Column="1" Content="OK" Name="button3" IsCancel="True"  IsEnabled="False" Width="75" Margin="0,8,0,0" />
    </Grid>
</Grid>

wpf中控制位置的奇怪行为

4 个答案: