如何更改UWP应用程序不同页面的列宽？

我有一个应用程序，它有一个应用程序外壳。这里我在页面中定义了一个分区，如下所示

<UserControl>
<Grid>
  <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="100" />
    </Grid.ColumnDefinitions>
</Grid>
</UserControl>

我的应用程序中有不同的页面，每个页面都维护这个分区。但是，我确实有一个页面希望将这个分区更改为不同的数字

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

如果不为每个页面创建分区，我将如何实现这一点？分区位于AppShell.xaml中，它具有相应的ViewModel AppSHellViewModel。此外，每个页面都有一个视图和一个视图模型。如何从另一个xaml视图更改用户控件的列宽

如果不为每个页面创建分区，我将如何实现这一点

如果不想为每个页面生成网格并设置动态分区号，可以在代码隐藏中生成网格，如下所示

private Panel AddBaseLayout()
{
    Grid grid = new Grid();  
    ColumnDefinition col1 = new ColumnDefinition();
    ColumnDefinition col2 = new ColumnDefinition();
    ColumnDefinition col3 = new ColumnDefinition();
    col1.Width = new GridLength(0, GridUnitType.Auto);
    col2.Width = new GridLength(0, GridUnitType.Auto);
    col3.Width = new GridLength(1, GridUnitType.Star);
    grid.ColumnDefinitions.Add(col1);
    grid.ColumnDefinitions.Add(col2);
    grid.ColumnDefinitions.Add(col3);

    return grid;
}

RootGrid.Children.Add(AddBaseLayout());

public sealed partial class CustomControl : UserControl
{
    public CustomControl()
    {
        this.InitializeComponent();
    }

    public GridLength ColumnWidth
    {
        get { return (GridLength)GetValue(ColumnWidthProperty); }
        set { SetValue(ColumnWidthProperty, value); }
    }

    // Using a DependencyProperty as the backing store for ColumnWidth.  This enables animation, styling, binding, etc...
    public static readonly DependencyProperty ColumnWidthProperty =
        DependencyProperty.Register("ColumnWidth", typeof(GridLength), typeof(CustomControl), new PropertyMetadata(0));


}

如何从另一个xaml视图更改用户控件的列宽

您可以为用户控件创建一个依赖项属性，如下所示

private Panel AddBaseLayout()
{
    Grid grid = new Grid();  
    ColumnDefinition col1 = new ColumnDefinition();
    ColumnDefinition col2 = new ColumnDefinition();
    ColumnDefinition col3 = new ColumnDefinition();
    col1.Width = new GridLength(0, GridUnitType.Auto);
    col2.Width = new GridLength(0, GridUnitType.Auto);
    col3.Width = new GridLength(1, GridUnitType.Star);
    grid.ColumnDefinitions.Add(col1);
    grid.ColumnDefinitions.Add(col2);
    grid.ColumnDefinitions.Add(col3);

    return grid;
}

RootGrid.Children.Add(AddBaseLayout());

public sealed partial class CustomControl : UserControl
{
    public CustomControl()
    {
        this.InitializeComponent();
    }

    public GridLength ColumnWidth
    {
        get { return (GridLength)GetValue(ColumnWidthProperty); }
        set { SetValue(ColumnWidthProperty, value); }
    }

    // Using a DependencyProperty as the backing store for ColumnWidth.  This enables animation, styling, binding, etc...
    public static readonly DependencyProperty ColumnWidthProperty =
        DependencyProperty.Register("ColumnWidth", typeof(GridLength), typeof(CustomControl), new PropertyMetadata(0));


}

Xaml

<Grid>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*" />
        <ColumnDefinition Width="{x:Bind ColumnWidth, Mode=OneWay}" />
    </Grid.ColumnDefinitions>
</Grid>

用法

<Grid x:Name="Test">
    <local:CustomControl ColumnWidth="400"/>
</Grid>