¿Cómo puedo configurar las pestañas en la parte inferior y también ocultar la barra de acción superior?
En mi aplicación estoy usando las pestañas de la barra de acciones en la parte inferior. He buscado muchos tutoriales pero no estoy entendiendo las soluciones. La mayoría de las respuestas dicen utilizar TabActivity, pero que está en desuso. Así que cualquiera puede decirme cómo puede abordar esto?
- No se cambia el fondo de la barra de herramientas
- Barra de acción Sherlock dropdown spinner divider
- ¿Cómo eliminar el icono de la aplicación de la barra de acción en Android?
- Soporte de ActionBar y GameBaseActivity
- El método setActionBar (Barra de herramientas) en el tipo Actividad no es aplicable para los argumentos (Barra de herramientas)
- Cómo establecer el estado seleccionado del elemento de acción
- Android: necesario android.support.v7.app.ActionBar encontrado android.app.ActionBar
- No muy feliz con la barra de acción de Android ... ¿Cómo puedo reducir su tamaño
- Cómo personalizar la fuente de las pestañas de la barra de acciones
- Acceso a una vista dentro de ActionBar
- Quitar ActionBar en API debajo de 11
- ¿Cómo saber cuándo se amplía el menú de la barra de acción?
- Los botones de acción no aparecen en ActionBar
La mejor manera de implementar las pestañas ahora es usar un TabLayout de la biblioteca de diseño.
Aquí hay un ejemplo de TabLayout alineado en la parte inferior de la pantalla.
Primero configure las dependencias en el archivo build.gradle:
dependencies { compile fileTree(dir: 'libs', include: ['*.jar']) compile 'com.android.support:appcompat-v7:23.0.1' compile 'com.android.support:design:23.0.1' }
Aquí está el xml de la disposición para la actividad principal:
<RelativeLayout android:id="@+id/main_layout" xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" tools:context=".MainActivity"> <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.v4.view.ViewPager android:id="@+id/viewpager" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_below="@id/toolbar"/> <android.support.design.widget.TabLayout android:id="@+id/tab_layout" app:tabMode="fixed" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="?attr/colorPrimary" android:elevation="6dp" app:tabTextColor="#d3d3d3" app:tabSelectedTextColor="#ffffff" app:tabIndicatorColor="#ff00ff" android:minHeight="?attr/actionBarSize" android:layout_alignParentBottom="true" /> </RelativeLayout>
Aquí está el código de la actividad:
public class MainActivity extends AppCompatActivity { @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar); setSupportActionBar(toolbar); // Get the ViewPager and set it's PagerAdapter so that it can display items ViewPager viewPager = (ViewPager) findViewById(R.id.viewpager); PagerAdapter pagerAdapter = new PagerAdapter(getSupportFragmentManager(), MainActivity.this); viewPager.setAdapter(pagerAdapter); // Give the TabLayout the ViewPager TabLayout tabLayout = (TabLayout) findViewById(R.id.tab_layout); tabLayout.setupWithViewPager(viewPager); // Iterate over all tabs and set the custom view for (int i = 0; i < tabLayout.getTabCount(); i++) { TabLayout.Tab tab = tabLayout.getTabAt(i); tab.setCustomView(pagerAdapter.getTabView(i)); } } @Override public boolean onCreateOptionsMenu(Menu menu) { // Inflate the menu; this adds items to the action bar if it is present. 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); } class PagerAdapter extends FragmentPagerAdapter { String tabTitles[] = new String[] { "Tab One", "Tab Two", "Tab Three", }; Context context; public PagerAdapter(FragmentManager fm, Context context) { super(fm); this.context = context; } @Override public int getCount() { return tabTitles.length; } @Override public Fragment getItem(int position) { switch (position) { case 0: return new BlankFragment(); case 1: return new BlankFragment(); case 2: return new MapFragment(); } return null; } @Override public CharSequence getPageTitle(int position) { // Generate title based on item position return tabTitles[position]; } public View getTabView(int position) { View tab = LayoutInflater.from(MainActivity.this).inflate(R.layout.custom_tab, null); TextView tv = (TextView) tab.findViewById(R.id.custom_text); tv.setText(tabTitles[position]); return tab; } } }
custom_tab.xml:
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent"> <TextView android:id="@+id/custom_text" android:layout_width="wrap_content" android:layout_height="match_parent" android:background="?attr/selectableItemBackground" android:gravity="center" android:textSize="16dip" android:textColor="#ffffff" android:singleLine="true" /> </LinearLayout>
Tema de la aplicación en styles.xml:
<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar"> <!-- your app branding color for the app bar --> <item name="colorPrimary">#3F51B5</item> <!-- darker variant for the status bar and contextual app bars --> <item name="colorPrimaryDark">#303F9F</item> <!-- theme UI controls like checkboxes and text fields --> <item name="colorAccent">#FF4081</item> </style>
Resultado:
Si desea ocultar el ActionBar, simplemente quite la barra de herramientas del xml de diseño y quite el código de barra de herramientas de la actividad y asegúrese de usar Theme.AppCompat.Light.NoActionBar
en el AppTheme. El resultado de esos cambios haría que se parezca a esto:
esto es un ejemplo
Toolbar toolbarBottom = (Toolbar) findViewById(R.id.toolbar_bottom); toolbarBottom.setOnMenuItemClickListener(new Toolbar.OnMenuItemClickListener() { @Override public boolean onMenuItemClick(MenuItem item) { switch(item.getItemId()){ case R.id.action_settings: // TODO break; // TODO: Other cases } return true; } }); // Inflate a menu to be displayed in the toolbar toolbarBottom.inflateMenu(R.menu.menu_main);
y este xml
<android.support.v7.widget.Toolbar android:id="@+id/toolbar_bottom" android:layout_height="wrap_content" android:layout_width="match_parent" android:background="?attr/colorPrimary" android:layout_alignParentBottom="true" android:minHeight="?attr/actionBarSize" />
Paso 1 – Cree un diseño personalizado para su barra de herramientas.
<?xml version="1.0" encoding="utf-8"?> <android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:layout_width="match_parent" android:layout_height="wrap_content" app:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar" app:popupTheme="@style/ThemeOverlay.AppCompat.Light"> </android.support.v7.widget.Toolbar>
Paso 2: Incluya este diseño en el diseño de su actividad. Déle la posición inferior.
<include android:id="@+id/toolbar_main" layout="@layout/main_toolbar" />
Paso 3 – Llamar a la barra de herramientas en su actividad y hecho. Se comportará como cualquier barra de herramientas pero situada en la parte inferior.
- Manifiesto Herramientas de fusión: reemplazar no tiene ningún efecto
- Cómo eliminar elementos de arraylist genérico en Android (Java)