Divider does not work for TitlePageIndicator with viewpagerindicator and actionbarsherlock

Question

I noticed that ICS style separators are supported with the latest version of ViewPagerIndicator, I tried to keep track of the problem and solution, but no matter what I do, I can not get the divider to display my options in the action bar for TitlePageIndicator. I added IcsLayout as a container, set the delimiter, showDividers and other properties, but still do not get anything. Here is my layout (oddly enough, if I switch IcsLayout to the view indicator, the application will crash):

<com.actionbarsherlock.internal.widget.IcsLinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res/com.sosick.android.brink" android:layout_width="match_parent" android:divider="#ffffff" android:showDividers="middle" android:dividerPadding="8dp" android:dividerHeight="10dp" android:layout_height="match_parent" android:orientation="vertical" > <com.viewpagerindicator.TitlePageIndicator android:id="@+id/tpi_header" android:layout_width="match_parent" android:layout_height="wrap_content" textColor="@color/text_light" android:background="@drawable/ab_stacked_solid_brink" app:topPadding="10dp" app:footerPadding="15dp" app:footerColor="#a4ded7" app:footerIndicatorHeight="2dp" app:footerIndicatorStyle="underline" app:footerLineHeight="2dp" app:selectedBold="false" /> <android.support.v4.view.ViewPager android:id="@+id/vp_pages" android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="1" /> </com.actionbarsherlock.internal.widget.IcsLinearLayout> 

Answer 1

You need to declare the delimiter options in styles, not in xml layout.

../RES/values/styles.xml:

 <style name="StyledIndicators" parent="@android:style/Theme.Light"> <item name="vpiIconPageIndicatorStyle">@style/CustomIconIndicator</item> </style> <style name="CustomIconIndicator" parent="Widget.TabPageIndicator"> <item name="android:divider">@drawable/custom_tab_indicator_divider</item> <item name="android:showDividers">middle</item> <item name="android:dividerPadding">10dp</item> </style> 

In the manifest for your activity:

 <activity android:name=".SampleIconsDefault" android:label="Icons/Default" android:theme="@style/StyledIndicators"> </activity> 

Answer 2

Below are snippets of code mainly from Android Developer . There is also a very good example application / project.

Use ViewPage as a container for your layout, for example. Res / layout / activity_main.xml:

 <android.support.v4.view.ViewPager xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/pager" android:layout_width="match_parent" android:layout_height="match_parent" /> 

Add ABS ActionBar.TabListener to your class, add and extend FragmentPagerAdapter or FragmentStatePagerAdapter from the support library, for example:

 public class TheDesertFoxActivity extends SherlockFragmentActivity implements ActionBar.TabListener { private AppSectionsPagerAdapter mAppSectionsPagerAdapter; private ViewPager mViewPager; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); mAppSectionsPagerAdapter = new AppSectionsPagerAdapter(getSupportFragmentManager()); // Set up action bar final ActionBar actionBar = getSupportActionBar(); actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_TABS); // Set up the ViewPager, attaching the adapter mViewPager = (ViewPager) findViewById(R.id.pager); mViewPager.setAdapter(mAppSectionsPagerAdapter); mViewPager.setOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener() { @Override public void onPageSelected(int position) { // When swiping between different app sections, select the corresponding tab actionBar.setSelectedNavigationItem(position); } }); // For each of the sections in the app, add a tab to the action bar for (int i = 0; i < mAppSectionsPagerAdapter.getCount(); i++) { // Create a tab with text corresponding to the page title defined by the adapter. // Also specify this Activity object, which implements the TabListener interface, as the // listener for when this tab is selected. actionBar.addTab(actionBar.newTab() .setText(mAppSectionsPagerAdapter.getPageTitle(i)) .setTabListener(this)); } } public static class AppSectionsPagerAdapter extends FragmentPagerAdapter { public AppSectionsPagerAdapter(FragmentManager fm) { super(fm); } @Override public Fragment getItem(int i) { switch (i) { Fragment fragment = new MyTabsFragment(); Bundle args = new Bundle(); args.putInt(MyTabsFragment.TAB_ID, i); fragment.setArguments(args); return fragment; } } @Override public int getCount() { return <YOUR_TAB_COUNT>; } } public static class MyTabsFragment extends Fragment { public static final String TAB_ID = "tab_id"; @Override public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) { int layoutId = -1; switch (getArguments(getInt(TAB_ID))) { case 0: layoutId = R.layout.fragment_first_tab; break; case 1: layoutId = R.layout.fragment_second_tab; break; ... ... ... default: layoutId = R.layout.fragment_default_tab; } View rootView = inflater.inflate(layoutId, container, false); return rootView; } } } 

What is it. Separators will be placed by the ViewPager for you. You do not need to add them yourself.