Как снова использовать разметки в WPF

Я пытаюсь создать приложение, которое будет снабжено вкладками, где каждая вкладка будет иметь область кнопки и область представления.

Теперь каждая вкладка будет по существу иметь то же расположение просто разными вещами в расположении, и я хотел смочь снова использовать то же расположение так, чтобы я не должен был изменяться во многих местах (это - просто не хорошее программирование). Я могу выполнить это использование ресурсы или возможно Стили.

Предоставьте пример оптического кода, если это возможно.

Править: Я решил добавить пример того, что я пытаюсь сделать, потому что я все еще не получаю его.

Под каждым TabItem я пытаюсь воссоздать эту сетку (Это немного более сложно, но Вы получаете идею):

<Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="200"/>
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>

        <Border Margin="10"
                            BorderBrush="{StaticResource MediumColorBrush}"
                            CornerRadius="10"
                            BorderThickness="2"
                            Grid.Row="0">

               <!-- First content goes here -->

        </Border>

        <Border Margin="10"
                            BorderBrush="{StaticResource MediumColorBrush}"
                            CornerRadius="10"
                            BorderThickness="2"
                            Grid.Row="1">

               <!-- Second content goes here -->

        </Border>

    </Grid>

поскольку Вы видите, что также 2 границы являются тем же. Теперь я должен поместить некоторого заполнителя содержания, где мои комментарии. Я wan't для объявления этого расположения Сетки в словаре ресурса и затем где я использую помещенное отдельное содержание в каждую границу.

У меня может быть много TabItems, настолько повторяющихся, что этот код не является хорошей идеей, и каждая Вкладка будет иметь различное содержание в этих 2 заполнителях.

Я могу использовать

<ContentPresenter Content="{Binding}" />

вещь, но только для 1 содержания, что происходит, когда будет больше.

7
задан Dave Clemmer 16 August 2011 в 16:09
поделиться

2 ответа

Инго,

Код всегда доступен в MSDN. Проверьте это: UserControl , Пользовательские элементы управления , DataTemplates .

Вот несколько примеров каждого подхода. Для простоты предположим, что макет, который вы хотите воспроизвести, представляет собой одну строку текста с зеленым передним планом (на самом деле это может быть совсем другое, но вы поняли идею).


1. Пользовательский элемент управления

Xaml:

<UserControl x:Class="WpfApplication1.GreenTextUserControl"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
  <TextBlock x:Name="txt" Foreground="Green"/>
</UserControl>

C #:

using System.Windows.Controls;

namespace WpfApplication1
{
  public partial class GreenTextUserControl : UserControl
  {
    public string Text
    {
      get { return txt.Text;}
      set { txt.Text = value; }
    }

    public GreenTextUserControl()
    {
      InitializeComponent();
    }
  }
}

Вкладка :

<TabControl>
  <TabItem Header="Tab 1">
    <loc:GreenTextUserControl Text="This is Tab 1"/>
  </TabItem>
  <TabItem Header="Tab 2">
    <loc:GreenTextUserControl Text="This is Tab 2"/>
  </TabItem>
  <TabItem Header="Tab 3">
    <loc:GreenTextUserControl Text="This is Tab 3"/>
  </TabItem>
</TabControl>

2. Пользовательский элемент управления

C #:

  public class GreenTextBlock : TextBlock
  {
    public GreenTextBlock()
    {
      Foreground = Brushes.Green;
    }
  }

TabControl:

<TabControl>
  <TabItem Header="Tab 1">
    <loc:GreenTextBlock Text="This is Tab 1"/>
  </TabItem>
  <TabItem Header="Tab 2">
    <loc:GreenTextBlock Text="This is Tab 2"/>
  </TabItem>
  <TabItem Header="Tab 3">
    <loc:GreenTextBlock Text="This is Tab 3"/>
  </TabItem>
</TabControl>

Если ваш макет сложнее текстового блока, пользовательские элементы управления также позволяют вам определять его в XAML, но он отличается от UserControls.


3. DataTemplate

<Window x:Class="WpfApplication1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
        xmlns:System="clr-namespace:System;assembly=mscorlib" 
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
    <x:Array x:Key="GreenText" Type="{x:Type System:String}">
      <System:String>This is Tab 1</System:String>
      <System:String>This is Tab 2</System:String>
      <System:String>This is Tab 3</System:String>
    </x:Array>

    <!--Tab item content data template-->
    <DataTemplate x:Key="GreenTextTemplate">
      <TextBlock Text="{Binding}" Foreground="Green"/>
    </DataTemplate>
  </Window.Resources>
    <Grid>
    <TabControl ItemsSource="{StaticResource GreenText}">
      <TabControl.ItemContainerStyle>
        <Style TargetType="{x:Type TabItem}">
          <Setter Property="ContentTemplate" Value="{StaticResource GreenTextTemplate}"/>
        </Style>
      </TabControl.ItemContainerStyle>
    </TabControl>
  </Grid>
</Window>

Вот и все :). Надеюсь, это поможет.

2
ответ дан 7 December 2019 в 12:15
поделиться

TabItem - это ContentControl, который позволяет любое дочернее содержимое, но также позволяет шаблонизировать содержимое, а это именно то, что вы пытаетесь сделать. Вы можете использовать подобный DataTemplate для создания общего макета. ContentPresenter - это вместилище для различного содержимого каждого TabItem.

<DataTemplate x:Key="ButtonViewerTemplate">
    <DockPanel>
        <Button DockPanel.Dock="Bottom" Content="OK"/>
        <Button DockPanel.Dock="Bottom" Content="Cancel"/>
        <Border Background="Aqua" BorderBrush="Red" BorderThickness="2" Padding="5">
            <ContentPresenter Content="{Binding}" />
        </Border>
    </DockPanel>
</DataTemplate>

Чтобы использовать шаблон, просто установите его в ContentTemplate каждого TabItem. Это работает со всем, что происходит от ContentControl.

<TabControl>
    <TabItem ContentTemplate="{StaticResource ButtonViewerTemplate}" Header="Some Buttons">
        <UniformGrid>
            <Button Content="XXXXX"/>
            <Button Content="XXXXX"/>
            <Button Content="XXXXX"/>
            <Button Content="XXXXX"/>
        </UniformGrid>
    </TabItem>
    <TabItem ContentTemplate="{StaticResource ButtonViewerTemplate}" Header="All Blue">
        <Border Background="Blue" MinHeight="50"/>
    </TabItem>
    <TabItem ContentTemplate="{StaticResource ButtonViewerTemplate}" Header="Image">
        <Image Source="http://i.msdn.microsoft.com/Platform/Controls/StoMastheadMSDN/resources/logo_msdn.png"/>
    </TabItem>
</TabControl>
3
ответ дан 7 December 2019 в 12:15
поделиться
Другие вопросы по тегам:

Похожие вопросы: