2012-07-10 40 views
5

enter image description hereAndroid ActionBarSherlock Top Bar

Quiero tener una barra de acción como Foursquare. Lo que quiero es pestañas como Friends, Explore y Me. Además, sobre las pestañas deseo tener un diseño personalizado que incluya algunos botones, como , logotipo de foursquare, Refrescar y Check-In en foursquare. Creé pestañas, pero no pude cambiar el diseño de las pestañas de ActionBarSherlock. ¿Como puedó resolver esté problema?

+0

¿Podría proporcionarnos una imagen impresa de la aplicación de Foursquare? – ninetwozero

+0

Agregué el ps de foursquare. – BCK

+0

Estoy bastante seguro de que utilizan una implementación personal de la barra, y no están utilizando ActionBarSherlock. –

Respuesta

7

Para lograr un estilo Cuadrangular, no necesita pensar en crear un diseño sobre las pestañas. Al utilizar actionbar Sherlock sólo tiene que preocuparse por:

  1. Hacer un fondo para la barra superior
  2. Haciendo un logotipo de la barra superior
  3. añadir elementos en un archivo menu.xml que ActionBarSherlock utilizará para llene la sección superior con Botones (siempre que un estilo que utiliza el estilo de Sherlock de la barra de acciones se adjunte a la actividad).

lo tanto, para 1. y 2. Es todo acerca del uso de archivos styles.xml (debe residir en la carpeta de los valores en la res carpeta), así:

<style name="Theme.Example" parent="Theme.Sherlock"> 
    <item name="actionBarStyle">@style/Widget.Styled.ActionBar</item> 
    <item name="absForceOverflow">true</item>  
</style> 

<style name="Widget.Styled.ActionBar" parent="Widget.Sherlock.ActionBar.Solid"> 
    <item name="background">@drawable/actionbar_background</item> <-- the background for top bar 
    <item name="icon">@drawable/actionbar_logo</item> <-- the logo that goes top left in the top bar 
    <item name="backgroundSplit">@drawable/bg_striped_split</item> <-- the image used between the menu items 
</style> 

Para 3. todo lo que necesita que hacer es crear elementos de menú bajo menu.xml (debe residir en la carpeta del menú (si no existe, crear uno en la carpeta res)):

<?xml version="1.0" encoding="utf-8"?> 
<menu xmlns:android="http://schemas.android.com/apk/res/android">  

<item android:id="@+id/menu_prefs" 
     android:icon="@drawable/settings_icon" 
     android:title="Preferences" 
     android:showAsAction="ifRoom" /> 
</menu> 

lo último que hay que hacer para ver los elementos de menú es utilizar estas funciones en la actividad:

@Override 
public boolean onCreateOptionsMenu(Menu menu) { 
    MenuInflater inflater = getSupportMenuInflater(); 
    inflater.inflate(R.menu.menu, menu); 
    return true; 
} 

public boolean onOptionsItemSelected (MenuItem item) { 

    Intent intent; 

    switch (item.getItemId()) 
    { 
    case R.id.menu_prefs: 

     // Launch Preference Activity 
     intent = new Intent(getBaseContext(), Preferences.class);   
     startActivity(intent); 
     break; 
    } 

    return false; 
} 
+0

Gracias por su respuesta. – BCK

+0

Hay otro problema, debido a su código, deseo tener ListNavigation o ActionMode cuando haga clic en menu_prefs. Además, hay una pestaña. ¿Cómo puedo gestionar esto? – BCK

+0

@Richard Lewin: al usar el ejemplo anterior, la navegación superior "azul" aparece debajo de mis pestañas, ¿alguna idea de por qué y cómo obtenerla arriba? También cuando se ajardina, la barra superior colapsa en las pestañas, de todos modos, para forzarla a mantenerse en la parte superior. – bMon

3

Para establecer los elementos de acción personalizados (actualizar, registrar, ...) debe anular en Crear menú de opciones (Menú menú) y establecer su menú personalizado.

por ejemplo:

menú Archivo/my_menu.xml

<?xml version="1.0" encoding="utf-8"?> 
<menu xmlns:android="http://schemas.android.com/apk/res/android" > 

    <item 
     android:id="@+id/refresh" 
     android:icon="@drawable/ic_menu_refresh" 
     android:title="refresh" 
     android:showAsAction="always"> 
    </item> 

</menu> 

Luego, en su actividad (o fragmento):

@Override 
public boolean onCreateOptionsMenu(Menu menu) 
{ 
    MenuInflater inflater = getSupportMenuInflater(); 
    inflater.inflate(R.menu.my_menu, menu); 

    // Allow activity and fragments to add items 
    super.onCreateOptionsMenu(menu); 

    return true; 
} 

Y para ser notificado cuando son seleccionados, simplemente anulación onOptionsItemSelected (Elemento de elemento de menú):

@Override 
public boolean onOptionsItemSelected(MenuItem item) 
{ 
    switch (item.getItemId()) 
    { 
    case android.R.id.refresh : 
     // refresh your data... 
     return true; 

    default : 
     return super.onOptionsItemSelected(item); 
    } 
} 
+0

Gracias por su respuesta. – BCK

+0

@Chinaski - Lo mismo que arriba: Cuando utilizo el ejemplo anterior, la navegación superior "azul" aparece debajo de mis pestañas, ¿alguna idea de por qué y cómo obtenerla arriba? También cuando se ajardina, la barra superior colapsa en las pestañas, de todos modos, para forzarla a mantenerse en la parte superior. – bMon

Cuestiones relacionadas