Join FlipAndroid.COM Telegram Group: https://t.me/joinchat/F_aqThGkhwcLzmI49vKAiw


ActionBar – vista personalizada con ImageView centrado, Acción Items en los lados

Tengo un requisito para centrar un logotipo de encargo (usando un ImageView) en la barra de acción para la actividad de "casero". Estoy usando el ABS para este proyecto. Esto es muy similar a otra pregunta publicada en SO (el logotipo de ActionBar centrado y los elementos de acción en los lados ), pero no estoy seguro de si el menú ImageView o de búsqueda hace una diferencia, ya que no estoy obteniendo los resultados que estoy buscando Para (una imagen centrada), o si me he equivocado. Básicamente, establezco un icono a la izquierda, inserto la vista personalizada en el centro y tengo un icono de búsqueda a la derecha (OptionsMenu). La imagen aparece un poco a la derecha del icono, pero aún queda de centrado. Cualquier sugerencia sobre cómo centrar un ImageView en la barra de acción sería muy apreciada.

Home.java:

  • Retardo de ActionBar en el título de ocultamiento
  • El botón 'arriba' de ActionBar destruye la actividad de los padres, 'atrás' no
  • ¿Cómo funcionan la nueva Barra de herramientas de Android y la Barra de Acción Contextual?
  • Cambiar el color de la línea en las pestañas - ActionBarSherlock
  • Eliminar título en la barra de herramientas en appcompat-v7
  • Acciones de desbordamiento en ActionBar no mostradas
  • public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_home); LayoutInflater inflater = (LayoutInflater) getSupportActionBar().getThemedContext() .getSystemService(LAYOUT_INFLATER_SERVICE); final View customActionBarView = inflater.inflate( R.layout.actionbar_custom_view_home, null); /* Show the custom action bar view and hide the normal Home icon and title */ final ActionBar actionBar = getSupportActionBar(); actionBar.setHomeButtonEnabled(true); actionBar.setDisplayHomeAsUpEnabled(false); actionBar.setDisplayShowTitleEnabled(false); actionBar.setIcon(R.drawable.ic_ab_som); actionBar.setCustomView(customActionBarView); actionBar.setDisplayShowCustomEnabled(true); } @Override public boolean onCreateOptionsMenu(Menu menu) { MenuInflater inflater = new MenuInflater(this); inflater.inflate(R.menu.search, menu); return true; } 

    Res / layout / actionbar_custom_view_home.xml:

     <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="wrap_content" android:orientation="horizontal" android:layout_gravity="center"> <ImageView android:id="@+id/actionBarLogo" android:contentDescription="@string/application_name" android:layout_width="wrap_content" android:layout_height="wrap_content" android:clickable="false" android:duplicateParentState="false" android:focusable="false" android:longClickable="false" android:padding="@dimen/padding_small" android:src="@drawable/logo_horizontal" /> </LinearLayout> 

    Res / menu / search.xml:

     <?xml version="1.0" encoding="utf-8"?> <menu xmlns:android="http://schemas.android.com/apk/res/android"> <item android:id="@id/search_item" android:icon="?attr/action_search" android:title="@string/search_label" android:showAsAction="ifRoom|collapseActionView"> </item> </menu> 

  • Dropdown Spinner fuera de la barra de acción? (IceCream Sandwich estilo, con ActionBarSherlock)
  • Android ActionBar: mostrar / ocultar las pestañas de forma dinámica?
  • Totalmente transparente ActionBarSherlock utilizando el tema
  • ActionBarCompat - cómo utilizarlo
  • Superposición de la barra de estado de Android con ActionBar
  • Mensaje inusual de logcat mostrado infinitamente - Android
  • 7 Solutions collect form web for “ActionBar – vista personalizada con ImageView centrado, Acción Items en los lados”

    Explicado:

    Introduzca aquí la descripción de la imagen

    El contenedor rosa, es el espacio real donde agregará la vista.

    El truco es hacer algunas matemáticas, para centrar la vista (lo que sea) en el centro.

    En mi caso, la vista era un TextView. Aquí está mi método completo:

     public void addTextToActionBar( String textToSet ) { mActionbar.setDisplayShowCustomEnabled( true ); // Inflate the custom view LayoutInflater inflater = LayoutInflater.from( this ); View header = inflater.inflate( R.layout.actionbar_header, null ); //Here do whatever you need to do with the view (set text if it's a textview or whatever) TextView tv = (TextView) header.findViewById( R.id.program_title ); tv.setText( textToSet ); // Magic happens to center it. int actionBarWidth = DeviceHelper.getDeviceWidth( this ); //Google for this method. Kinda easy. tv.measure( 0, 0 ); int tvSize = tv.getMeasuredWidth(); try { int leftSpace = 0; View homeButton = findViewById( android.R.id.home ); final ViewGroup holder = (ViewGroup) homeButton.getParent(); View firstChild = holder.getChildAt( 0 ); View secondChild = holder.getChildAt( 1 ); leftSpace = firstChild.getWidth()+secondChild.getWidth(); } catch ( Exception ignored ) {} mActionbar.setCustomView( header ); if ( null != header ) { ActionBar.LayoutParams params = (ActionBar.LayoutParams) header.getLayoutParams(); if ( null != params ) { int leftMargin = ( actionBarWidth / 2 - ( leftSpace ) ) - ( tvSize / 2 ) ; params.leftMargin = 0 >= leftMargin ? 0 : leftMargin; } } } 

    Diseño:

     <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="wrap_content" android:gravity="center_horizontal|center_vertical|center" android:orientation="horizontal" > <TextView android:id="@+id/program_title" android:layout_width="wrap_content" android:layout_height="wrap_content" android:textColor="@android:color/white" android:contentDescription="@string/content_description_program_title" android:ellipsize="end" android:maxLines="1" android:textSize="22sp"/> </RelativeLayout> 

    Disfrutar.

    Si desea que imageview en el Centro de ActionBar, utilice:

    Introduzca aquí la descripción de la imagen

    Acaba de reemplazar getActionBar(); A getSupportActionBar(); Debajo del código

     public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); final ActionBar actionBar = getActionBar(); actionBar.setCustomView(R.layout.actionbar_custom_view_home); actionBar.setDisplayShowTitleEnabled(false); actionBar.setDisplayShowCustomEnabled(true); } @Override public boolean onCreateOptionsMenu(Menu menu) { getMenuInflater().inflate(R.menu.activity_main, menu); return true; } 

    Tu actionbar_custom_view_home.xml

     <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="wrap_content" android:gravity="center" android:orientation="horizontal" > <ImageView android:id="@+id/actionBarLogo" android:layout_width="wrap_content" android:layout_height="wrap_content" android:clickable="false" android:focusable="false" android:longClickable="false" android:src="@drawable/ic_launcher" /> </LinearLayout> 

    Ocultar Icono de Acción

    Introduzca aquí la descripción de la imagen

     final ActionBar actionBar = getActionBar(); actionBar.setCustomView(R.layout.actionbar_custom_view_home); actionBar.setDisplayShowTitleEnabled(false); actionBar.setDisplayShowCustomEnabled(true); actionBar.setDisplayUseLogoEnabled(false); actionBar.setDisplayShowHomeEnabled(false); 

    Nota: para <11 API use getSupportActionBar () y> 11 API use getActionBar ()


    EDITADO: 02/03/16 para la barra de herramientas

     <android.support.v7.widget.Toolbar style="@style/ToolBarStyle" xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="?attr/colorPrimary" android:minHeight="@dimen/abc_action_bar_default_height_material"> <ImageView android:layout_width="wrap_content" android:contentDescription="@string/logo" android:layout_height="wrap_content" android:layout_gravity="center" android:src="@drawable/ic_launcher"/> </android.support.v7.widget.Toolbar> 

    He encontrado este problema, aquí está mi solución:

      ActionBar.LayoutParams layoutParams = new ActionBar.LayoutParams(ActionBar.LayoutParams.MATCH_PARENT, ActionBar.LayoutParams.MATCH_PARENT); layoutParams.gravity = Gravity.CENTER_HORIZONTAL|Gravity.CENTER_HORIZONTAL; actionBar.setCustomView(yourCustomView,layoutParams); 

    ImageView en su código está centrado en relación con el LinearLayout, no a la barra de acción. Puede agregar margen izquierdo (android: layout_marginLeft) al diseño para ajustar la posición de la imagen.

    Otra forma de hacerlo es no agregar un ícono y elementos de acción a la barra de acciones, sino usar un diseño personalizado con el icono y los botones dentro. Pero usted tendrá que manejar los elementos de acción usted mismo en ese caso.

    Llegar tarde a la fiesta, pero en caso de que ayude a otra persona – utilice una lista de capas y establecer como fondo. De lo contrario, el logotipo se centrará en función del espacio restante, no toda la barra de herramientas como indica Reinherd.

    Puede usar una lista de capas con un color de fondo estático y una imagen con gravedad configurada para centrarse como se muestra a continuación. ¡Espero eso ayude!

    Toolbar.axml

     <android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto" android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="?attr/actionBarSize" android:background="@drawable/toolbar_background" android:theme="@style/ThemeOverlay.AppCompat.Dark" app:popupTheme="@style/ThemeOverlay.AppCompat.Light" app:layout_scrollFlags="scroll|enterAlways" app:layout_collapseMode="pin"> </android.support.v7.widget.Toolbar> 

    Toolbar_background.xml

     <layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <item> <shape android:shape="rectangle"> <solid android:color="@color/colorPrimary" /> </shape> </item> <item> <bitmap android:src="@drawable/logo" android:gravity="center" /> </item> </layer-list> 

    Me enfrento con el mismo problema y sugiero la siguiente solución:

    1. En su res / layout / actionbar_custom_view_home.xml cambiar el ancho del diseño a wrap_content:

       android:layout_width="wrap_content" 
    2. Obtenga la anchura de la barra de acción de la siguiente manera:

       Display display = getWindowManager().getDefaultDisplay(); Point size = new Point(); display.getSize(size); //width of action bar is the same as width of whole screen final int actionBarWidth = size.x; 
    3. Agregue layoutListener a su customActionBarView:

       customActionBarView.addOnLayoutChangeListener( new OnLayoutChangeListener() { @Override public void onGlobalLayout() { float x = customActionBarView.getX(); int logoImageWidth = imageLogo.getWidth(); int logoPosition = actionBarWidth / 2 - logoImageWidth / 2; if (x != logoPosition) { customActionBarView.setX(logoPosition); customActionBarView.requestLayout(); } else { customActionBarView.removeOnLayoutChangeListener(this); } } } ); 

    Lo único que encontré trabajando es poner (poner a la derecha oa la izquierda según sea necesario, o ambos):

     android:layout_marginLeft|Right="?attr/actionBarSize" 

    Que encontré aquí: http://sourcey.com/android-custom-centered-actionbar-with-material-design/

    FlipAndroid es un fan de Google para Android, Todo sobre Android Phones, Android Wear, Android Dev y Aplicaciones para Android Aplicaciones.