Skip to content

402214782/wpfchrometabs-mvvm

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

51 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

WPF Chrome Tabs - MVVM

A tab control based on WPF chrome tabs, modified to work with the MVVM pattern. WPF chrome tabs is a tab control modeled after the tabs in Google's Chrome browser.

New features include:

  • Support for dragging tabs to new windows, and snapping them back into tabs.
  • Support for pinned tabs.
  • Bindable property to lock tabs
  • Bindable property to show/hide "add tab" button
  • Bindable property for selected tab brush
  • Bindable property to drag window instead when dragging the last remaining tab.
  • Bindable propertes for minimum tab width, maximum tab width, and pinned tab width.

Available on NuGet.

The basic functionality can be done as simple as :

####xaml:

        xmlns:ct="clr-namespace:ChromeTabs;assembly=ChromeTabs"
    
        <ct:ChromeTabControl ItemsSource="{Binding ItemCollection}"
                             SelectedItem="{Binding SelectedTab}"
                             AddTabCommand="{Binding AddTabCommand}"
                             CloseTabCommand="{Binding CloseTabCommand}">

####viewmodel:

        public ObservableCollection<MyTabClass> ItemCollection { get; set; }
        public MyTabClass SelectedTab { get; set; }
        (...)
        void CloseTabCommandAction(MyTabClass tab)
        {
            ItemCollection.Remove(tab);
        }
        void AddTabCommandAction()
        {
            ItemCollection.Add(New MyTabClass());
        }

##New in 1.1:

  • Pinned tabs: Chrome style pinned tabs is now supported.
  • Bindable propertes for minimum tab width, maximum tab width, and pinned tab width is added
  • Fixed several glitches and bugs that some times occured when moving or switching tabs.

####Pinned tab implementation:

I strongly advice to check out the new demo project if you upgrade to 1.1 and plan to use pinned tabs. The old demo project contained sorting logic that can break pinned tab functionality if not changed.

Pinning tabs requires the "IsPinned" property to be set on the ChromeTabItem.

Subscribe to the ContainerItemPreparedForOverride event on ChromeTabControl, and set the IsPinned property:

        private void TabControl_ContainerItemPreparedForOverride(object sender, ContainerOverrideEventArgs e)
        {
            e.Handled = true;
            MyViewModel viewModel = e.Model as MyViewModel;
            if (e.TabItem != null && viewModel != null)
            {
                e.TabItem.IsPinned = viewModel.IsPinned;
            }
        }

Then we need to add a SortDescription to the CollectionViewSource to keep the pinned tabs in place. This description needs to be added before any other SortDescriptions:

     ICollectionView view = CollectionViewSource.GetDefaultView(MyTabCollection) as ICollectionView;
     view.SortDescriptions.Add(new SortDescription("IsPinned", ListSortDirection.Descending));

See the demo project for full implementations of functionality like tab tearing, snapping windows to tabs, tab reordering, context menus, pinning tabs, and more.

Example

About

A tab control based on WPF chrome tabs, modified to work with the MVVM pattern

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • C# 100.0%