如何在WPF中從一個tabitem移動到另一個tabitem

我有一個tab-control三個選項卡項目。每個標籤項目都有一個datagrid放置在它上面。，所有這三個數據網格在它們各自的選項卡上都是Master-Detail-SubDetail形式。如何在WPF中從一個tabitem移動到另一個tabitem

當用戶選擇主數據網格上的一行時，如何從第一個選項卡項目移動到第二個選項卡項目？我使用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

來源

2013-03-04 user1221765

我感覺到一個完全缺乏MVVM這裏... – 2013-03-04 21:45:32

看看[這裏]（http://stackoverflow.com/questions/15209870/dynamically-updating-tabcontrol-content-at-runtime/15210593# 15210593）對TabControl真的是什麼的解釋... – 2013-03-04 21:46:38

沒有沒有MVVM的WPF ...如果你嘗試以WinForms的方式使用WPF，你會遭受很大的損失。 – 2013-03-04 21:47:07

，你可以設置在DataGridSelectionChanged事件EventTrigger

因爲EventTrigger只有allowa動畫，你可以設置一個Int32AnimationUsingKeyFrames動畫變化TabControlSelectedIndex

觸發

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

來源

2013-03-04 23:08:31

感謝您的回覆..但我有一個錯誤說 - 「一個未處理的類型'System.InvalidCastException'的異常發生PresentationFramework.dll 其他信息：指定的轉換無效。「 – user1221765 2013-03-04 23:29:00

它在這裏工作正常，我添加了我用來測試這個'觸發器'的樣機應用程序，這樣你就可以在你的應用程序 – 2013-03-04 23:38:54

以外測試了。非常感謝:)再多一個問題，它是否沒有代碼爲routedevent？ – user1221765 2013-03-04 23:39:41

如何在WPF中從一個tabitem移動到另一個tabitem

回答

相關問題