Tabs Inside Tab using PagerSlidingTabStrip

问题:

I have implemented the first row of tab.
Inside that tab i have another set of Tabs.
Specifically two more tabs.

Please refer to these images.

The Picture above is the dog tab is selected.

The picture above is I want to select the Cat tab.
But unfortunately, the tab is not sliding properly.
its like its just a slowly scrolling.
but it should be on just one slide it should be on the cat tab.
My First layer of tab is inside Fragment.
The second row of tab is also in Fragment.

public class AdapterFragmentPagerItem extends FragmentStatePagerAdapter {
String[] pageTitle={"Do's","Dont's","First Aid"};
public AdapterFragmentPagerItem(FragmentManager fm) {
    super(fm);
}

@Override
public Fragment getItem(int position) {
    switch(position){
        case 0:
            return new FragmentDo();
        case 1:
            return new FragmentDonts();
        case 2:
            return new FragmentFirstAid();
    }
    return null;
}

@Override
public int getCount() {
    return 3;
}

@Override
public CharSequence getPageTitle(int position) {
    return pageTitle[position];
}


 }    

The above code is for the first image.

public class AdapterFragmentDos extends FragmentStatePagerAdapter {
String[] pageTitle = {"Dog", "Cat"};

public AdapterFragmentDos(FragmentManager fm) {
    super(fm);
}

@Override
public Fragment getItem(int position) {
    if(position==0){
        return new FragmentDonts();
    }else{
        return new FragmentFirstAid();
    }
}

@Override
public int getCount() {
    return 2;
}

@Override
public CharSequence getPageTitle(int position) {
    return pageTitle[position];
}
 }

And this is for the second image.