WPF - Mejores prácticas para el run-of-the-mill [Etiqueta: Entrada] Control

Question

Me pregunto, cuál es la mejor y más rápida forma de obtener la conocida combinación de entrada de etiqueta [o salida, no importa] en WPF. Es una tarea simple, basta pensar en una salida rápida del "objeto" ME:

---

Nombre - Christian

Edad - 28

Mood - Buena

---

I Sé que puedo usar una cuadrícula con TextBlocks. Pero para ser honesto, el XAML "corto" para esto tiene casi media página (RowDefinitions, ColDefs, Grid.Col en cada etiqueta)

La manera alternativa, usando tres StackPanels (horizontales) con una vertical parece también una un poco estúpido. En este caso, tengo que darle a cada etiqueta un ancho fijo, para que la sangría sea correcta. Y simplemente no "se siente" bien.

Así que, dada la situación anterior, tienes un objeto personalizado con 3-6 propiedades que solo quieres volcar como solo lectura en tu GUI, ¿cómo lo harías? (En WPF, Silverlight también, si realmente estás en el estado animico :).

Puedo, por supuesto, escribir un usercontrol para esto. Pero ¿por qué reinventar la rueda, si puede ser ya allí ...

Y, por último, para ilustrar aún más, el ejemplo que acaba de crear en la vida real y fue el motivo de este post:

 <StackPanel> 
     <StackPanel Orientation="Horizontal"> 
      <TextBlock Text="Log Count" Width="100"/> 
      <TextBlock Text="{Binding LastLogRun.LogMessageCount}"/> 
     </StackPanel> 
     <StackPanel Orientation="Horizontal"> 
      <TextBlock Text="Start Time" Width="100"/> 
      <TextBlock Text="{Binding LastLogRun.StartTime}"/> 
     </StackPanel> 
     <StackPanel Orientation="Horizontal"> 
      <TextBlock Text="End Time" Width="100"/> 
      <TextBlock Text="{Binding LastLogRun.EndTime}"/> 
     </StackPanel> 
    </StackPanel> 

Answer 1

Si está utilizando 3.5sp1 puede usar StringFormat en el enlace. Algo como esto debería funcionar ...

<TextBlock Text="{Binding LastLogRun.LogMessageCount, StringFormat={}Log Count - {0}}" /> 

Answer 2

Tal vez deberías reconsiderar tu UI. ¿Por qué querrías Label - Textbox en la misma línea? Eso es un terrible desperdicio de espacio.

¿Por qué no Etiqueta sobre texbox? Entonces usted tiene una interfaz de usuario sencilla y XAML simple:

<StackPanel Orientation="Vertical"> 
    <TextBlock>Name</TextBlock> 
    <TextBox /> 
    <TextBlock>Age</TextBlock> 
    <TextBox /> 
    <TextBlock>Mood</TextBlock> 
    <TextBox /> 
</StackPanel> 

Agregue un poco de estilo para sus TextBlocks y usted tiene un agradable, limpia interfaz de usuario, con muy poca repetición.

Answer 3

Usted podría utilizar grupos de tamaño compartidos para obtener el comportamiento de cuadrícula de tamaño automático de dos columnas muy bien alineados-up-, sin dejar de ser capaz de sacar la complejidad en un control de usuario .

Aquí hay un ejemplo del uso de un control LabeledEdit que haría lo que está buscando. La complejidad ha sido tomado en cuenta todos los lejos en el control de usuario, y todo lo que tiene que hacer es recordar para establecer Grid.IsSharedSizeScope en el StackPanel:

<Window x:Class="WpfApplication5.Window1" 
     xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
     xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
     xmlns:local="clr-namespace:WpfApplication5" 
     Name="Self" Title="Window1" Height="300" Width="300"> 
    <StackPanel Grid.IsSharedSizeScope="True"> 
     <local:LabeledEdit Label="Name"/> 
     <local:LabeledEdit Label="Age" Text="28"/> 
     <!-- and with databinding... --> 
     <local:LabeledEdit Label="Width" 
          Text="{Binding Width, ElementName=Self}"/> 
     <local:LabeledEdit Label="Height" 
          Text="{Binding Height, ElementName=Self}"/> 
    </StackPanel> 
</Window> 

Y aquí está el código fuente para el control de usuario. LabeledEdit.xaml:

<UserControl x:Class="WpfApplication5.LabeledEdit" 
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
      Name="Self"> 
    <Grid> 
     <Grid.ColumnDefinitions> 
      <ColumnDefinition Width="Auto" SharedSizeGroup="LabeledEdit_Labels"/> 
      <ColumnDefinition Width="*"/> 
     </Grid.ColumnDefinitions> 
     <Label Grid.Column="0" Content="{Binding Label, ElementName=Self}"/> 
     <TextBox Grid.Column="1" Text="{Binding Text, ElementName=Self}"/> 
    </Grid> 
</UserControl> 

LabeledEdit.xaml.CS:

using System.Windows; 

namespace WpfApplication5 
{ 
    public partial class LabeledEdit 
    { 
     public static readonly DependencyProperty LabelProperty = 
      DependencyProperty.Register("Label", typeof(object), typeof(LabeledEdit)); 
     public static readonly DependencyProperty TextProperty = 
      DependencyProperty.Register("Text", typeof(string), typeof(LabeledEdit), 
      new FrameworkPropertyMetadata("", FrameworkPropertyMetadataOptions.BindsTwoWayByDefault)); 

     public LabeledEdit() 
     { 
      InitializeComponent(); 
     } 

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

Answer 4

El silverlight toolkit tiene un control DataForm que funciona muy bien!