WPF - 最佳實踐[標籤：輸入]控制

Question

我在想，這是獲得衆所周知的標籤輸入[或輸出，無所謂]組合的最佳和最快捷的方式在WPF中。它是一種簡單的任務，只是覺得 「對象」 的快速輸出的ME：

---

名稱 - 基督教

年齡 - 28

情緒 - 好

---

我知道，我可以在TextBlocks中使用Grid。但說實話，這個「short」XAML差不多長達半頁（RowDefinitions，ColDefs，Grid.Col on each Label）

另一種方式，使用三個StackPanels（水平）和一個垂直似乎也是一個有點愚蠢。在這種情況下，我必須給每個標籤固定寬度，以使縮進正確。它只是不「感覺」正確。因此，考慮到上面的情況，你得到一個自定義對象，你只需要將其轉儲爲只讀到您的GUI的3-6個屬性，那麼您將如何執行它（在WPF中，Silverlight也是如此，如果您真的在心情:)。

我當然可以爲此編寫一個usercontrol。但是，爲什麼推倒重來，如果它可能已經在那裏...

最後，甚至進一步說明，我只是在現實生活中產生的例子，是這個職位的原因：

 <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

也許你應該重新考慮你的用戶界面。爲什麼你想要標籤 - 文本框在同一行？這是一個可怕的浪費空間。

爲什麼不標籤超過 texbox？那麼你已經有了一個簡單的用戶界面和簡單XAML：

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

添加一些造型爲你的TextBlocks，你已經有了一個不錯的，乾淨的UI，很少重複。

Answer 3

你可以使用共享的大小團體獲得兩個很好的內襯向上列的自動調整大小格的行爲，同時仍然能夠在複雜拉出到用戶控件。

下面是一個使用LabeledEdit控件的例子，它可以做你正在尋找的東西。複雜性已經全部分解消失在用戶控件，所有你需要做的就是記住設置Grid.IsSharedSizeScope上的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> 

下面是爲用戶控件的源代碼。 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控制的作品很酷！