¿Cómo mostrar la vista personalizada en ActionBar?


92

Quiero mostrar la búsqueda personalizada en la barra de acciones (estoy usando ActionBarSherlock para eso).

Lo tengo:

ingrese la descripción de la imagen aquí

Pero quiero hacer un diseño personalizado (campo de texto de edición) para que ocupe todo el ancho disponible.

Implementé un diseño personalizado como se sugiere aquí .

Ahí está mi diseño personalizado search.xml:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    style="?attr/actionButtonStyle"
    android:layout_width="fill_parent"
    android:layout_height="match_parent"
    android:layout_gravity="fill_horizontal"
    android:focusable="true" >

    <FrameLayout
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center_vertical|fill_horizontal" >

        <EditText
            android:id="@+id/search_query"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="left|center"
            android:background="@drawable/bg_search_edit_text"
            android:imeOptions="actionSearch"
            android:inputType="text" />

        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="right|center_vertical"
            android:src="@drawable/ic_search_arrow" />

    </FrameLayout>

</LinearLayout>

Y en MyActivity:

ActionBar actionBar = getSupportActionBar();
actionBar.setDisplayHomeAsUpEnabled(true);
actionBar.setDisplayShowCustomEnabled(true);
actionBar.setDisplayShowTitleEnabled(false);
actionBar.setIcon(R.drawable.ic_action_search);

LayoutInflater inflator = (LayoutInflater) this .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View v = inflator.inflate(R.layout.search, null);

actionBar.setCustomView(v);

¿Cómo puedo hacer un diseño personalizado para ocupar todo el ancho disponible actionBar?

Ayuda por favor.


¿Puede establecer el título con una vista personalizada?
Roy Lee

Respuestas:


95

Hay un truco para esto. Todo lo que tienes que hacer es usarlo en RelativeLayoutlugar de LinearLayoutcomo contenedor principal. Es importante haberse android:layout_gravity="fill_horizontal"preparado para ello. Deberias hacer eso.


3
@Tomik ¿Podrías echar un vistazo a mi escenario? stackoverflow.com/questions/16516306/… Me falta un título después de configurar la vista personalizada.
Roy Lee

36

Luché con esto yo mismo e intenté la respuesta de Tomik. Sin embargo, esto no hizo que el diseño tuviera el ancho completo disponible al inicio, solo cuando agrega algo a la vista.

Deberá configurar el LayoutParams.FILL_PARENTal agregar la vista:

//I'm using actionbarsherlock, but it's the same.
LayoutParams layout = new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT);
getSupportActionBar().setCustomView(overlay, layout); 

De esta forma llena completamente el espacio disponible. (Es posible que también deba utilizar la solución de Tomik).


2
+1, en realidad, solo funcionó para mí después de agregar LayoutParams, gracias
Mahmoud Badri

1
¿Cuál es el valor de superposición?
androidevil

2
@androider es tu vista personalizada. Ya sea inflado desde xml o creado en código.
Bilthon

8

Así es como funcionó para mí (de las respuestas anteriores, mostraba tanto el título predeterminado como mi vista personalizada también).

ActionBar.LayoutParams layout = new ActionBar.LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT);
// actionBar.setCustomView(view); //last view item must set to android:layout_alignParentRight="true" if few views are there 
actionBar.setCustomView(view, layout); // layout param width=fill/match parent
actionBar.setDisplayShowCustomEnabled(true);//must other wise its not showing custom view.

Lo que he notado es que tanto setCustomView(view)y setCustomView(view,params)la vista width = partido / padre de relleno. setDisplayShowCustomEnabled (boolean showCustom)


6

Las respuestas de Tomik y Peterdk funcionan cuando desea que su vista personalizada ocupe toda la barra de acciones, incluso ocultando el título nativo.

Pero si desea que su vista personalizada viva lado a lado con el título (y llene todo el espacio restante después de que se muestre el título), puedo referirlo a la excelente respuesta del usuario Android-Developer aquí:

https://stackoverflow.com/a/16517395/614880

Su código en la parte inferior funcionó perfectamente para mí.


3

Por ejemplo, puede definir un archivo de diseño que contenga un elemento EditText.

<?xml version="1.0" encoding="utf-8"?>
<EditText xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/searchfield"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:inputType="textFilter" >

</EditText> 

tu puedes hacer

public class MainActivity extends Activity {

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    ActionBar actionBar = getActionBar();
    // add the custom view to the action bar
    actionBar.setCustomView(R.layout.actionbar_view);
    EditText search = (EditText) actionBar.getCustomView().findViewById(R.id.searchfield);
    search.setOnEditorActionListener(new OnEditorActionListener() {

      @Override
      public boolean onEditorAction(TextView v, int actionId,
          KeyEvent event) {
        Toast.makeText(MainActivity.this, "Search triggered",
            Toast.LENGTH_LONG).show();
        return false;
      }
    });
    actionBar.setDisplayOptions(ActionBar.DISPLAY_SHOW_CUSTOM
        | ActionBar.DISPLAY_SHOW_HOME);


    }

salvé mis n horas .. Gracias
CrazyMind

1

Hay un ejemplo en la aplicación de inicio de Android (que he creado una biblioteca con ella, aquí), dentro de la clase que maneja la selección de fondos de pantalla ("WallpaperPickerActivity").

El ejemplo muestra que debe configurar un tema personalizado para que esto funcione. Lamentablemente, esto funcionó para mí solo usando el marco normal, y no el de la biblioteca de soporte.

Estos son los temas:

styles.xml

 <style name="Theme.WallpaperPicker" parent="Theme.WallpaperCropper">
    <item name="android:windowBackground">@android:color/transparent</item>
    <item name="android:colorBackgroundCacheHint">@null</item>
    <item name="android:windowShowWallpaper">true</item>
  </style>

  <style name="Theme.WallpaperCropper" parent="@android:style/Theme.DeviceDefault">
    <item name="android:actionBarStyle">@style/WallpaperCropperActionBar</item>
    <item name="android:windowFullscreen">true</item>
    <item name="android:windowActionBarOverlay">true</item>
  </style>

  <style name="WallpaperCropperActionBar" parent="@android:style/Widget.DeviceDefault.ActionBar">
    <item name="android:displayOptions">showCustom</item>
    <item name="android:background">#88000000</item>
  </style>

valor-v19 / styles.xml

 <style name="Theme.WallpaperCropper" parent="@android:style/Theme.DeviceDefault">
    <item name="android:actionBarStyle">@style/WallpaperCropperActionBar</item>
    <item name="android:windowFullscreen">true</item>
    <item name="android:windowActionBarOverlay">true</item>
    <item name="android:windowTranslucentNavigation">true</item>
  </style>

  <style name="Theme" parent="@android:style/Theme.DeviceDefault.Wallpaper.NoTitleBar">
    <item name="android:windowTranslucentStatus">true</item>
    <item name="android:windowTranslucentNavigation">true</item>
  </style>

EDITAR: hay una mejor manera de hacerlo, que también funciona en la biblioteca de soporte. Simplemente agregue esta línea de código en lugar de lo que he escrito anteriormente:

getSupportActionBar().setDisplayShowCustomEnabled(true);
Al usar nuestro sitio, usted reconoce que ha leído y comprende nuestra Política de Cookies y Política de Privacidad.
Licensed under cc by-sa 3.0 with attribution required.