Android SlidingTabLayout con icons

Estoy usando SlidingTabLayout de google en mi opinión, pero quiero agregar icons a las tabs. Estoy usando este http://developer.android.com/samples/SlidingTabsBasic/src/com.example.android.common/view/SlidingTabLayout.html ¿Alguien puede ayudarme?

void setUpPager(View view){ mViewPager = (ViewPager) view.findViewById(R.id.viewpager); mViewPager.setAdapter(new TabsPagerAdapter(getActivity())); mSlidingTabLayout = (SlidingTabLayout) view.findViewById(R.id.sliding_tabs); mSlidingTabLayout.setViewPager(mViewPager); } 

Aquí está mi xml:

     

Use mSlidingTabLayout.setCustomTabView(int layoutResId, int textViewId) para inflar un diseño personalizado para las vistas de la pestaña SlidingTabLayout .

Cuando SlidingTabLayout intenta rellenar las SlidingTabLayout , inicialmente busca cualquier recurso de diseño especificado para inflar. De lo contrario, se infla la vista de pestaña predeterminada.

Solo quiero dar un ejemplo para la respuesta correcta y aceptada. 🙂
En primer lugar, agregue las tabs y configure su vista personalizada cuando agregue el adaptador a su Viewpager. Por ejemplo, vea las siguientes líneas:

 mViewpager = (ViewPager) view.findViewById(R.id.pager); //Do something with your view before setting up adapter ViewPager.setAdapter(mSectionsPagerAdapter); mSlidingTabLayout = (SlidingTabLayout) View().findViewById(R.id.sliding_tabs); mSlidingTabLayout.setCustomTabView(R.layout.custom_tab_title, R.id.tabtext); mSlidingTabLayout.setViewPager(mViewPager); 

Donde sliding_tabs son los tabuladores_títulos que se agregarán y están definidos en el archivo xml del viewpager como:

 < ?xml version="1.0" encoding="utf-8"?>     

y donde custom_tab_title es un archivo xml separado en su carpeta de layout Por ejemplo:

 < ?xml version="1.0" encoding="utf-8"?>     

y puede configurar la imagen para una pestaña en particular de la siguiente manera:

 Drawable tab_image = getResources().getDrawable(getResources().getIdentifier("image_name_in_drawable", "drawable", "com.packagename")); tab_image.setBounds(0, 0, 40, 40); //Setting up the resolution for image ImageSpan imageSpanresource = new ImageSpan(tab_image); //Notice the additional space at the end of the String resourcesstring = "Tab1 "; //here we are setting up the position to display image.. SpannableString viewpager_tab_title = new SpannableString(resourcesstring ); viewpager_tab_title.setSpan(imageSpanresource, resourcesstring.length()-1, resourcesstring.length(), 0); 

Tenga en cuenta que he agregado un espacio adicional al viewpager_tab_title y estoy configurando la imagen en esa posición, para que la cadena real se muestre por completo.

Para personalizar SlidingTabLayout de la manera que desee, solo necesita modificar el método populateTabStrip (). Con este enfoque, no necesitas preocuparte por ningún TextView.

 public void populateTabStrip() { final PagerAdapter adapter = mViewPager.getAdapter(); final View.OnClickListener tabClickListener = new TabClickListener(); for (int i = 0; i < adapter.getCount(); i++) { View tabView = null; tabView = LayoutInflater.from(getContext()).inflate(R.layout.tab_layout, mTabStrip, false); ImageView iconImageView = (ImageView) tabView.findViewById(R.id.tab_layout_icon); iconImageView.setImageDrawable(getContext().getResources().getDrawable(getIconResourceArray()[i])); tabView.setOnClickListener(tabClickListener); mTabStrip.addView(tabView); } } 

Tu diseño podría ser algo como eso:

 < ?xml version="1.0" encoding="utf-8"?>    

La forma de implementar el método getResourceArray () depende de usted. Así es como lo hice:

 public class IconSlidingTabLayout extends HorizontalScrollView { private Integer[] mIconResourceArray; ... public Integer[] getIconResourceArray() { return mIconResourceArray; } public void setIconResourceArray(Integer[] mIconResourceArray) { this.mIconResourceArray = mIconResourceArray; } } 

En la actividad:

 mSlidingTabLayout = (IconSlidingTabLayout) findViewById(R.id.icon_sliding_tab_layout); Integer[] iconResourceArray = { R.drawable.news_tab_icon, R.drawable.challenges_tab_icon, R.drawable.trophies_tab_icon, R.drawable.leaderboard_tab_icon }; mSlidingTabLayout.setIconResourceArray(iconResourceArray); 

Tenga en cuenta que para tener acceso a R.layout.tab_layout *, debe importar su paquete.R en lugar de android.R como está predeterminado en SlidingTabStrip.