Make active tab visible in scrollviewer

Question

I have a lot of tabs in my tabcontrol, so I used the solution from want to make scrollable tabs for a tabcontrol. The problem is that in my window I have buttons Previous-Next, that change active tab. So I want to scrollviewer to move automatically to active tab. It is possible to make by using BringIntoView() method of a FrameworkElement. But how can I implement it in my case?

What happened when you tried to use `BringIntoView`? – Sheridan Jul 22 '14 at 13:33 — Sheridan, Jul 22 '14 at 13:33
@Sheridan Just didn't know how and where to call it) – Den Jul 22 '14 at 14:42 — Den, Jul 22 '14 at 14:42

score 1 · Accepted Answer · answered Jul 22 '14 at 13:39

here you go, I solved the issue by creating an attached behavior (Attached Properties)

if your template resembles as in the link you've posted

add the following style with the binding the attached property ScrollHelper.SelectScroll to IsSelected of the tab item

    <TabControl>
        <TabControl.Resources>
            <Style TargetType="TabItem" xmlns:l="clr-namespace:CSharpWPF">
                <Setter Property="l:ScrollHelper.SelectScroll"
                        Value="{Binding IsSelected,RelativeSource={RelativeSource Self}}" />
            </Style>
        </TabControl.Resources>
        ...
    </TabControl>

behavior class

namespace CSharpWPF
{
    class ScrollHelper : DependencyObject
    {
        public static bool GetSelectScroll(DependencyObject obj)
        {
            return (bool)obj.GetValue(SelectScrollProperty);
        }

        public static void SetSelectScroll(DependencyObject obj, bool value)
        {
            obj.SetValue(SelectScrollProperty, value);
        }

        // Using a DependencyProperty as the backing store for SelectScroll.  This enables animation, styling, binding, etc...
        public static readonly DependencyProperty SelectScrollProperty =
            DependencyProperty.RegisterAttached("SelectScroll", typeof(bool), typeof(ScrollHelper), new PropertyMetadata(false, OnSelectScroll));


        private static void OnSelectScroll(DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            TabItem tab = d as TabItem;
            if ((bool)e.NewValue)
            {
                tab.BringIntoView();
            }
        } 
    }
}

upon change of the property it will invoke BringIntoView() method which will pull the tab into view hence scrollviewer will scroll to the tab

you may choose to rename the property or the class as per your liking, I simply chose a random name what came to my mind.

Make active tab visible in scrollviewer

1 Answers1