come modificare la visualizzazione predefinita della scheda di navigazione in vista tabulazione personalizzata?

Question

mie schede di navigazione di default come da miei codici Di seguito riportiamo,

la mia domanda è: come faccio a cambiare la scheda di navigazione in alto alla scheda di seguito allegato?

come farò a raggiungere questo obiettivo?

La mia versione minima SDK è 8.

Ho provato un sacco, ma non c'era riuscita. Qualcuno può aiutarmi?

Grazie.

Answer 1

Scarica seguendo due classi da github

SlidingTabLayout.java

SlidingTabStrip.java

quindi creare il file xml

<com.emaple.ui.SlidingTabLayout 
      android:id="@+id/sliding_tabs_home" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" /> 

     <android.support.v4.view.ViewPager 
      android:id="@+id/viewpager_home" 
      android:layout_width="match_parent" 
      android:layout_height="0px" 
      android:layout_weight="1" 
      android:background="@android:color/white" /> 

E intiliaze come questo in attività o frammento

private void init() { 
     viewpagerHome.setAdapter(new SamplePagerAdapter()); 
     slidingTabsHome.setViewPager(viewpagerHome); 
    } 

SamplePagerAdapter.java

class SamplePagerAdapter extends PagerAdapter { 

/** 
* @return the number of pages to display 
*/ 
@Override 
public int getCount() { 
    return 10; 
} 

/** 
* @return true if the value returned from {@link #instantiateItem(ViewGroup, int)} is the 
* same object as the {@link View} added to the {@link ViewPager}. 
*/ 
@Override 
public boolean isViewFromObject(View view, Object o) { 
    return o == view; 
} 

/** 
* Return the title of the item at {@code position}. This is important as what this method 
* returns is what is displayed in the {@link SlidingTabLayout}. 
* <p/> 
* Here we construct one using the position value, but for real application the title should 
* refer to the item's contents. 
*/ 
@Override 
public CharSequence getPageTitle(int position) { 
    return "Item " + (position + 1); 
} 

/** 
* Instantiate the {@link View} which should be displayed at {@code position}. Here we 
* inflate a layout from the apps resources and then change the text view to signify the position. 
*/ 
@Override 
public Object instantiateItem(ViewGroup container, int position) { 
    // Inflate a new layout from our resources 
    View view = HomeActivity.this.getLayoutInflater().inflate(R.layout.pager_item, 
      container, false); 
    // Add the newly created View to the ViewPager 
    container.addView(view); 

    // Retrieve a TextView from the inflated View, and update it's text 
    TextView title = (TextView) view.findViewById(R.id.item_title); 
    title.setText(String.valueOf(position + 1)); 

    Log.i(LOG_TAG, "instantiateItem() [position: " + position + "]"); 

    // Return the View 
    return view; 
} 

/** 
* Destroy the item from the {@link ViewPager}. In our case this is simply removing the 
* {@link View}. 
*/ 
@Override 
public void destroyItem(ViewGroup container, int position, Object object) { 
    container.removeView((View) object); 
    Log.i(LOG_TAG, "destroyItem() [position: " + position + "]"); 
} 

}