英文:
How to set button position proportional to the border of grid cell border in WPF
问题
我正在重新排列WPF窗口中的元素。
我已将页面划分为3x3的网格，并希望将按钮放置在网格单元格中，并根据与网格单元格边框的距离比例来控制其大小。在这种情况下，当我调整整个窗口的大小时，按钮将相应地调整大小。
我想要的是按钮左侧到网格单元格左边框的距离是网格单元格宽度的20％，右侧到右边框的距离也是如此。顶部和底部应具有网格单元格高度的10％的距离。
示例XAML如下：
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Button Content="BACK" Grid.Column="0" Grid.Row="2"/>
</Grid>
在XAML中是否有简单的方法来实现这一点，还是必须通过编程来完成？
英文:
I am rearranging the elements in a window in WPF.
I have divided the page into a 3*3 grid and I want to put a button in one of the grid cell and control its size depending on the distance proportion to the grid cell border. In that case when I resize the whole window, the button will resize accordingly.
What I want is the distance of left side of the button to the left border of the grid cell border is 20% of the width of the grid cell, so is the right side to the right border. The top side and bottom side should have the distance of 10% of the grid cell height.
The example xaml is:
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Button Content="BACK" Grid.Column="0" Grid.Row="2"/>
</Grid>
Is there an easy way to do that in XAML or it must be done programmatically?
答案1
得分: 1
使用另一个嵌套的3x3网格，并设置适当的行高和列宽。
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid Grid.Column="0" Grid.Row="2">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="3*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="8*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Button Grid.Column="1" Grid.Row="1" Content="BACK"/>
</Grid>
</Grid>
英文:
Use another nested 3x3 Grid with appropriate row heights and column widths.
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid Grid.Column="0" Grid.Row="2">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="3*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="8*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Button Grid.Column="1" Grid.Row="1" Content="BACK"/>
</Grid>
</Grid>
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论