Android de ancho total del ICS estilo minimalista inferior ButtonsViews

Question

quiero hacer algunos botones que se ven así lo siguiente:

He mirado bastante difícil para los ICS preestablecidos en el paquete android.widget, pero no puedo no encuentra ninguno Me imagino que tiene que haber una manera fácil, ya que parecen ser temáticas de toda la versión del sistema operativo. Si alguien sabe de una manera de hacer que los botones se vean así, sería una feliz campista.

Answer 1

En caso de que esté buscando el diseño XML del botón de Android ICS como el de la siguiente captura de pantalla, aquí está el diseño XML que encontré en el código fuente del sistema operativo Android.

<!-- Copyright (C) 2008 The Android Open Source Project 

    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. 
--> 

<!-- OK confirm and cancel buttons. --> 
<LinearLayout 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:orientation="vertical" 
     android:divider="?android:attr/dividerHorizontal" 
     android:showDividers="beginning" 
     android:paddingTop="16dip"> 

    <LinearLayout 
      style="?android:attr/buttonBarStyle" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:orientation="horizontal" 
      android:measureWithLargestChild="true"> 

     <LinearLayout android:id="@+id/leftSpacer" 
       android:layout_weight="0.25" 
       android:layout_width="0dip" 
       android:layout_height="wrap_content" 
       android:orientation="horizontal" 
       android:visibility="gone" /> 

     <Button android:id="@+id/cancel_button" 
       android:layout_width="0dip" 
       android:layout_height="wrap_content" 
       android:layout_gravity="left" 
       android:layout_weight="1" 
       android:text="@string/cancel" 
       android:maxLines="2" 
       style="?android:attr/buttonBarButtonStyle" /> 

     <Button android:id="@+id/ok_button" 
       android:layout_width="0dip" 
       android:layout_height="wrap_content" 
       android:layout_gravity="right" 
       android:layout_weight="1" 
       android:text="@string/install" 
       android:maxLines="2" 
       android:filterTouchesWhenObscured="true" 
       style="?android:attr/buttonBarButtonStyle" /> 

     <LinearLayout android:id="@+id/rightSpacer" 
       android:layout_width="0dip" 
       android:layout_weight="0.25" 
       android:layout_height="wrap_content" 
       android:orientation="horizontal" 
       android:visibility="gone" /> 

    </LinearLayout> 
</LinearLayout> 

Answer 2

Si desea hacerlo en todos los dispositivos (y versiones de Android), básicamente desea un botón sin fondo o un fondo sólido con bordes en la parte superior e inferior.

La única manera de agregar bordes correctamente en Android es usar la herramienta que viene con el SDK de Android o ADT llamado draw9patch. Es una pequeña herramienta simple que hará el trabajo. Si necesita ayuda para usarlo, la mejor opción es buscar un video de YouTube, ya que puede ser difícil de usar la primera vez.

Draw 9-patch

Answer 3

estado jugando un poco con respecto a esta cuestión. Hice una solución basada en linearLayouts con vistas de 1dp como separadores y fondo transparente para obtener el aspecto de minimalismo en los botones.

queremos que los botones para cambiar apariencia dependiendo del estado del botón. (Más sobre esto aquí hello form stuff tutorial). Cambiamos el color de fondo para que el usuario obtenga una indicación al presionar el botón.

borderless_background.xml (va en la carpeta estirable)

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

    <item android:state_pressed="true"> 
     <shape> 
      <solid android:color="#33b5e5" /> 
     </shape> 
    </item> 

    <item android:state_focused="true"> 
     <shape> 
      <solid android:color="#0099cc" /> 
     </shape> 
    </item> 

    <item> 
     <shape> 
      <solid android:color="@android:color/transparent" /> 
     </shape> 
    </item> 

</selector> 

El main.xml A continuación, utilizar el archivo borderless_background, consulte el androide: Etiqueta de fondo de los botones en el siguiente código

<?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="fill_parent" 
    android:padding="8dp" 
    android:orientation="vertical" 
> 

    <TextView 
     android:layout_width="fill_parent" 
     android:layout_height="0dp" 
     android:gravity="center" 
     android:layout_weight="1.0" 
     android:textSize="14sp" 
     android:text="@string/borderless" /> 

    <TextView 
     android:id="@+id/textView1" 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_marginBottom="8dp" 
     android:textSize="12sp" 
     android:autoLink="web" 
     android:text="@string/source1" /> 

    <View 
     android:id="@+id/horizontal_divider1" 
     android:layout_width="fill_parent" 
     android:layout_height="1dp" 
     android:background="@android:color/darker_gray" /> 

    <LinearLayout 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
    > 

     <Button 
      android:id="@+id/button1" 
      android:layout_width="wrap_content" 
      android:layout_height="48dp" 
      android:layout_weight="1.0" 
      android:background="@drawable/borderless_background" 
      android:textColor="@android:color/white" 
      android:textSize="16sp" 
      android:text="Cancel" 
      android:onClick="cancel" /> 

     <View 
      android:id="@+id/vertical_divider" 
      android:layout_width="1dip" 
      android:layout_marginTop="8dp" 
      android:layout_marginBottom="8dp" 
      android:layout_height="fill_parent" 
      android:background="@android:color/darker_gray" /> 

     <Button 
      android:id="@+id/button2" 
      android:layout_width="wrap_content" 
      android:layout_height="48dp" 
      android:layout_weight="1.0" 
      android:background="@drawable/borderless_background" 
      android:textColor="@android:color/white" 
      android:textSize="16sp" 
      android:text="Next" 
      android:onClick="next" /> 
    </LinearLayout> 

    <View 
     android:id="@+id/horizontal_divider2" 
     android:layout_width="fill_parent" 
     android:layout_height="1dp" 
     android:background="@android:color/darker_gray" /> 

</LinearLayout> 

Hay advertencias sobre el rendimiento debido a los layuots lineales anidados, pero las cosas funcionan bien en la tableta que probé, por lo que soy demasiado flojo para arreglar esto. Una solución probablemente se basaría en el diseño relativo o en el diseño de la cuadrícula.

Answer 4

He encontrado una solución muy sencilla que:

• añade iconos transparentes
• tiene un borde superior horizontal
• tiene un divisor vertical entre cada botón
• no tiene borde inferior

Fuente: https://gist.github.com/2373644

contenido:

<!-- 
    A button bar is a set of buttons at the bottom of an activity. 
    An example is an AlertDialog with OK/Cancel buttons. 

    Note that something similar can be accomplished using a 
    split action bar and text-only action buttons, but this is an 
    alternate presentation that's often preferred. 
--> 
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:orientation="vertical" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:divider="?android:attr/dividerHorizontal" 
    android:showDividers="middle"> 

    <TextView android:layout_width="match_parent" 
     android:layout_height="0dp" 
     android:layout_weight="1" 
     android:gravity="center" 
     android:text="Hello World" /> 

    <LinearLayout style="?android:attr/buttonBarStyle" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     android:orientation="horizontal"> 

     <Button style="?android:attr/buttonBarButtonStyle" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" 
      android:text="One" /> 

     <Button style="?android:attr/buttonBarButtonStyle" 
      android:layout_width="0dp" 
      android:layout_height="wrap_content" 
      android:layout_weight="1" 
      android:text="Two" /> 
    </LinearLayout> 
</LinearLayout>