¿Cómo crear botones sin bordes estándar (como en la guía de diseño mencionada)?

Solo estaba revisando las pautas de diseño y preguntándome sobre los botones sin bordes. Busqué con los ojos abiertos y traté de encontrar la fuente, pero no puedo reunirla por mí mismo. ¿Es este el widget de botón normal, pero agrega un estilo personalizado (predeterminado de Android)? ¿Cómo hacer estos botones sin bordes (por supuesto, puede configurar el fondo en vacío, pero luego no tengo el divisor)?

Aquí enlaces a las pautas de diseño:

• http://developer.android.com/design/building-blocks/buttons.html
• http://developer.android.com/guide/topics/ui/controls/button.html#Borderless

Para aclarar alguna confusión:

Esto se hace en 2 pasos: Establecer el atributo de fondo del botón en android: attr / selectableItemBackground crea un botón con comentarios pero sin fondo.

android:background="?android:attr/selectableItemBackground"

La línea para dividir el botón sin bordes del resto de su diseño se realiza mediante una vista con el fondo android: attr / dividerVertical

android:background="?android:attr/dividerVertical"

Para una mejor comprensión, aquí hay un diseño para una combinación de botones sin bordes Aceptar / Cancelar en la parte inferior de la pantalla (como en la imagen de la derecha arriba).

<RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="48dp"
        android:layout_alignParentBottom="true">
        <View
            android:layout_width="match_parent"
            android:layout_height="1dip"
            android:layout_marginLeft="4dip"
            android:layout_marginRight="4dip"
            android:background="?android:attr/dividerVertical"
            android:layout_alignParentTop="true"/>
        <View
            android:id="@+id/ViewColorPickerHelper"
            android:layout_width="1dip"
            android:layout_height="wrap_content"
            android:layout_alignParentTop="true"
            android:layout_alignParentBottom="true"
            android:layout_marginBottom="4dip"
            android:layout_marginTop="4dip"
            android:background="?android:attr/dividerVertical" 
            android:layout_centerHorizontal="true"/>
        <Button
            android:id="@+id/BtnColorPickerCancel"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_alignParentTop="true"
            android:layout_toLeftOf="@id/ViewColorPickerHelper"
            android:background="?android:attr/selectableItemBackground"
            android:text="@android:string/cancel" 
            android:layout_alignParentBottom="true"/>
        <Button
            android:id="@+id/BtnColorPickerOk"
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:layout_alignParentRight="true"
            android:layout_alignParentTop="true"
            android:background="?android:attr/selectableItemBackground"
            android:text="@android:string/ok" 
            android:layout_alignParentBottom="true" 
            android:layout_toRightOf="@id/ViewColorPickerHelper"/>
    </RelativeLayout>

Simplemente agregue el siguiente atributo de estilo en su Buttonetiqueta:

    style="?android:attr/borderlessButtonStyle"

fuente: http://developer.android.com/guide/topics/ui/controls/button.html#Borderless

Luego, puede agregar divisores como en la respuesta de Karl .

Respuesta tardía, pero muchas opiniones. Como las API <11 aún no están muertas, para los interesados ​​aquí hay un truco.

