Question

我有一个tab-control，其中有三个标签项。每个标签项都放置了datagrid。并且它们各自标签项上的所有这三个数据网格都是Master-Detail-SubDetail形式。

当用户在主数据网格上选择行时，如何从第一个标签项移动到第二个标签项？我使用ADO.Net实体框架创建了一个模型来创建这个主 - 详细信息视图。

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>

tab item 1

tab item 2

Answer 1

您可以在EventTrigger DataGrid事件

上设置SelectionChanged

由于EventTrigger仅允许动画，您可以设置Int32AnimationUsingKeyFrames动画以更改TabControl SelectedIndex

触发

 <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>

以下是一个例子：

<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>
     ......

这是我的模型

代码：

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：

<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>

如何在WPF中从一个tabitem移动到另一个tabitem

1 个答案: