WPF - 慣行のベストプラクティス[ラベル：入力]コントロール

Question

よく知られているラベル入力[または出力、重要ではない]の組み合わせを取得するには、 WPFで。そのシンプルなタスクは、単に "オブジェクト" の迅速な出力を考えるME：

---

名 - クリスチャン

年齢 - 28

ムード - グッド

---

I知っている、私はTextBlocksとグリッドを使用することができます。しかし、正直言って、このための "短い" XAMLはページの半分近くです（各ラベルのRowDefinitions、ColDefs、Grid.Col）

もう1つの方法では、1つの縦に3つのStackPanels少し馬鹿。この場合、インデントが正しくなるように、各ラベルに固定幅を設定する必要があります。そして、それはちょうど "感じ"しません。

上記の状況を考慮すると、GUIに読み込み専用のプロパティを持つカスタムオブジェクトがあります（WPF、Silverlightでも、実際に気分:)。

私は、もちろん、このためのユーザーコントロールを書くことができます。しかし、なぜそれが既にあるかもしれない場合は...、

を車輪の再発明そして最後に、さらに私は実際の生活の中で作成した例を説明し、このポストのための理由だった：

 <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

3.5sp1を使用している場合は、バインディングでStringFormatを使用できます。このような何か動作するはずです...

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

Answer 2

おそらくあなたはあなたのUIを考え直すべきでしょう。なぜあなたはLabel - Textboxを同じ行にしたいのですか？それは恐ろしい空間の無駄です。

なぜラベルなし以上テックスボックス？そして、あなたは簡単なUI と簡単なXAML持っている：

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

をお使いのTextBlockのためのいくつかのスタイルを追加すると、非常に少ない繰り返しで、素敵な、きれいなUIを持っています。

Answer 3

まだユーザーコントロールに複雑さを引き出すことが可能でありながら、あなたは、2うまく-並んだ列の自動サイズ変更グリッドの動作を取得するために、共有サイズグループを使用することができます。

ここでは、探しているものを実行するLabeledEditコントロールを使用する例を示します。複雑さは、すべてのユーザーコントロールに離れ織り込まれており、すべてを行う必要があるのStackPanelにGrid.IsSharedSizeScopeを設定することを忘れないで：

<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> 

そして、ここでは、ユーザーコントロールのソースコードです。 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

silverlight toolkitはかなりクールな作品DataFormコントロールを持っています！