programacion - ¿Cómo hacer una pestaña desplazable en Android?

manual de android en pdf

Question

Tengo 9 pestañas pero en modo de relleno. Quiero hacer que estos thabs sean desplazables. Pero no sé el truco. Intenté muchos métodos, pero aún nada.

Mi actividad :

 package com.bani.fragment2;
import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v4.view.PagerAdapter;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.support.v7.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;
import android.view.WindowManager;
public class MainActivity extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
this.getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,
WindowManager.LayoutParams.FLAG_FULLSCREEN);
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
final Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
toolbar.setTitle("Fragment 1");
setSupportActionBar(toolbar);
TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout);
tabLayout.addTab(tabLayout.newTab().setText("Tab 1"));
tabLayout.addTab(tabLayout.newTab().setText("Tab 2"));
tabLayout.addTab(tabLayout.newTab().setText("Tab 3"));
tabLayout.addTab(tabLayout.newTab().setText("Tab 4"));
tabLayout.addTab(tabLayout.newTab().setText("Tab 5"));
tabLayout.addTab(tabLayout.newTab().setText("Tab 6"));
tabLayout.addTab(tabLayout.newTab().setText("Tab 7"));
tabLayout.addTab(tabLayout.newTab().setText("Tab 8"));
tabLayout.addTab(tabLayout.newTab().setText("Tab 9"));
tabLayout.setTabGravity(TabLayout.GRAVITY_CENTER);
final ViewPager viewPager = (ViewPager) findViewById(R.id.pager);
final PagerAdapter adapter = new PageAdapter(getSupportFragmentManager(), tabLayout.getTabCount());
viewPager.setAdapter(adapter);
viewPager.addOnPageChangeListener(new TabLayout.TabLayoutOnPageChangeListener(tabLayout));
tabLayout.setOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
@Override
public void onTabSelected(TabLayout.Tab tab) {
switch(tab.getPosition()) {
case 0:
viewPager.setCurrentItem(0);
toolbar.setTitle("Fragment 1");
break;
case 1:
viewPager.setCurrentItem(1);
toolbar.setTitle("Fragment 2");
break;
case 2:
viewPager.setCurrentItem(2);
toolbar.setTitle("Fragment 3");
break;
case 3:
viewPager.setCurrentItem(3);
toolbar.setTitle("Fragment 4");
break;
case 4:
viewPager.setCurrentItem(4);
toolbar.setTitle("Fragment 5");
break;
case 5:
viewPager.setCurrentItem(5);
toolbar.setTitle("Fragment 6");
break;
case 6:
viewPager.setCurrentItem(6);
toolbar.setTitle("Fragment 7");
break;
case 7:
viewPager.setCurrentItem(7);
toolbar.setTitle("Fragment 8");
break;
case 8:
viewPager.setCurrentItem(8);
toolbar.setTitle("Fragment 9");
break;
default:
viewPager.setCurrentItem(tab.getPosition());
toolbar.setTitle("Fragment 1");
break;
}
}
@Override
public void onTabUnselected(TabLayout.Tab tab) {
}
@Override
public void onTabReselected(TabLayout.Tab tab) {
}
});
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.menu_main, menu);
return true;
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
int id = item.getItemId();
if (id == R.id.action_settings) {
return true;
}
return super.onOptionsItemSelected(item);
}
}

Y este es mi diseño con pestaña:

<android.support.v7.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:background="?attr/colorPrimary"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
app:popupTheme="@style/ThemeOverlay.AppCompat.Light"/>
<android.support.design.widget.TabLayout
android:id="@+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="@+id/toolbar"
android:background="?attr/colorPrimary"
android:elevation="6dp"
android:minHeight="?attr/actionBarSize"
android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"/>
<android.support.v4.view.ViewPager
android:id="@+id/pager"
android:layout_width="match_parent"
android:layout_height="fill_parent"
android:layout_below="@id/tab_layout"/>
</RelativeLayout>

Por favor, ayúdame a resolver mi problema, traté de configurar la gravedad de tabulación en MODE_SCROLLABLE y de otra manera, pero todavía no funcionaba para mí.

Answer 1

Intenté establecer la gravedad de tabulación en MODE_SCROLLABLE

Eso no es un valor de gravedad. Ese es un valor que se setTabMode() a setTabMode() en el TabLayout ( tabs.setTabMode(TabLayout.MODE_SCROLLABLE) ).

Este proyecto de ejemplo de este libro tiene una actividad que alterna entre tres pestañas fijas y diez pestañas desplazables:

/***
Copyright (c) 2012-15 CommonsWare, LLC
Licensed under the Apache License, Version 2.0 (the "License"); you may not
use this file except in compliance with the License. You may obtain a copy
of the License at http://www.apache.org/licenses/LICENSE-2.0. Unless required
by applicable law or agreed to in writing, software distributed under the
License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS
OF ANY KIND, either express or implied. See the License for the specific
language governing permissions and limitations under the License.
From _The Busy Coder''s Guide to Android Development_
https://commonsware.com/Android
*/
package com.commonsware.android.tablayout;
import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v4.view.ViewPager;
import android.support.v7.app.AppCompatActivity;
import android.view.Menu;
import android.view.MenuItem;
public class MainActivity extends AppCompatActivity {
private SampleAdapter adapter;
private TabLayout tabs;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
ViewPager pager=(ViewPager)findViewById(R.id.pager);
adapter=new SampleAdapter(this, getSupportFragmentManager());
pager.setAdapter(adapter);
tabs=(TabLayout)findViewById(R.id.tabs);
tabs.setupWithViewPager(pager);
tabs.setTabMode(TabLayout.MODE_FIXED);
}
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.actions, menu);
return(super.onCreateOptionsMenu(menu));
}
@Override
public boolean onOptionsItemSelected(MenuItem item) {
if (item.getItemId()==R.id.fixed) {
item.setChecked(!item.isChecked());
if (item.isChecked()) {
adapter.setPageCount(3);
tabs.setTabMode(TabLayout.MODE_FIXED);
}
else {
adapter.setPageCount(10);
tabs.setTabMode(TabLayout.MODE_SCROLLABLE);
}
adapter.notifyDataSetChanged();
tabs.setTabsFromPagerAdapter(adapter);
return(true);
}
return(super.onOptionsItemSelected(item));
}
}

Answer 2

Establezca el valor de setTabMode en TabLayout.MODE_SCROLLABLE

tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE);

Y, podrá desplazar las pestañas horizontalmente.

Answer 3

Simplemente ponga la app:tabMode="scrollable" dentro del xml.

por ejemplo:

<android.support.design.widget.TabLayout
android:id="@+id/tabs"
android:background="@color/colorPrimary"
app:tabMode="scrollable"
app:tabTextColor="#ccc"
app:tabIndicatorColor="@android:color/white"
app:tabSelectedTextColor="@android:color/white"
android:layout_width="match_parent"
android:layout_height="40dp" />