C# XAML nested controls/components

Date: 2021-01-28
<UserControl x:Class="Views.Controls.FieldLabel"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             mc:Ignorable="d" 
             d:DesignHeight="450" d:DesignWidth="800" x:Name="Control" VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
    <Grid VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="50*" />
            <ColumnDefinition Width="50*" />
        </Grid.ColumnDefinitions>
        <StackPanel Grid.Column="0" Margin="0 5">
            <Label Content="{Binding Label, ElementName=Control}" FontWeight="Bold"/>
        </StackPanel>
        <StackPanel Grid.Column="1" Margin="0 5">
            <ContentPresenter Content="{Binding Editor, ElementName=Control}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
        </StackPanel>
    </Grid>
</UserControl>
using System.Windows;
using System.Windows.Controls;

namespace Views.Controls
{
    public partial class FieldLabel : UserControl
    {
        public static readonly DependencyProperty LabelProperty = DependencyProperty.Register(nameof(Label), typeof(string), typeof(FieldLabel), new PropertyMetadata(null));
        public string Label
        {
            get => (string)GetValue(LabelProperty);
            set => SetValue(LabelProperty, value);
        }

        public static readonly DependencyProperty EditorProperty = DependencyProperty.Register(nameof(Editor), typeof(Control), typeof(FieldLabel), new PropertyMetadata((Control)null));
        public Control Editor
        {
            get => (Control)GetValue(EditorProperty);
            set => SetValue(EditorProperty, value);
        }

        public FieldLabel()
        {
            InitializeComponent();
        }
    }
}

Usage

<!-- xmlns:controls="clr-namespace:Views.Controls" -->
<ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
    <StackPanel Margin="15" Orientation="Vertical">
        <controls:FieldLabel Label="MyCombobox">
            <controls:FieldLabel.Editor>
                <ComboBox>
                    <ComboBoxItem>Test 1</ComboBoxItem>
                    <ComboBoxItem>Test 2</ComboBoxItem>
                    <ComboBoxItem>Test 3</ComboBoxItem>
                </ComboBox>
            </controls:FieldLabel.Editor>
        </controls:FieldLabel>
        <controls:FieldLabel Label="MyTextbox">
            <controls:FieldLabel.Editor>
                <TextBox Text="MyValue" />
            </controls:FieldLabel.Editor>
        </controls:FieldLabel>
        <controls:FieldLabel Label="MyDatePicker">
            <controls:FieldLabel.Editor>
                <DatePicker />
            </controls:FieldLabel.Editor>
        </controls:FieldLabel>
    </StackPanel>
</ScrollViewer>

45470cookie-checkC# XAML nested controls/components