Как программно переключать вкладки с помощью представлений? - PullRequest
Новая
       28

Как программно переключать вкладки с помощью представлений?

0 голосов
/ 02 февраля 2012

Я "проектирую" интерфейсы для приложения, написанного на C # WPF.

Чтобы упростить обслуживание и понимание, я поместил содержимое каждой вкладки в отдельный XAML file. Поэтому в моем проекте я получил папку «Views», в которой есть 3 файла XAML, представляющих одну вкладку приложения в каждом файле.

Я хочу иметь возможность перемещаться между этими вкладками, как только кнопка нажимается на определенной вкладке.

e.g : I am at Tab one called, Configuration. (the other two tabs are hidden). As soon as i hit a "start" button i want my Actual tab to be hidden,and the second tab to be shown in its place.

Проблема в том, что у меня есть главное окно, которое содержит вкладки так: 

<DockPanel LastChildFill="True">
    <StatusBar Name="statusBar" DockPanel.Dock="Bottom" Height="22">
        <StatusBarItem x:Name="messagePanel" Content="Ready" VerticalAlignment="Center" />
        <StatusBarItem Grid.Column="1" Margin="5,2" HorizontalAlignment="Right" >
            <ProgressBar x:Name="progressPanel" IsIndeterminate="False" Width="160" Height="18" Visibility="Collapsed" />
        </StatusBarItem>
    </StatusBar>

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="190" />
            <RowDefinition Height="6" />
            <RowDefinition Height="110*" />
        </Grid.RowDefinitions>

        <views:EventsView x:Name="eventsView" Grid.Row="2" Margin="4" />

        <GridSplitter Grid.Row="1" HorizontalAlignment="Stretch" Margin="0" VerticalAlignment="Stretch" ResizeBehavior="PreviousAndNext" ShowsPreview="True" ResizeDirection="Rows" />

        <TabControl Margin="4" Name="tabControl1">
            <TabItem Header="Configuration" Name="tabItemConfiguration">
                <views:Configuration />
            </TabItem>

            <TabItem Header="Classification" Name="tabItemClassification" Visibility="Hidden">
                <views:Classifier/>
            </TabItem>                
        </TabControl>

    </Grid>
</DockPanel>

Вопрос: Как программно переключаться с одной вкладки на другую при нажатии кнопки? Помните, что я нахожусь в другом файле XAML, поэтому у меня нет доступа (по крайней мере, я не знаю, как получить доступ) к ссылке на другую вкладку, как я сделал бы в коде, стоящем за main window

Заранее спасибо, и извините за вставленный длинный код

EDIT:

Это дало мне доступ к вкладкам, но как мне показать содержимое вкладки вместо просто маленькой вкладки? 

MainWindow.Instance.tabItemClassification.Visibility = Visibility.Visible;
MainWindow.Instance.tabItemConfiguration.Visibility  = Visibility.Visible;

Я хочу показать содержимое второй вкладки

Ответы [ 2 ]

1 голос
/ 02 февраля 2012

Я бы настоятельно рекомендовал изучить шаблон проектирования MVVM

. С помощью этого шаблона вы бы связали свой TabControl.ItemsSource с коллекцией объектов, представляющих элементы вашей вкладки, и связали SelectedItem или * 1005.* в другое поле данных в DataContext.Каждый из TabItems будет ViewModel, и будет нарисован с использованием другого View, и для изменения выбранного элемента вы должны установить свойство SelectedValue.

Вот пример.

Ваш класс, который является DataContext для вашего MainView, будет выглядеть так: 

public class MainViewModel : INotifyPropertyChanged
{
    // These should be expanded into full properties with get/set methods
    // and the set method should raise the PropertyChanged event
    public ObservableCollection<ITabViewModel> TabViewModels { get; set; }
    public ITabViewModel SelectedTabIndex { get; set; }
    public ICommand ChangeTabCommand { get; set; }

    public MainViewModel()
    {
        TabViewModels = new ObservableCollection<ITabViewModel>();
        TabViewModels.Add(new ConfigurationTabViewModel());
        TabViewModels.Add(new ClassificationTabViewModel());

        SelectedTabIndex = 0;

        ChangeTabCommand = new RelayCommand<int>(ChangeTabIndex);
    }

    void ChangeTabIndex(int tabIndex)
    {
        if (tabIndex >= 0 && tabIndex < TabViewModels.Count)
            SelectedTabIndex = tabIndex;
    }

    // Also implement INotifyPropertyChanged
}

В этом случае ваше основное представление XAML будет выглядеть так: 

<TabControl ItemsSource="{Binding TabViewModels}"
            SelectedIndex="{Binding SelectedTabIndex}">

    <TabControl.Resources>
        <Style TargetType="{x:Type TabItem}">
            <Setter Property="Header" Value="{Binding Header}" />
        </Style>

        <DataTemplate DataType="{x:Type viewModels:ConfigurationTabViewModel}">
            <views:Configuration />
        </DataTemplate>

        <DataTemplate DataType="{x:Type viewModels:ClassificationTabViewModel}">
            <views:Classification />
        </DataTemplate>

    </TabControl.Resources>

</TabControl>

Есливы заинтересованы, у меня есть простой пример MVVM , размещенный в моем блоге, который включает в себя больше информации о INotifyPropertyChange и RelayCommand, а статья о навигации с MVVM содержит оченьпример, аналогичный тому, что я написал здесь, хотя он заменяет Content в ContentControl вместо SelectedItem в TabControl.

0 голосов
/ 02 февраля 2012

Это решило мои проблемы. 

MainWindow.Instance.tabItemClassification.Visibility = Visibility.Visible;
        MainWindow.Instance.tabItemConfiguration.Visibility = Visibility.Hidden;

        // Changes the view to the classification tab
        MainWindow.Instance.tabController.SelectedIndex = 1;

Хорошего дня.

...