Question

在此先感谢您的支持！我正在尝试创建一个自定义选项卡项，以充当动态创建UI元素的画布。这是一张有关此自定义控件中所需内容的图片： TabItem Template

我需要能够以父级形式动态地向TabControl生成Tab项-问题是我的代码似乎对TabItem无任何作用-它始终是空白，并且不会抱怨我的代码。缺少了什么？感谢您的帮助！

我的WPF用户控件标签代码：

Private Sub Recover_Click(sender As Object, e As EventArgs) Handles Recover.Click
        Dim connString As String = ConfigurationManager.ConnectionStrings("dbx").ConnectionString
        Using conn As New SqlConnection(connString)
            Dim command As New SqlCommand("UPDATE [EmmeSubic].[dbo].[UserDetails] SET isDeleted = NULL where isDeleted = 1", conn)
            ' command.Parameters.Add("@user_id", SqlDbType.Int).Value = Driverlist.tbxUser_id.Text
            conn.Open()
            If MessageBox.Show("Are you sure you want to recover?", "Information", MessageBoxButtons.YesNo, MessageBoxIcon.Information) = DialogResult.Yes Then
                command.ExecuteNonQuery()
                For Each row As DataGridViewRow In DeletedUserTable.SelectedRows
                    DeletedUserTable.Rows.Remove(row)
                Next
                MessageBox.Show("The User is successfully Recovered!", "Information", MessageBoxButtons.OK, MessageBoxIcon.Information)
                conn.Close()
            End If
        End Using
    End Sub

设计师： Tab Item

Answer 1

在WPF中，如果要动态创建控件，则必须始终使用模板。 TabControl是ItemsControl。 TabItem集合中的每个项目都会自动生成ItemsControl.ItemsSource元素（选项卡）。可以使用样式和模板来设计TabItem的外观。
使用TabControl.ContentTemplate属性为每个标签的内容指定DataTemplate

首先，您必须创建应在TabItem内部显示的数据模型。

TabData.cs：

public class TabData : INotifyPropertyChanged
{
  public TabData(string header)
  {
    this.Header = header;
  }

  public string Header { get; set; }

  private string serverAddress;
  public string ServerAddress
  {
    get => this.serverAddress;
    set
    {
      if (value == this.serverAddress) return;
      this.serverAddress = value;
      OnPropertyChanged();
    }
  }

  private string username;
  public string Username
  {
    get => this.username;
    set
    {
      if (value == this.username) return;
      this.username = value;
      OnPropertyChanged();
    }
  }

  private string password;
  public string Password
  {
    get => this.password;
    set
    {
      if (value == this.password) return;
      this.password = value;
      OnPropertyChanged();
    }
  }

  public event PropertyChangedEventHandler PropertyChanged;    
  protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
  {
    this.PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
  }
}

然后创建一个视图模型，该模型处理选项卡数据并公开TabControl的项目源。
视图模型是DataContext中的TabControl。

ViewModel.cs

public class ViewModel: INotifyPropertyChanged
{
  public ViewModel()
  {
    this.TabDatas = new ObservableCollection<TabData>()
    {
      new TabData("First Tab"),
      new TabData("Second Tab"),
      new TabData("Third Tab")
    };
  }

  // Adding a new TabData item to the TabDatas collection 
  // will dynamically create a new TabItem inside the TabControl
  public void AddNewTab()
  {
    this.TabDatas.Add(new TabData("Fourth Tab"));
  }


  public ObservableCollection<TabData> TabDatas { get; set; }

  public event PropertyChangedEventHandler PropertyChanged;    
  protected virtual void OnPropertyChanged([CallerMemberName] string propertyName = null)
  {
    this.PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
  }
}

AddNewTab可以从ICommand（例如单击按钮）或某些事件（例如可用的新数据）中调用。

MainWindow.xaml：

<Window>
  <Window.DataContext>
    <ViewModel />
  </Window.DataContext>

  <Grid>

    <!-- Use DisplayMemberPath property to set the source property for the tab header -->
    <TabControl x:Name="TabControl" 
                ItemsSource="{Binding TabDatas}" 
                DisplayMemberPath="Header" >

      <!-- Use a DataTemplate to design the visual appearance of the TabItem content -->
      <TabControl.ContentTemplate>
        <DataTemplate DataType="TabData">
          <StackPanel>
            <Grid>
              <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
              </Grid.ColumnDefinitions>
              <GroupBox Header="Git Repo Credentials:">
                <StackPanel>
                  <Grid>
                    <Grid.ColumnDefinitions>
                      <ColumnDefinition Width="*" />
                      <ColumnDefinition Width="3*" />
                    </Grid.ColumnDefinitions>
                    <Label Grid.Column="0"
                           Content="Server Address:" />
                    <TextBox Grid.Column="1"
                             Margin="2" 
                             Text="{Binding ServerAddress}" />
                  </Grid>
                  <Grid>
                    <Grid.ColumnDefinitions>
                      <ColumnDefinition Width="*" />
                      <ColumnDefinition Width="3*" />
                    </Grid.ColumnDefinitions>
                    <Label Grid.Column="0"
                           Content="Username:" />
                    <TextBox Grid.Column="1"
                             Margin="2"
                             Text="{Binding Username}"/>
                  </Grid>
                  <Grid>
                    <Grid.ColumnDefinitions>
                      <ColumnDefinition Width="*" />
                      <ColumnDefinition Width="3*" />
                    </Grid.ColumnDefinitions>
                    <Label Grid.Column="0"
                           Content="Password:" />
                    <TextBox Grid.Column="1"
                             Margin="2"
                             Text="{Binding Password}"/>
                  </Grid>
                  <Grid>
                    <Grid.ColumnDefinitions>
                      <ColumnDefinition Width="*" />
                      <ColumnDefinition Width="2*" />
                      <ColumnDefinition Width="*" />
                    </Grid.ColumnDefinitions>
                    <CheckBox x:Name="CheckBoxStoreCredentials"
                              Content="Store Credentials"
                              Grid.Column="0"
                              IsChecked="False"
                              VerticalAlignment="Center" />
                    <Button x:Name="ButtonDownloadConfiguration"
                            Content="Download Configuration"
                            Grid.Column="2"
                            Margin="5" />
                  </Grid>
                </StackPanel>
              </GroupBox>
            </Grid>
          </StackPanel>
        </DataTemplate>
      </TabControl.ContentTemplate>
    </TabControl>
  </Grid>
</Window>

如何创建WPF用户控件：自定义TabItem？

1 个答案: