WPF – 托pipeUserControl内的内容

我正在尝试创build一个具有两行Grid的用户控件。 第一行是标题,第二行是用户控件之外定义的内容,例如我们的示例中的Button

不知何故,我没有得到它的工作。

UserControl1 xaml:

  <Grid Background="LightBlue"> <Grid.RowDefinitions> <RowDefinition Height="50" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <TextBlock Text="Title" FontSize="30" Margin="10,0,0,0"/> </Grid> 

MainWindow xaml:

  <Grid> <local:UserControl1> <Button>Click me</Button> </local:UserControl1> </Grid> 

下面的图片应该解释我的问题: 在这里输入图像说明

下面的代码

 <local:UserControl1> <Button>Click me</Button> </local:UserControl1> 

意味着您将UserControl1的Content属性设置为该button。 这个button只是取代了UserControls1的标记。 所以你在UserControl1.xaml中的所有东西都不存在了。

编辑

如果你想让你的用户控件拥有一些标记,那么你可以添加一个DependencyProperty ,比如:

  /// <summary> /// Gets or sets additional content for the UserControl /// </summary> public object AdditionalContent { get { return (object)GetValue(AdditionalContentProperty); } set { SetValue(AdditionalContentProperty, value); } } public static readonly DependencyProperty AdditionalContentProperty = DependencyProperty.Register("AdditionalContent", typeof(object), typeof(CalibrationPoint), new PropertyMetadata(null)); 

并添加一些元素到它的标记来承载额外的内容。 以下是扩展您提供的标记的示例:

 <UserControl ... Name="userControl"> <Grid Background="LightBlue"> <Grid.RowDefinitions> <RowDefinition Height="50" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <TextBlock Text="Title" FontSize="30" Margin="10,0,0,0"/> <ContentPresenter Content="{Binding AdditionalContent, ElementName=userControl}" /> </Grid> </UserControl> 

现在你可以使用它如下:

 <local:UserControl1> <local:UserControl1.AdditionalContent> <Button>Click me</Button> </local:UserControl1.AdditionalContent> </local:UserControl1> 

您必须设置ControlTemplate

 <UserControl> <UserControl.Resources> <Style TargetType="{x:Type local:UserControl1}"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type local:UserControl1}"> <Grid Background="LightBlue"> <Grid.RowDefinitions> <RowDefinition Height="50" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <TextBlock Grid.Row="0" Text="Title" FontSize="30" Margin="10,0,0,0"/> <ContentPresenter Grid.Row="1" /> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </UserControl.Resources> </UserControl> 

使用模板

<ContentControl />

而不是使用内容展示器

所以放置这个:

 <UserControl.Style> <Style TargetType="{x:Type UserControl}"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type UserControl}" > <Grid Background="LightBlue"> <Grid.RowDefinitions> <RowDefinition Height="50" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <TextBlock Text="Title" FontSize="30" Margin="10,0,0,0"/> <ContentControl Grid.Row="1" Content="{TemplateBinding Content}" /> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </UserControl.Style> 

到你的userControl

您可以模板用户控件添加像TextBlock其他视觉效果。

 <UserControl> <UserControl.Style> <Style TargetType="{x:Type UserControl}"> <Setter Property="Template"> <Setter.Value> <ControlTemplate> <Grid Background="LightBlue"> <Grid.RowDefinitions> <RowDefinition Height="50" /> <RowDefinition Height="*" /> </Grid.RowDefinitions> <TextBlock Text="Title" FontSize="30" Margin="10,0,0,0"/> <ContentPresenter Grid.Row="1" Content="{TemplateBinding Content}" /> </Grid> </ControlTemplate> </Setter.Value> </Setter> </Style> </UserControl.Style> <Button> Click me! </Button> </UserControl>