如何绑定用户控件子项的属性

Question

Let's say I have a usercontrol MyControl , which contains a TextBlock and a Button . If I want to separately control the font size & weight, text, height, etc. of both the button and the TextBlock and the Button , I could create DependencyProperties for all this and bind it:

<UserControl xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             x:Class="ns.MyControl"
             DataContext={Binding RelativeSource={RelativeSource self}}>
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="Auto"/>
        </Grid.ColumnDefinitions>
        <TextBlock Text={Binding BlockText} Height={Binding BlockHeight}
                   FontWeight={Binding BlockFontWeight} FontSize={Binding BlockFontSize} />
        <Button Grid.Column="1" Text={Binding ButtonText} Height={Binding ButtonHeight}
                FontWeight={Binding ButtonFontWeight} FontSize={Binding ButtonFontSize} />
    </Grid>
</UserControl>

namespace ns {
    class MyControl : UserControl {
        private static readonly DependencyProperty BlockTextProperty = DependencyProperty.Register(
            "BlockText", typeof(string), typeof(MyControl));
        internal string BlockText {
            get { return (string)GetValue(BlockTextProperty); }
            set { SetValue(BlockTextProperty, value); }
        }
        ...
        private static readonly DependencyProperty ButtonFontSizeProperty= DependencyProperty.Register(
            "ButtonFontSizeProperty", typeof(string), typeof(MyControl));
        internal string ButtonFontSizeProperty{
            get { return (string)GetValue(ButtonFontSizeProperty); }
            set { SetValue(ButtonFontSizeProperty, value); }
        }

        public MyControl() {
            InitializeComponent();
        }
    }
}

However, this will quickly become very tedious, and I doubt it'd perform optimally. Rather, I'd like to directly refer to the children of my usercontrol and set their properties directly, something like this:

<MyControl Block.Text="Foo" Block.FontWeight="Bold" Block.FontSize="16" Button.Height="40" />

I have read a bit about attached properties, but don't really understand how:

1. I could attach these to already existing controls such as TextBlock and Button , do I need to extend them?
2. How I would go about binding these and setting their default values inside MyControl .

I'd very much appreciate if someone can give me an example, or a nudge in the right direction.

Answer 1

You may declare default Styles in the Resources of the UserControl:

<local:MyControl>
    <local:MyControl.Resources>
        <Style TargetType="TextBlock">
            <Setter Property="FontSize" Value="16"/>
            <Setter Property="FontWeight" Value="Bold"/>
            <Setter Property="Text" Value="Foo"/>
        </Style>
        <Style TargetType="Button">
            <Setter Property="Height" Value="40"/>
        </Style>
    </local:MyControl.Resources>
</local:MyControl>

You may even declare those child element Style resources in another Style for the control:

<Window.Resources>
    <Style TargetType="local:MyControl">
        <Style.Resources>
            <Style TargetType="TextBlock">
                <Setter Property="FontSize" Value="16"/>
                <Setter Property="FontWeight" Value="Bold"/>
                <Setter Property="Text" Value="Foo"/>
            </Style>
            <Style TargetType="Button">
                <Setter Property="Height" Value="40"/>
            </Style>
        </Style.Resources>
    </Style>
</Window.Resources>
<Grid>
    <local:MyControl/>
</Grid>

---

As a note, you should not set the UserControl's DataContext to itself. Any DataContext based Bindings of the control's properties like

<local:MyControl FontSize="{Binding Something}">

would not work.