[英]how to move from one tabitem to another in WPF
I have a tab-control
with three tab items. 我有一个带有三个标签项的
tab-control
。 each tab item has a datagrid
placed on it. 每个选项卡项上都有一个
datagrid
。 and all these three datagrid's on their respective tab items is of Master-Detail-SubDetail form. 所有这三个数据网格在其各自的选项卡项上均为Master-Detail-SubDetail表单。
how to move from first tab item to the second tab item when a user selects a row on the Master datagrid? 当用户在主数据网格上选择一行时,如何从第一个选项卡项移动到第二个选项卡项? I have created a Model using
ADO.Net
entity framework to create this master-detail view. 我已经使用
ADO.Net
实体框架创建了一个模型来创建此主从视图。
XAML layout XAML布局
<TabControl Height="270" HorizontalAlignment="Left" Margin="16,23,0,0" Name="tabControl1" VerticalAlignment="Top" Width="462">
<TabItem Header="Person" Name="tabItem1">
<Grid DataContext="{StaticResource peopleViewSource}">
<DataGrid AutoGenerateColumns="False" EnableRowVirtualization="True" Height="166" SelectedItem="{Binding personDetails}"
HorizontalAlignment="Left" ItemsSource="{Binding}" Margin="64,23,0,0" Name="peopleDataGrid" RowDetailsVisibilityMode="VisibleWhenSelected" VerticalAlignment="Top" Width="289">
<DataGrid.Columns>
<DataGridTextColumn x:Name="personIDColumn" Binding="{Binding Path=personID}" Header="person ID" Width="SizeToHeader" />
<DataGridTextColumn x:Name="firstNameColumn" Binding="{Binding Path=firstName}" Header="first Name" Width="SizeToHeader" />
<DataGridTextColumn x:Name="lastNameColumn" Binding="{Binding Path=lastName}" Header="last Name" Width="SizeToHeader" />
</DataGrid.Columns>
</DataGrid>
</Grid>
</TabItem>
<TabItem Header="Person Details" Name="tabItem2">
<Grid DataContext="{StaticResource peoplepersonDetailsViewSource}">
<DataGrid AutoGenerateColumns="False" EnableRowVirtualization="True" Height="120" SelectedItem="{Binding personDetails.personStatus}"
HorizontalAlignment="Left" ItemsSource="{Binding}" Margin="82,18,0,0" Name="personDetailsDataGrid" RowDetailsVisibilityMode="VisibleWhenSelected" VerticalAlignment="Top" Width="172">
<DataGrid.Columns>
<DataGridTextColumn x:Name="detailIDColumn" Binding="{Binding Path=detailID}" Header="detail ID" Width="SizeToHeader" />
<DataGridTextColumn x:Name="positionColumn" Binding="{Binding Path=position}" Header="position" Width="SizeToHeader" />
<DataGridTextColumn x:Name="personIDColumn1" Binding="{Binding Path=personID}" Header="person ID" Width="SizeToHeader" />
</DataGrid.Columns>
</DataGrid>
</Grid>
</TabItem>
<TabItem Header="Person Status" Name="tabItem3">
<Grid DataContext="{StaticResource peoplepersonDetailspersonStatusViewSource}">
<DataGrid AutoGenerateColumns="False" EnableRowVirtualization="True" Height="143" HorizontalAlignment="Left" ItemsSource="{Binding}" Margin="91,23,0,0" Name="personStatusDataGrid" RowDetailsVisibilityMode="VisibleWhenSelected" VerticalAlignment="Top" Width="185">
<DataGrid.Columns>
<DataGridTextColumn x:Name="detailIDColumn1" Binding="{Binding Path=detailID}" Header="detail ID" Width="SizeToHeader" />
<DataGridTextColumn x:Name="positionColumn1" Binding="{Binding Path=position}" Header="position" Width="SizeToHeader" />
<DataGridTextColumn x:Name="statussColumn" Binding="{Binding Path=statuss}" Header="statuss" Width="SizeToHeader" />
</DataGrid.Columns>
</DataGrid>
</Grid>
</TabItem>
</TabControl>
You could setup a EventTrigger
on the DataGrid
SelectionChanged
event 您可以在
DataGrid
SelectionChanged
事件上设置EventTrigger
Because EventTrigger only allowa Animation you can setup a Int32AnimationUsingKeyFrames
animation to change the TabControl
SelectedIndex
由于EventTrigger仅允许动画,因此您可以设置
Int32AnimationUsingKeyFrames
动画来更改TabControl
SelectedIndex
Trigger 触发
<DataGrid.Triggers>
<EventTrigger RoutedEvent="DataGrid.SelectionChanged" > // SelectionChanged Event
<BeginStoryboard>
<Storyboard >
<Int32AnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="tabControl1" Storyboard.TargetProperty="SelectedIndex"> // set target control and target property
<SplineInt32KeyFrame KeyTime="00:00:00" Value="1"/> // Value = TabControl Selected index you want to show
</Int32AnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</DataGrid.Triggers>
Here is an example: 这是一个例子:
<TabControl Height="270" HorizontalAlignment="Left" Margin="16,23,0,0" Name="tabControl1" VerticalAlignment="Top" Width="462">
<TabItem Header="Person" Name="tabItem1">
<Grid DataContext="{StaticResource peopleViewSource}">
<DataGrid AutoGenerateColumns="False" EnableRowVirtualization="True" Height="166" SelectedItem="{Binding personDetails}"
HorizontalAlignment="Left" ItemsSource="{Binding}" Margin="64,23,0,0" Name="peopleDataGrid" RowDetailsVisibilityMode="VisibleWhenSelected" VerticalAlignment="Top" Width="289">
<DataGrid.Columns>
<DataGridTextColumn x:Name="personIDColumn" Binding="{Binding Path=personID}" Header="person ID" Width="SizeToHeader" />
<DataGridTextColumn x:Name="firstNameColumn" Binding="{Binding Path=firstName}" Header="first Name" Width="SizeToHeader" />
<DataGridTextColumn x:Name="lastNameColumn" Binding="{Binding Path=lastName}" Header="last Name" Width="SizeToHeader" />
</DataGrid.Columns>
<DataGrid.Triggers>
<EventTrigger RoutedEvent="DataGrid.SelectionChanged" >
<BeginStoryboard>
<Storyboard >
<Int32AnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="tabControl1" Storyboard.TargetProperty="SelectedIndex">
<SplineInt32KeyFrame KeyTime="00:00:00" Value="1"/>
</Int32AnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</DataGrid.Triggers>
</DataGrid>
</Grid>
</TabItem>
......
Here is my mockup 这是我的样机
Code: 码:
namespace WpfApplication7
{
public partial class MainWindow : Window
{
private Person _selectedPerson;
private ObservableCollection<Person> _persons = new ObservableCollection<Person>();
public MainWindow()
{
InitializeComponent();
Items.Add(new Person { personID = "Stack" });
Items.Add(new Person { personID = "Overflow" });
}
public ObservableCollection<Person> Items
{
get { return _persons; }
set { _persons = value; }
}
public Person SelectedPerson
{
get { return _selectedPerson; }
set { _selectedPerson = value; }
}
}
public class Person
{
public string personID { get; set; }
public string firstname { get; set; }
public string lastname { get; set; }
}
}
Xaml: XAML:
<Window x:Class="WpfApplication7.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="399" Width="464" Name="UI" >
<Grid>
<TabControl Height="270" HorizontalAlignment="Left" Margin="16,23,0,0" Name="tabControl1" VerticalAlignment="Top" Width="462">
<TabItem Header="Person" Name="tabItem1">
<Grid DataContext="{Binding ElementName=UI, Path=Items}" >
<DataGrid AutoGenerateColumns="False" EnableRowVirtualization="True" Height="166" SelectedItem="{Binding personDetails}"
HorizontalAlignment="Left" ItemsSource="{Binding}" Margin="64,23,0,0" Name="peopleDataGrid" RowDetailsVisibilityMode="VisibleWhenSelected" VerticalAlignment="Top" Width="289">
<DataGrid.Columns>
<DataGridTextColumn x:Name="personIDColumn" Binding="{Binding Path=personID}" Header="person ID" Width="SizeToHeader" />
<DataGridTextColumn x:Name="firstNameColumn" Binding="{Binding Path=firstName}" Header="first Name" Width="SizeToHeader" />
<DataGridTextColumn x:Name="lastNameColumn" Binding="{Binding Path=lastName}" Header="last Name" Width="SizeToHeader" />
</DataGrid.Columns>
<DataGrid.Triggers>
<EventTrigger RoutedEvent="DataGrid.SelectionChanged" >
<BeginStoryboard>
<Storyboard >
<Int32AnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="tabControl1" Storyboard.TargetProperty="SelectedIndex">
<SplineInt32KeyFrame KeyTime="00:00:00" Value="1"/>
</Int32AnimationUsingKeyFrames>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</DataGrid.Triggers>
</DataGrid>
</Grid>
</TabItem>
<TabItem Header="Person Details" Name="tabItem2">
<Grid>
<DataGrid AutoGenerateColumns="False" EnableRowVirtualization="True" Height="120" SelectedItem="{Binding personDetails.personStatus}"
HorizontalAlignment="Left" ItemsSource="{Binding}" Margin="82,18,0,0" Name="personDetailsDataGrid" RowDetailsVisibilityMode="VisibleWhenSelected" VerticalAlignment="Top" Width="172">
<DataGrid.Columns>
<DataGridTextColumn x:Name="detailIDColumn" Binding="{Binding Path=detailID}" Header="detail ID" Width="SizeToHeader" />
<DataGridTextColumn x:Name="positionColumn" Binding="{Binding Path=position}" Header="position" Width="SizeToHeader" />
<DataGridTextColumn x:Name="personIDColumn1" Binding="{Binding Path=personID}" Header="person ID" Width="SizeToHeader" />
</DataGrid.Columns>
</DataGrid>
</Grid>
</TabItem>
<TabItem Header="Person Status" Name="tabItem3">
<Grid>
<DataGrid AutoGenerateColumns="False" EnableRowVirtualization="True" Height="143" HorizontalAlignment="Left" ItemsSource="{Binding}" Margin="91,23,0,0" Name="personStatusDataGrid" RowDetailsVisibilityMode="VisibleWhenSelected" VerticalAlignment="Top" Width="185">
<DataGrid.Columns>
<DataGridTextColumn x:Name="detailIDColumn1" Binding="{Binding Path=detailID}" Header="detail ID" Width="SizeToHeader" />
<DataGridTextColumn x:Name="positionColumn1" Binding="{Binding Path=position}" Header="position" Width="SizeToHeader" />
<DataGridTextColumn x:Name="statussColumn" Binding="{Binding Path=statuss}" Header="statuss" Width="SizeToHeader" />
</DataGrid.Columns>
</DataGrid>
</Grid>
</TabItem>
</TabControl>
</Grid>
</Window>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.