dev控件官网（dev数据处理控件有哪些）

概述

TabControl是我们常用的翻页控件，但是wpf自带的 TabControl功能和样式比较单一，假如我的tab页面比较多，标题在有限的空间放不下，需要用左右箭头翻页，同时需要加一个筛选跳转的功能，这时候我们就需要使用Dev的控件DXTabControl.

功能演示

dev控件官网,dev数据处理控件有哪些(1)

代码实现

前台XAML:

<UserControl x:Class="Caliburn.Micro.Hello.TabControlView" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:dx="http://schemas.devexpress.com/winfx/2008/xaml/core" xmlns:dxlc="http://schemas.devexpress.com/winfx/2008/xaml/layoutcontrol" xmlns:local="clr-namespace:Caliburn.Micro.Hello" xmlns:cal="http://www.caliburnproject.org" mc:Ignorable="d" Height="450" Width="800" > <Grid Height="300" Width="250" HorizontalAlignment="Left" VerticalAlignment="Top"> <Grid.RowDefinitions> <RowDefinition Height="35"/> <RowDefinition Height="Auto"/> </Grid.RowDefinitions> <StackPanel Orientation="Horizontal" HorizontalAlignment="Right"> <Label Content="跳转到页:" VerticalAlignment="Center" Margin="5"/> <TextBox Text="{Binding PageIndex}" MinWidth="50" VerticalAlignment="Center" Margin="5"/> <Button Content="跳转" Name="Button_Click"/> </StackPanel> <dx:DXTabControl Grid.Row="1" SelectedIndex="{Binding SelectedIndex}" ItemsSource="{Binding ParamItems}" Margin="5">  <dx:DXTabControl.ItemHeaderTemplate> <DataTemplate> <StackPanel Orientation="Horizontal">  <dxlc:LayoutItem Label="{Binding Header}"/> </StackPanel> </DataTemplate> </dx:DXTabControl.ItemHeaderTemplate> <dx:DXTabControl.ItemTemplate> <DataTemplate> <ContentControl cal:View.Model="{Binding SubView}" /> </DataTemplate> </dx:DXTabControl.ItemTemplate> <dx:DXTabControl.View> <dx:TabControlScrollView AllowHideTabItems="False" AllowAnimation="True" AllowKeyboardNavigation="True" AllowScrollOnMouseWheel="True" ShowHeaderMenu="True"/> </dx:DXTabControl.View>
</dx:DXTabControl> 
</Grid></UserControl>

这里的ShowHeaderMenu="True"可以放出筛选的按钮，点击下拉按钮，选择要跳转的页面就可以跳转过去；

如果想擦除页面，将AllowHideTabItems设置true即可

dev控件官网,dev数据处理控件有哪些(2)

每个页面通过模板绑定了一个子页面

<dx:DXTabControl.ItemTemplate> <DataTemplate> <ContentControl cal:View.Model="{Binding SubView}" /> </DataTemplate> </dx:DXTabControl.ItemTemplate>

后台代码：

using PropertyChanged;using System.Collections.ObjectModel;
namespace Caliburn.Micro.Hello{ [AddINotifyPropertyChangedInterface] public class TabControlViewModel : Screen, IViewModel { public ObservableCollection<ParamDTO> ParamItems { get; set; } = new ObservableCollection<ParamDTO>; public int SelectedIndex { get; set; } public int PageIndex { get; set; } public TabControlViewModel { DisplayName = "TabControlTest"; PageIndex = 3;
ParamItems.Add(new ParamDTO { Header = "1", SubView = new SubTabPageViewModel }); ParamItems.Add(new ParamDTO { Header = "2", SubView = new SubTabPageViewModel }); ParamItems.Add(new ParamDTO { Header = "3", SubView = new SubTabPageViewModel }); ParamItems.Add(new ParamDTO { Header = "4", SubView = new SubTabPageViewModel }); ParamItems.Add(new ParamDTO { Header = "5", SubView = new SubTabPageViewModel }); ParamItems.Add(new ParamDTO { Header = "6", SubView = new SubTabPageViewModel }); ParamItems.Add(new ParamDTO { Header = "7", SubView = new SubTabPageViewModel }); ParamItems.Add(new ParamDTO { Header = "8", SubView = new SubTabPageViewModel }); ParamItems.Add(new ParamDTO { Header = "9", SubView = new SubTabPageViewModel }); ParamItems.Add(new ParamDTO { Header = "10", SubView = new SubTabPageViewModel }); ParamItems.Add(new ParamDTO { Header = "11", SubView = new SubTabPageViewModel }); ParamItems.Add(new ParamDTO { Header = "12", SubView = new SubTabPageViewModel }); }
public void Button_Click { SelectedIndex = PageIndex - 1; } } public class ParamDTO { /// <summary> /// 标题 /// </summary> public string Header { get; set; }
/// <summary> /// SubView /// </summary> public SubTabPageViewModel SubView { get; set; } }
}