CODEWITHSUNDEEP
c#wpftabcontrolmahapps.metro
Rahul
Rahul

Reputation: 2741

MahApps Metro - Applying transition to tab control

In MahApps Metro source code, the sample solution includes a Visual Studio style demo application.

enter image description here

I need to combine the Visual Studio style with AnimatedSingleRowTabControl. I have modified the XAML: 

<Style x:Key="VsTabControl" TargetType="{x:Type TabControl}">

To:

<Style x:Key="VsTabControl" TargetType="{x:Type AnimatedSingleRowTabControl}">

After the modification the transition worked as expected, but the Visual studio style was gone.

Can anyone help me to achieve this?

Upvotes: 2

Views: 3975

Answers (1)

Terry
Terry

Reputation: 59

If you have the source of MahApps, you should navigate in the MahApps.Metro project to Styles/VS/TabControl.xaml.

To add the animations to this TabControl, modify the source like this:

  1. Open MahApps.Metro/Styles/VS/TabControl.xaml
  2. Add the following things to the first ResourceDictionary:
    • xmlns:Behaviours="clr-namespace:MahApps.Metro.Behaviours"
    • xmlns:Controls="clr-namespace:MahApps.Metro.Controls"
  3. Scroll down until you see <Setter Property="Template">
  4. Add <Setter Property="Controls:TabControlHelper.Transition" Value="Left" /> above the Template
  5. Replace the Template with the Template already written in the MetroAnimatedTabControl and remove all the background properties. Also change TargetType from Controls:MetroAnimatedTabControl to just a regular TabControl

The full source of the VS/TabControl.xaml can be found here: http://pastebin.com/Ssbxg41a

GIF :D

Upvotes: 1

Related Questions