Deje que su recipiente tenga el color deseado (puede ser transparente). Luego, dale a tus botones un selector con color transparente predeterminado y algo de color cuando se presionan. De esa manera, tendrá un botón transparente, pero cambiará de color cuando lo presione (como el de holo). También puede agregar alguna animación (como holo's). El selector debería ser algo como esto:

res/drawable/selector_transparent_button.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android" 
          android:exitFadeDuration="@android:integer/config_shortAnimTime">
     <item android:state_pressed="true"
         android:drawable="@color/blue" />

   <item android:drawable="@color/transparent" />
</selector>

Y el botón debería tener android:background="@drawable/selector_transparent_button"

PD: deja que tu contenedor tenga los divisores ( android:divider='@android:drawable/...para API <11)

PD [novatos]: debes definir esos colores en values ​​/ colors.xml

Para el que quiere botones sin bordes pero aún animados cuando se hace clic. Agregue esto en el botón.

style="?android:attr/borderlessButtonStyle"

Si quisieras un divisor / línea entre ellos. Agregue esto en el diseño lineal.

style="?android:buttonBarStyle"

Resumen

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   android:layout_width="fill_parent"
   android:layout_height="wrap_content"
   android:orientation="horizontal"
   style="?android:buttonBarStyle">

    <Button
        android:id="@+id/add"
        android:layout_weight="1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/add_dialog" 
        style="?android:attr/borderlessButtonStyle"
        />

    <Button
        android:id="@+id/cancel"
        android:layout_weight="1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/cancel_dialog" 
        style="?android:attr/borderlessButtonStyle"
        />

</LinearLayout>

Para el estilo del material, agregue style="@style/Widget.AppCompat.Button.Borderless"cuando use la biblioteca AppCompat.

De la fuente de la aplicación iosched se me ocurrió esta ButtonBarclase:

/**
 * An extremely simple {@link LinearLayout} descendant that simply reverses the 
 * order of its child views on Android 4.0+. The reason for this is that on 
 * Android 4.0+, negative buttons should be shown to the left of positive buttons.
 */
public class ButtonBar extends LinearLayout {

    public ButtonBar(Context context) {
        super(context);
    }

    public ButtonBar(Context context, AttributeSet attributes) {
        super(context, attributes);
    }

    public ButtonBar(Context context, AttributeSet attributes, int def_style) {
        super(context, attributes, def_style);
    }

    @Override
    public View getChildAt(int index) {
        if (_has_ics)
            // Flip the buttons so that "OK | Cancel" becomes "Cancel | OK" on ICS
            return super.getChildAt(getChildCount() - 1 - index);

        return super.getChildAt(index);
    }

    private final static boolean _has_ics = Build.VERSION.SDK_INT >= 
                                        Build.VERSION_CODES.ICE_CREAM_SANDWICH;
}

Este será el lugar al LinearLayoutque vayan los botones "Aceptar" y "Cancelar", y se encargará de ponerlos en el orden apropiado. Luego coloque esto en el diseño en el que desea los botones:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:divider="?android:attr/dividerHorizontal"
          android:orientation="vertical"
          android:showDividers="middle">
    <!--- A view, this approach only works with a single view here -->
    <your.package.ButtonBar style="?android:attr/buttonBarStyle"
        android:id="@+id/buttons"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:weightSum="1.0">
        <Button style="?android:attr/buttonBarButtonStyle"
            android:id="@+id/ok_button"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="0.5"
            android:text="@string/ok_button" />
        <Button style="?android:attr/buttonBarButtonStyle"
            android:id="@+id/cancel_button"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="0.5"
            android:text="@string/cancel_button" />
    </your.package.ButtonBar>
</LinearLayout>

Esto le da la apariencia de un diálogo con botones sin bordes. Puede encontrar estos atributos en el res en el marco. buttonBarStylehace el divisor vertical y el acolchado. buttonBarButtonStyleestá configurado como borderlessButtonStylepara el tema Holo, pero creo que esta debería ser la forma más sólida de mostrarlo como el marco quiere mostrarlo.

Mirada en el tema de los atributos buttonBarStyle, buttonBarButtonStyley borderlessButtonStyle.

También puede hacer que los botones no tengan bordes a través del código:

TypedValue value= new TypedValue();
getApplicationContext().getTheme().resolveAttribute(android.R.attr.selectableItemBackground, value, true);
 myButton.setBackgroundResource(value.resourceId);

Para aquellos que quieren crear un botón sin bordes mediante programación para API> = 8

ImageButton smsImgBtn = new ImageButton(this);
//Sets a drawable as the content of this button
smsImgBtn.setImageResource(R.drawable.message_icon);    
//Set to 0 to remove the background or for bordeless button
smsImgBtn.setBackgroundResource(0);

Otra solución que debería funcionar tanto en plataformas Android antiguas como nuevas es usar

android:background="@android:color/transparent"

atributo para la vista Botón. Pero después de agregar el botón de línea anterior no proporcionará comentarios táctiles.

Para proporcionar comentarios táctiles, agregue el siguiente código a la clase de actividad

button.setOnTouchListener(new View.OnTouchListener() {          
    @Override
    public boolean onTouch(View view, MotionEvent event) {
        switch (event.getAction())
        {
            case MotionEvent.ACTION_DOWN:    
                ((Button)view).setBackgroundColor(Color.LTGRAY);
                break;
            case MotionEvent.ACTION_UP:
                ((Button)view).setBackgroundColor(Color.TRANSPARENT);
        }
        return false;
    }
});

esta trabajando bien para mi.

Para cualquiera que todavía esté buscando:

hereda su propio estilo para las barras de botones Holo:

<style name="yourStyle" parent="@android:style/Holo.ButtonBar">
  ...
</style>

o Holo Light:

<style name="yourStyle" parent="@android:style/Holo.Light.ButtonBar">
  ...
</style>

y para botones Holo sin bordes:

<style name="yourStyle" parent="@android:style/Widget.Holo.Button.Borderless.Small">
  ...
</style>

o Holo Light:

<style name="yourStyle" parent="@android:style/Widget.Holo.Light.Button.Borderless.Small">
  ...
</style>

Así es como se crea un botón sin bordes (plano) mediante programación sin usar XML

ContextThemeWrapper myContext = new ContextThemeWrapper(this.getActivity(), 
   R.style.Widget_AppCompat_Button_Borderless_Colored);

Button myButton = new Button(myContext, null, 
   R.style.Widget_AppCompat_Button_Borderless_Colored);

Utilice el siguiente código en su archivo xml. Usa android: background = "# 00000000" para tener el color transparente.

<Button
   android:id="@+id/btnLocation"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:background="#00000000"
   android:text="@string/menu_location"
   android:paddingRight="7dp"
/>

Puede utilizar la biblioteca de compatibilidad de AppCompat para el botón sin bordes.

Puedes hacer un botón sin bordes como este:

<Button
    style="@style/Widget.AppCompat.Button.Borderless"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="16dp" 
    android:text="@string/borderless_button"/>

Puede hacer un botón de color sin bordes de esta manera:

<Button
    style="@style/Widget.AppCompat.Button.Borderless.Colored"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_margin="16dp" 
    android:text="@string/borderless_colored_button"/>

Por alguna razón, ni style="Widget.Holo.Button.Borderless"ni android:background="?android:attr/selectableItemBackground"funcionó para mí. Para ser más precisos, Widget.Holo.Button.Borderlessfuncionó en Android 4.0 pero no funcionó en Android 2.3.3. Lo que me hizo el truco en ambas versiones fue android:background="@drawable/transparent"y este XML en res / drawable / transparent.xml:

<shape xmlns:android="http://schemas.android.com/apk/res/android" 
    android:shape="rectangle" >
</shape>

Cabeza llana a través del enfoque de la pared.

Una gran presentación de diapositivas sobre cómo lograr el efecto deseado de Googles Nick Butcher (comience en la diapositiva 20). Utiliza el androide estándar @attrpara diseñar el botón y el divisor.

Además de la respuesta superior, también puede usar vistas con un color de fondo gris oscuro en un diseño lineal como ese.

<View
    android:layout_width="match_parent"
    android:layout_height="1dip"
    android:layout_marginBottom="4dip"
    android:layout_marginLeft="4dip"
    android:layout_marginRight="4dip"
    android:layout_marginTop="4dip"
    android:background="@android:color/darker_gray"/>

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginBottom="4dip"
    android:orientation="horizontal"
    android:weightSum="1">

    <Button
        android:id="@+id/button_decline"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginLeft="10dp"
        android:layout_weight="0.50"
        android:background="?android:attr/selectableItemBackground"
        android:padding="10dip"
        android:text="@string/decline"/>

    <View
        android:layout_width="1dip"
        android:layout_height="match_parent"
        android:layout_marginLeft="4dip"
        android:layout_marginRight="4dip"
        android:background="@android:color/darker_gray"/>

    <Button
        android:id="@+id/button_accept"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginRight="10dp"
        android:layout_weight="0.50"
        android:background="?android:attr/selectableItemBackground"
        android:padding="10dip"
        android:text="@string/accept"/>
</LinearLayout>

Si su línea es horizontal, querrá establecer la altura en 1 punto y el ancho para que coincida con el padre y viceversa si su línea es vertical.

Si desea lograr lo mismo mediante programación:

(esto es C # pero fácilmente transaccional a Java)

Button button = new Button(new ContextThemeWrapper(Context, Resource.Style.Widget_AppCompat_Button_Borderless_Colored), null, Resource.Style.Widget_AppCompat_Button_Borderless_Colored);

Partido

    <Button
       style="@style/Widget.AppCompat.Button.Borderless.Colored"
    .../>

Pruebe este código, para eliminar el elemento de diseño de fondo (@ drawable / bg) mediante programación, solo necesitamos proporcionar un valor nulo como parámetro.

Button btn= new Button(this);
btn.setText("HI");
btn.setBackground(null);