WPF对此要求的控制或方法是什么?

时间:2010-09-26 07:18:27

标签: c# .net wpf tabcontrol

刚刚成为WPF的新手我不确定对于WPF应用程序来说,哪种控制或方法最适合此要求。

  • 我想提供一个信息摘要表,但用户应该可以根据以下任一方式查看信息:“所有时间”,月,周或日。
  • 我希望在视觉上让选项显示在本节顶部并让它显示为TabControl
  • 我不确定TabControl是否是重复每个Tab Item的表格的最佳选择
  • 因此整体功能上可以使用的只是顶部的单选按钮,但我想要的是一个TabControl外观

实现TabControl外观的最佳方法是什么,但是使用编程方法,我不必在每个Tab项中重复这些内容?

例如,我是否会使用TabControl然后使用WPF模板在每个Tab项中执行相当于包含但具有不同输入参数的包含? (之前没有使用过WPF模板)

由于

3 个答案:

答案 0 :(得分:7)

由于您需要一组RadioButton的行为而您希望TabItem的视觉外观,您应该使用RadioButton控件并设置它们的样式,使它们看起来像{ {1}}控件。这是一个非常简单的例子:

alt text

TabItem

在此示例中,<Window x:Class="TabTest.Window1" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Title="Window1" Height="300" Width="300"> <Window.Resources> <Style TargetType="{x:Type RadioButton}"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="{x:Type RadioButton}"> <Border x:Name="tabBorder" BorderThickness="1" BorderBrush="Black" Margin="0,0,-4,0" CornerRadius="2,12,0,0" Background="White" SnapsToDevicePixels="True"> <ContentPresenter Margin="12,2,12,2" VerticalAlignment="Center" HorizontalAlignment="Left" RecognizesAccessKey="True"/> </Border> <ControlTemplate.Triggers> <Trigger Property="IsChecked" Value="True"> <Setter Property="Panel.ZIndex" Value="100" /> <Setter TargetName="tabBorder" Property="Background" Value="LightBlue" /> <Setter TargetName="tabBorder" Property="BorderThickness" Value="1,1,1,0" /> </Trigger> </ControlTemplate.Triggers> </ControlTemplate> </Setter.Value> </Setter> </Style> </Window.Resources> <Grid Margin="4"> <Grid.RowDefinitions> <RowDefinition Height="Auto"/> <RowDefinition Height="*"/> </Grid.RowDefinitions> <StackPanel Grid.Row="0" Orientation="Horizontal" Margin="0,0,0,-1" Panel.ZIndex="1"> <RadioButton>All Time</RadioButton> <RadioButton IsChecked="True">Month</RadioButton> <RadioButton>Week</RadioButton> <RadioButton>Day</RadioButton> </StackPanel> <Border Grid.Row="1" Background="LightBlue" BorderThickness="1" BorderBrush="Black" SnapsToDevicePixels="True"> <Button Margin="10" Grid.Row="1">This is a test</Button> </Border> </Grid> </Window> 是放置摘要表的位置。

答案 1 :(得分:2)

格雷格,我想,分组网格将是您需求的最理想控制。您可以按照以下文章中的说明自定义数据网格。但这需要更多的时间才能使事情正确。

http://blog.smoura.com/wpf-toolkit-datagrid-part-iv-templatecolumns-and-row-grouping/

或者您可以使用符合您要求的商业WPF网格分组控制。

答案 2 :(得分:0)

  

实现TabControl外观的最佳方法是什么,但是使用编程方法,我不必在每个Tab项中重复这些内容?

使用TabControl。让每个TabItem包含CollectionViewSource基于相同的基础数据集合,但使用不同的过滤器。使用DataTemplate来展示CollectionViewSource

过滤需要某种代码隐藏,但这里只是一个XAML演示,可以进行排序:

<Page
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
  xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
  xmlns:scm="clr-namespace:System.ComponentModel;assembly=WindowsBase">
  <Page.Resources>
    <XmlDataProvider x:Key="Data">
      <x:XData>
        <Data xmlns="">
          <Item Date="2010-01-01" Value="January"/>
          <Item Date="2010-02-01" Value="February"/>
          <Item Date="2010-03-01" Value="March"/>
          <Item Date="2010-04-01" Value="April"/>
          <Item Date="2010-05-01" Value="May"/>
          <Item Date="2010-06-01" Value="June"/>
          <Item Date="2010-07-01" Value="July"/>
          <Item Date="2010-08-01" Value="August"/>
          <Item Date="2010-09-01" Value="September"/>
        </Data>
      </x:XData>
    </XmlDataProvider>
    <CollectionViewSource x:Key="ByDate" Source="{Binding Source={StaticResource Data}, XPath=Data/Item}">
      <CollectionViewSource.SortDescriptions>
        <scm:SortDescription PropertyName="@Date"/>
      </CollectionViewSource.SortDescriptions>
    </CollectionViewSource>
    <CollectionViewSource x:Key="ByValue" Source="{Binding Source={StaticResource Data}, XPath=Data/Item}">
      <CollectionViewSource.SortDescriptions>
        <scm:SortDescription PropertyName="@Value"/>
      </CollectionViewSource.SortDescriptions>
    </CollectionViewSource>
    <DataTemplate DataType="{x:Type CollectionViewSource}">
      <Border Margin="5" BorderBrush="DodgerBlue" BorderThickness="1" CornerRadius="4">
        <DockPanel Margin="5">
          <Label DockPanel.Dock="Top">This is here to show how you can make the layout of your TabItems complex without repeating yourself.</Label>
          <ListBox DockPanel.Dock="Top" x:Name="Items" ItemsSource="{Binding}" DisplayMemberPath="@Value" SelectedValuePath="@Value"/>
          <DockPanel>
            <Label>Selected item: </Label>
            <Label Content="{Binding ElementName=Items, Path=SelectedValue}"/>
          </DockPanel>
        </DockPanel>
      </Border>
    </DataTemplate>
  </Page.Resources>
  <Grid>  
    <TabControl>
       <TabItem Header="By date" Content="{StaticResource ByDate}"/>
       <TabItem Header="By value" Content="{StaticResource ByValue}"/>
    </TabControl>
  </Grid>
</Page>