Создание элемента пользовательского интерфейса в WPF

Question

У меня есть несколько TextBoxes с в моем коде Labels, которые реализуются с помощью следующей XAML:

<DockPanel HorizontalAlignment="Right"> 
    <TextBlock Foreground="Black" Padding="0,0,10,0">Serial Number:</TextBlock> 
    <TextBox Width="150" IsReadOnly="True" BorderBrush="Gainsboro" Height="20"></TextBox> 
</DockPanel> 

я могу уменьшить некоторые из скопированного кода, делая что-то вроде:

<DockPanel HorizontalAlignment="Right"> 
    <TextBlock Style="{StaticResource CstmTextBoxLbl}">Serial Number:</TextBlock> 
    <TextBox Style="{StaticResource CstmTextBox}"></TextBox> 
</DockPanel> 

но все еще несколько длительный. Можно ли сделать что-то вроде:

<controls:CstmTextBox Style="{StaticResource CstmTextBox}" LabelText="Serial Number:" Text=""/> 

Если CstmTextBox будет осуществлять все, что XAML требуется, чтобы получить тот же визуальный эффект один раз, и я мог бы получить доступ как TextBlock текста и TextBox текста в коде. Такие как

CstmTextBox textbox; 
textbox.LabelText = "Serial Number:"; 
String some_text = textbox.Text; 

textbox.Text = "...."; 

Answer 1

Пользовательский контроль или пользовательский контроль обслуживают ваши потребности. Это код для CustomControl.

C#:

public class CstmTextBox : Control 
{ 
    public string LabelText 
    { 
     get 
     { 
      return (string)GetValue (LabelTextProperty); 
     } 
     set 
     { 
      SetValue (LabelTextProperty, value); 
     } 
    } 

    public static readonly DependencyProperty LabelTextProperty = 
     DependencyProperty.Register ("LabelText", typeof (string), typeof (CstmTextBox), new PropertyMetadata (string.Empty)); 

    public string Text 
    { 
     get 
     { 
      return (string)GetValue (TextProperty); 
     } 
     set 
     { 
      SetValue (TextProperty, value); 
     } 
    } 

    public static readonly DependencyProperty TextProperty = 
     DependencyProperty.Register ("Text", typeof (string), typeof (CstmTextBox), new PropertyMetadata (string.Empty)); 
} 

XAML:

<Style TargetType="{x:Type controls:CstmTextBox}"> 
     <Setter Property="Template"> 
      <Setter.Value> 
       <ControlTemplate TargetType="{x:Type controls:CstmTextBox}"> 
        <DockPanel HorizontalAlignment="Right"> 
         <TextBlock Foreground="Black" Padding="0,0,10,0" Text="{TemplateBinding LabelText}"/> 
         <TextBox Width="150" IsReadOnly="True" BorderBrush="Gainsboro" Height="20" Text="{TemplateBinding Text}"/> 
        </DockPanel> 
       </ControlTemplate> 
      </Setter.Value> 
     </Setter> 
    </Style> 

Добавьте стиль в свои ресурсы и использовать новый элемент управления:

<controls:CstmTextBox LabelText="abcde" Text="1234"/> 

Answer 2

Добавить UserControl к вашему решению, и скопировать XAML, который вы хотите повторно использовать внутри.

Если установить x:Name к элементам управления внутри вашего UserControl ...

<UserControl ... > 
    <DockPanel HorizontalAlignment="Right"> 
     <TextBlock x:Name="SerialNumberTextBlock" Style="{StaticResource CstmTextBoxLbl}">Serial Number:</TextBlock> 
     <TextBox x:Name="SerialNumberTextBox" Style="{StaticResource CstmTextBox}"></TextBox> 
    </DockPanel> 
</UserControl> 

... вы будете иметь возможность получить доступ к ним из-за пределов (код-сзади), как это:

CstmTextBox textbox; 
textbox.SerialNumberTextBlock.Text = "Serial Number:"; 
String some_text = textbox.SerialNumberTextBox.Text; 

textbox.SerialNumberTextBox.Text = "...."; 

Но это даже лучше, если вы создаете DependencyProperties для свойств, которые вы хотите открыть. Необходимо определить эти свойства в коде-позади вашего UserControl:

public string Text 
{ 
    get 
    { 
     return (string)GetValue(TextProperty); 
    } 
    set 
    { 
     SetValue (TextProperty, value); 
    } 
} 

public static readonly DependencyProperty TextProperty = 
    DependencyProperty.Register("Text", typeof(string), typeof (CstmTextBox)); 

Затем связать эти свойства элементов управления внутри вашего UserControl:

<UserControl x:Name="Root" ... > 
    <DockPanel HorizontalAlignment="Right"> 
     <TextBlock x:Name="SerialNumberTextBlock" Style="{StaticResource CstmTextBoxLbl}" 
        Text="{Binding LabelText, ElementName=Root}" /> 
     <TextBox x:Name="SerialNumberTextBox" Style="{StaticResource CstmTextBox}" 
       Text="{Binding Text, ElementName=Root, Mode=TwoWay}" /> 
    </DockPanel> 
</UserControl> 

Таким образом, вы можете установить свойства непосредственно снаружи , будь то код-код, XAML или Binding.