将标签和组合框放在一起

时间:2018-02-28 23:36:09

标签: wpf xaml

我有三个标签和组合框。 参见演示。

enter image description here 每个标签和相应的Combobox彼此​​相邻。

我使用Grid将行分成几列。然后将Label和Combobox放入每列。然而,即使我设置HorizontalAlignment = "Left"

,它们也不是紧挨着的

如果我设置边距来调整位置。它温和地运作。 当我调整用户控件的大小时,形状发生了变化。我想要响应式UI,但边缘值是硬编码的。

第一个标签应该在要求的左边。 那么最好的方法是什么呢?

编辑代码

<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="350" Width="525">
<Grid Height="35">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="10" />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="10" />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="10" />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="10" />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="10" />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="10" />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="10" />
    </Grid.ColumnDefinitions>
    <Label Grid.Column="1" Content="Label1:" />
    <ComboBox Grid.Column="3" />
    <Label Grid.Column="5" Content="Label2:" />
    <ComboBox Grid.Column="7" />
    <Label Grid.Column="9" Content="Label3:" />
    <ComboBox Grid.Column="11" />
</Grid>

1 个答案:

答案 0 :(得分:1)

只需将auto用于标签列,将*用于组合框:

 <Grid Height="35">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="auto" />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="auto" />
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="Auto" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <Label Grid.Column="0" Content="Label1:" />
    <ComboBox Grid.Column="1"  Margin="0,0,10,0"/>
    <Label Grid.Column="2" Content="Label2:" />
    <ComboBox Grid.Column="3" Margin="0,0,10,0" />
    <Label Grid.Column="4" Content="Label3:" />
    <ComboBox Grid.Column="5" Margin="0,0,10,0"/>
</Grid>

如果你的组合框没有填充剩余的空间,请使用HorizantalAlignement

  <ComboBox Grid.Column="1"  Width="100" HorizontalAlignment="Left"/>