动态调整页面和属性的大小C＃Visual Studio 2015

Question

我正在尝试在Visual Studio 2015中制作一个应用程序。我是一个新手，所以我并不了解。 就像标题所示，我在使按钮和页面项目调整为框架大小时遇到​​麻烦。 这是我的XAML代码：

<Page
x:Class="Rodojo_start.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Rodojo_start"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
    <Grid.RowDefinitions>
        <RowDefinition Height="auto"></RowDefinition>
        <RowDefinition Height="*"></RowDefinition>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"></ColumnDefinition>
    </Grid.ColumnDefinitions>
    <RelativePanel>
        <Button Width="320" Height="45" Name="Manage_btn" Click="Manage_btn_Click" FontFamily="Segoe MDL2 Assets" Content="&#xE136;" Margin="0,0,0,0"></Button>
    </RelativePanel>
    <RelativePanel>
        <Button Width="320" Height="45" Name="Sale_btn" Click="Sale_btn_Click" FontFamily="Segoe MDL2 Assets" Content="&#xE125;" Margin="320,0,0,0"></Button>
    </RelativePanel>
    <RelativePanel>
        <Button Width="320" Height="45" Name="settingsbtn" Click="settingsbtn_Click" FontFamily="Segoe MDL2 Assets" Content="&#xE115;" Margin="640,0,0,0"></Button>
    </RelativePanel>
    <RelativePanel>
        <Button Width="320" Height="45" Name="aboutbtn" Click="aboutbtn_Click" FontFamily="Segoe MDL2 Assets" Content="&#xE11B;" Margin="960,0,0,0"></Button>
    </RelativePanel>
</Grid>

现在，这些按钮的宽度均为320像素。 我希望他们自己调整大小，但仍将它们放在屏幕顶部。 我尝试了“ ViewBox”部分。 调整了大小，但将按钮放在了屏幕中间。

任何帮助将不胜感激。

谢谢。

Answer 1

我个人认为ViewBox解决方案非常令人困惑。 难以理解控件的大小将如何调整。

在WPF中， 网格，DockPanel和UniformGrid可以自动调整其内容的大小。 您已经开始使用网格来定义您的布局。好吧，继续吧！ 为了使网格调整其内容的大小，将取决于您如何设置其行和列的高度和宽度。

在您的情况下：

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

将“高度”或“宽度"Auto"设置为"Auto" ，网格将被调整为其内容的大小。 将其设置为"*" ，网格将被调整为剩余可用空间的大小。 设置具有特定高度的行，例如"45" ，无论如何都将使该行保持45。

您还可以使用MinHeight/MaxHeight和MinWidth/MaxWidth定义行和列的大小，这将调整网格的大小，但要注意最大或最小尺寸。

因此，我对您的建议是：删除RelativePanels，并定义一个布局网格。 如果要自动调整内容的大小，请不要定义特定的大小，而应使用"Auto", "*", MaxHeight, MinHeight, MaxWidth, MinWidth 。 甚至您的按钮。 如果将按钮的宽度设置为45，则调整大小后，按钮将保持45的宽度！

希望我有所帮助，这是另一个来源： 当窗口最大化时，如何使所有控件相应地按比例调整大小？

Answer 2

好的，我从上面的所有内容中弄清楚了。 这是我的结束代码：

<Page
    x:Class="Rodojo_start.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Rodojo_start"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">
    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <Grid.RowDefinitions>
            <RowDefinition Height="auto"></RowDefinition>
            <RowDefinition Height="*"></RowDefinition>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*"></ColumnDefinition>
            <ColumnDefinition Width="*"></ColumnDefinition>
            <ColumnDefinition Width="*"></ColumnDefinition>
            <ColumnDefinition Width="*"></ColumnDefinition>
        </Grid.ColumnDefinitions>
        <Button Name="Manage_btn" Click="Manage_btn_Click" FontFamily="Segoe MDL2 Assets" Content="&#xE136;" Margin="0,0,0,0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>
        <Button Name="Sale_btn" Click="Sale_btn_Click" FontFamily="Segoe MDL2 Assets" Content="&#xE125;" Margin="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Grid.Column="1"/>
        <Button Name="settingsbtn" Click="settingsbtn_Click" FontFamily="Segoe MDL2 Assets" Content="&#xE115;" Margin="0" Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>
        <Button Name="aboutbtn" Click="aboutbtn_Click" FontFamily="Segoe MDL2 Assets" Content="&#xE11B;" Margin="0" Grid.Column="3" HorizontalAlignment="Stretch" VerticalAlignment="Stretch"/>
    </Grid>
</Page>

它完全按照我想要的方式工作。 再次感谢大家的一切！