首页 文章

XAML-如何固定图像相对于显示窗口右侧的位置？

提问于
浏览 次
0

我正在开发一个使用XAML编写/显示GUI的应用程序 . 我目前在GUI上显示了大部分所需的元素，现在我正在进行布局 - 在特定位置定位各种元素 .

大多数控件/按钮等都对齐到左侧，并且即使我通过将其左手边缘进一步向左拖动来调整窗口大小（图标等等移动到大小），也会保持“绑定”到GUI的左侧保持与窗户边缘的相对距离） .

但是，我有一个元素，我想要向右对齐，以便它将保持“绑定”到GUI的右侧 - 如果我通过将右手边缘向右拖动来调整窗口大小，它应该移动以保持与窗口边缘的相对距离...此刻，该元素停留在我绘制它的位置（即距左侧900像素），无论窗口的大小是多少 - 因此，如果我将窗口的宽度调整为小于900像素，则无法看到该元素 .

我用于绑定到GUI左侧的元素的XAML标记是，例如：

<Button Style="{DynamicResource NoChromeButton}" Click="backBtn_Click" Margin="0, 0, 0, 0" HorizontalAlignment="Left" >
    <Image Source="C:\...\abc.png" Height="30" Width="40" />
</Button>

我试图用于我想要绑定到GUI右侧的元素的XAML标记是：

<Button Style="{DynamicResource NoChromeButton}" Click="referThis" Margin="0, 0, 0, 0" HorizontalAlignment="Right" >
    <TextBlock>Button XYZ</TextBlock>
</Button>

但是，将 HorizontalAlignment 设置为 Right ，并且仍然绑定到显示屏的左侧...我发现向右移动它的唯一方法是为其'x'位置设置一个较大的值，即 Margin="900, 0, 0, 0" ，但是然后位置不是相对于窗口的大小，所以如果我将右手边缘向左拖得太远，那个按钮就在窗口的显示区域之外，所以我看不到它......

我如何设置按钮的属性，使其位置相对于显示窗口的右边缘？

Edit

所有相关元素都显示在相同的 <Grid> 和 <StackPanel> 标签内，即

<StackPanel>
    <Grid ...>
        <Button ... HorizontalAlignment="Left">
        </Button>
        ...
        <Button ... HorizontalAlignment="Right">
        </button>
        ...
    </Grid>
    ...
</StackPanel>
wpf xaml user-interface wpf-positioning

2 回答

  • 1

    以下解决方案的基本思想是 Grid .

    为要与左侧对齐的每个元素创建一个具有固定宽度的 ColumnDefinition ，并为要与右侧对齐的每个元素创建一个具有固定宽度的 ColumnDefinition . 在中间，使用 Width="*" 创建 ColumnDefinition ，因此WPF首先根据其固定长度计算其他列的大小，然后使用中间列填充剩余空间 . 请记住，每个按钮都必须正确设置 Grid.Column 属性以声明它想要属于的列 .

    在调整 Window 的大小时， Grid 会更新其布局和灵活的子项 . 在这种情况下，唯一灵活的孩子是中间栏 .

    这是一个简单的实现：

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

    <Grid.Resources>
      <Style TargetType="{x:Type Button}">
        <Setter Property="Width" Value="100"/>
        <Setter Property="Height" Value="30"/>
        <Setter Property="Margin" Value="10"/>
      </Style>
    </Grid.Resources>

    <Button Grid.Column="0" Content="Button1Left"/>
    <Button Grid.Column="1" Content="Button2Left"/>
    <Button Grid.Column="3" Content="Button1Right"/>
    <Button Grid.Column="4" Content="Button2Right"/>

  </Grid>

    有关 Grid 控件的更完整教程，请检查this，this和this .

    请注意，我为具有特定尺寸和边距的按钮设置了一个简单的样式，仅用于清除结果，但您可以使用自己的样式 .

    回复于
  • 1

    知道容器包括按钮（网格，面板，其他？）会很好：

    无论如何如果你把：

    <Button HorizontalAlignment="Right"

    在

    <StackPanel Orientation="Horizontal">

    它应该工作......检查风格是否带来矛盾......

    回复于

相关问题