作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我是 Windows 开发的新手。我正在制作一个简单的 Windows 应用程序,它有几个页面,每个页面在 XAML 中都有类似的布局。像这样:
每页分为 3 个部分。 A 将有一个标题,B 是插入内容的位置,C 是其他内容。我的问题是:构建通用布局模板以便我可以为每个页面重用它的最简单方法是什么?这可能吗?
例如,我有一个具有以下布局的 MainTemplate.xaml 文件:
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
</Grid>
最佳答案
一种可行的方法是使用 UserControl
与 ContentPresenter
.例如:
添加 UserControl
命名为 MainTemplate
.在 XAML 中,使用 ContentPresenter
设置布局并将其绑定(bind)到 DependencyProperty
在代码隐藏中定义。
<UserControl x:Class="UWPTest.MainTemplate"
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:local="using:UWPTest"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
d:DesignHeight="300"
d:DesignWidth="400"
mc:Ignorable="d">
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<ContentPresenter Content="{x:Bind Title}" />
<ContentPresenter Grid.Row="1" Content="{x:Bind Main}" />
<ContentPresenter Grid.Row="2" Content="{x:Bind Stuff}" />
</Grid>
</UserControl>
DependencyProperty
以便我们可以使用它们来设置其他页面中的内容。
public sealed partial class MainTemplate : UserControl
{
public MainTemplate()
{
this.InitializeComponent();
}
public static readonly DependencyProperty TitleProperty = DependencyProperty.Register("Title", typeof(object), typeof(MainTemplate), new PropertyMetadata(null));
public object Title
{
get { return GetValue(TitleProperty); }
set { SetValue(TitleProperty, value); }
}
public static readonly DependencyProperty MainProperty = DependencyProperty.Register("Main", typeof(object), typeof(MainTemplate), new PropertyMetadata(null));
public object Main
{
get { return GetValue(MainProperty); }
set { SetValue(MainProperty, value); }
}
public static readonly DependencyProperty StuffProperty = DependencyProperty.Register("Stuff", typeof(object), typeof(MainTemplate), new PropertyMetadata(null));
public object Stuff
{
get { return GetValue(StuffProperty); }
set { SetValue(StuffProperty, value); }
}
}
UserControl
在其他页面中重用总体布局。例如,在“MainPage.xaml”中使用它:
<Page x:Class="UWPTest.MainPage"
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:local="using:UWPTest"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<local:MainTemplate>
<local:MainTemplate.Title>
<Grid Background="Red">
<TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="60">A</TextBlock>
</Grid>
</local:MainTemplate.Title>
<local:MainTemplate.Main>
<Grid Background="Green">
<TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="60">B</TextBlock>
</Grid>
</local:MainTemplate.Main>
<local:MainTemplate.Stuff>
<Grid Background="Yellow">
<TextBlock HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="60">C</TextBlock>
</Grid>
</local:MainTemplate.Stuff>
</local:MainTemplate>
</Page>
关于xaml - 如何在 XAML 中创建主布局模板,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34193938/
我是一名优秀的程序员,十分优秀!