2011-05-22 68 views
4

在WPF中使用TextBox顯示文本標籤(例如「Name」)的最佳做法是什麼? 我想要一個標籤「名稱」上方的文本框和許多類似的標籤/文本框。 我應該把Label/TextBox放到垂直的StackPanel中嗎?WPF Label to TextBox

有沒有更簡單的解決方案?

回答

9

這真的取決於你希望在將來這些控件做什麼。如果你想多次重複使用這種控件(也許可以實時創建它),那麼最好創建UserControl並對其進行編程。然後,您可以以非常簡單的方式輕鬆地重用它(例如放入StackPanel中)。

代碼LabelTextBox.xaml

<UserControl x:Class="YourProject.LabelTextBox" 
      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="49" d:DesignWidth="314" MinHeight="49" MaxHeight="49"> 
    <Grid> 
     <Label Content="Label" Height="28" HorizontalAlignment="Left" Name="BaseLabel" VerticalAlignment="Top" /> 
     <TextBox Height="23" Margin="0,26,0,0" Name="BaseTextBox" VerticalAlignment="Top" /> 
    </Grid> 
</UserControl> 

代碼LabelTextBox.xaml.cs

using System; 
using System.Collections.Generic; 
using System.Linq; 
using System.Text; 
using System.Windows; 
using System.Windows.Controls; 
using System.Windows.Data; 
using System.Windows.Documents; 
using System.Windows.Input; 
using System.Windows.Media; 
using System.Windows.Media.Imaging; 
using System.Windows.Navigation; 
using System.Windows.Shapes; 

namespace YourProject 
{ 
    /// <summary> 
    /// Interaction logic for LabelTextBox.xaml 
    /// </summary> 
    public partial class LabelTextBox : UserControl 
    { 
     public LabelTextBox() 
     { 
      InitializeComponent(); 
     } 



     string LocalLabel = ""; 
     string LocalTextBox = ""; 

     public string Label 
     { 
      get { return LocalLabel; } 
      set 
      { 
       LocalLabel = value; 
       BaseLabel.Content = value; 
      } 
     } 

     public string TextBox 
     { 
      get { return LocalTextBox; } 
      set 
      { 
       LocalTextBox = value; 
       BaseTextBox.Text = value; 
      } 
     } 
    } 
} 

您可以更改標籤文本和文本框的內容與新的控制(隱藏在標籤和文本框屬性「其他「屬性的一部分,您也可以爲UserControl編寫其他功能

如果您不需要重複使用這些控件,用法就足夠了。

+1

這不支持綁定 – 2014-06-25 14:38:41

0

創建一個包含實現INotifyPropertyChanged的標籤和文本的類X.創建一個ObservableCollection。這將是ListBox,ComboBox,StackPanel的ItemsSource ..無論你選擇什麼。創建一個DataTemplate,以您希望的方式顯示X.

2

如果您希望能夠靈活地操作此文本標籤結構,我建議將每個TextBox和Label包裝在停靠面板中,並將對接設置爲適用於所有標籤和文本框的樣式。

所以它會像

<StackPanel> 
    <StackPanel.Resources> 
    <Style TargetType={x:Type Label}> 
     <Setter Property="DockPanel.Dock" Value="Top"/> 
    </Style> 
    </StackPanel.Resources> 

    <DockPanel> 
    <Label></Label> 
    <TextBox></TextBox> 
    </DockPanel> 
    <DockPanel> 
    <Label></Label> 
    <TextBox></TextBox> 
    </DockPanel> 

</StackPanel> 
1

我平時做這樣的事情:

<StackPanel> 
      <Grid> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition Width="Auto"></ColumnDefinition> 
        <ColumnDefinition Width="*"></ColumnDefinition> 
       </Grid.ColumnDefinitions> 
       <Label Margin="5">Repository URL:</Label> 
       <TextBox Grid.Column="1" Margin="5"></TextBox> 
      </Grid> 
</StackPanel> 

如果你這樣做往往不夠,你可以創建一個用戶控件或DataTemplate中。但是,WPF只是一個詳細的標記語言...

7

這裏是做它的控制:

using System.Windows; 
using System.Windows.Controls; 
using System.Windows.Data; 

public class KeyValueControl : Control 
{ 
    public static readonly DependencyProperty KeyProperty = DependencyProperty.Register(
     "Key", 
     typeof(string), 
     typeof(KeyValueControl), 
     new PropertyMetadata(default(string))); 

    public static readonly DependencyProperty ValueProperty = DependencyProperty.Register(
     "Value", 
     typeof(object), 
     typeof(KeyValueControl), 
     new FrameworkPropertyMetadata 
     { 
      DefaultValue = null, 
      BindsTwoWayByDefault = true, 
      DefaultUpdateSourceTrigger = UpdateSourceTrigger.PropertyChanged, 
     }); 

    static KeyValueControl() 
    { 
     DefaultStyleKeyProperty.OverrideMetadata(typeof(KeyValueControl), new FrameworkPropertyMetadata(typeof(KeyValueControl))); 
    } 

    public string Key 
    { 
     get 
     { 
      return (string)GetValue(KeyProperty); 
     } 
     set 
     { 
      SetValue(KeyProperty, value); 
     } 
    } 

    public object Value 
    { 
     get 
     { 
      return GetValue(ValueProperty); 
     } 
     set 
     { 
      SetValue(ValueProperty, value); 
     } 
    } 
} 

風格:

<Style TargetType="{x:Type local:KeyValueControl}"> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type local:KeyValueControl}"> 
       <Grid> 
        <Grid.ColumnDefinitions> 
         <ColumnDefinition Width="100"/> 
         <ColumnDefinition/> 
        </Grid.ColumnDefinitions> 
        <TextBlock Text="{Binding Key, RelativeSource={RelativeSource TemplatedParent}}"/> 
        <TextBox Grid.Column="1" Text="{Binding Value, RelativeSource={RelativeSource TemplatedParent}, UpdateSourceTrigger=PropertyChanged}"/> 
       </Grid> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

使用(創建一個屬性網格):

<ItemsControl> 
    <customControls:KeyValueControl Key="First" Value="{Binding Value1}" /> 
    <customControls:KeyValueControl Key="Second" Value="{Binding Value2}" /> 
    <customControls:KeyValueControl Key="Last" Value="{Binding Value3}" /> 
    <customControls:KeyValueControl Key="Bool1" Value="{Binding Bool1}" Style="{StaticResource CheckBoxStyle}"/> 
    <customControls:KeyValueControl Key="Bool2" Value="{Binding Bool2}" Style="{StaticResource CheckBoxStyle}"/> 
</ItemsControl> 
+0

這看起來不錯。那個風格街區去哪裏? – Mac 2018-03-06 05:18:27

+0

如果它是一個控件庫,將它放在Themes/Generic.xaml中。 – 2018-03-06 07:03:18