¿Cómo agregar un divisor (vertical) a un LinearLayout horizontal?


92

Estoy tratando de agregar un divisor a un diseño lineal horizontal pero no llego a ninguna parte. El divisor simplemente no se muestra. Soy un novato total con Android.

Este es mi XML de diseño:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity" >

    <LinearLayout 
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:id="@+id/llTopBar"
        android:orientation="horizontal"
        android:divider="#00ff00"
        android:dividerPadding="22dip"
        android:showDividers="middle"
       >

        <Button
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:text="asdf" />
            <Button
            android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:text="asdf"
             />

    </LinearLayout>

</RelativeLayout>

¿En qué versión de Android estás ejecutando esto? setDividerDrawable solo existe desde API 11
alex

jelly bean 4.2 api 17
Ahmed-Anas

Si ha probado todo lo demás, asegúrese de que LinearLayout tenga la orientación correcta. Establecer una altura para un divisor con una orientación horizontal será muy confuso.
Nino van Hooff

1
¡¡¡¡¡No olvides el exasperante artículo de SHOWDIVIDERS !!!!!!
Fattie

Respuestas:


217

use esto para divisor horizontal

<View
    android:layout_width="1dp"
    android:layout_height="match_parent"
    android:background="@color/honeycombish_blue" />

y esto para divisor vertical

<View
    android:layout_width="match_parent"
    android:layout_height="1dp"
    android:background="@color/honeycombish_blue" />

O si puede usar el divisor LinearLayout, para divisor horizontal

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" >
    <size android:height="1dp"/>
    <solid android:color="#f6f6f6"/>
</shape>

y en LinearLayout

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:divider="@drawable/divider"
    android:orientation="vertical"
    android:showDividers="middle" >

Si desea usar un divisor vertical, entonces en lugar de android:height="1dp"usarlo en formaandroid:width="1dp"

Consejo: no olvide el android:showDividersartículo.


3
Gracias. pero ¿cómo agregaré esto al atributo "android: divider"? Básicamente, lo que quiero decir es, ¿alguna forma automática de agregar el divisor entre cada elemento? Quiero decir, ¿no es por eso que el atributo android: divider está ahí?
Ahmed-Anas

@ death_relic0 android: el divisor es hábil para ListView, Listview expandible y TabWidget
Padma Kumar

9
gracias, pero ¿por qué está aquí entonces? s developer.android.com/reference/android/widget/…
Ahmed-Anas

Parece que puedes usar cualquier estirable, no el color
demaksee

7
Parece que has mezclado tus valores layout_widthy layout_height: porque horizontal layout_widthdebería ser "fill_parent"y layout_heightdebería ser "1dp". Debería cambiarse de manera similar por el divisor vertical.
Jay Sidri

69

Pruebe esto, cree un divisor en la res/drawablecarpeta:

vertical_divider_1.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">    
    <size android:width="1dip" />
    <solid android:color="#666666" />    
</shape> 

Y use el divideratributo en LinearLayout así:

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="48dp"
    android:orientation="horizontal"
    android:divider="@drawable/vertical_divider_1"
    android:dividerPadding="12dip"
    android:showDividers="middle"
    android:background="#ffffff" >

    <Button
        android:id="@+id/button1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button" />
    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Button" />

</LinearLayout>

Nota: android:divider solo está disponible en Android 3.0 (API nivel 11) o superior.


pero eso solo agregará un divisor ... suponga que tengo como 10 elementos, agregar código adicional para un divisor entre cada elemento parece un desperdicio
Ahmed-Anas

@ death_relic0 ¿Por qué no crea un diseño separado para el divisor y luego usa la etiqueta de inclusión para agregarlo en cualquier lugar y tantas veces como desee? Creo que esto me haría mejor más y sin desperdicio.
GrIsHu

39

Es fácil agregar divisores al diseño, no necesitamos una vista separada.

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:divider="?android:listDivider"
    android:dividerPadding="2.5dp"
    android:orientation="horizontal"
    android:showDividers="middle"
    android:weightSum="2" ></LinearLayout>

El código anterior crea un divisor vertical para LinearLayout


Siempre olvido el atributo showDividers. ¡Gracias!
Unknownweirdo

1
Gracias por el consejo para usar? Android: listDivider. Sin embargo, acabo de notar que esto es invisible en API 21 o superior. En versiones de API inferiores se muestra una pequeña línea gris
user114676

@KetanMehta lo definiremos con el atributo 'android: divider', es dibujable o color.
khaintt

¿Android: divider es compatible con API 15 +?
RoCk RoCk

17

Actualización: pre-Honeycomb usando AppCompat

Si está utilizando la biblioteca AppCompat v7, es posible que desee utilizar la LinearLayoutCompatvista. Con este enfoque, puede usar divisores dibujables en Android 2.1, 2.2 y 2.3.

Código de ejemplo:

<android.support.v7.widget.LinearLayoutCompat
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        app:showDividers="middle"
        app:divider="@drawable/divider">

drawable / divider.xml: (divisor con algo de relleno en la parte superior e inferior)

<?xml version="1.0" encoding="UTF-8"?>
<inset xmlns:android="http://schemas.android.com/apk/res/android"
        android:insetBottom="2dp"
        android:insetTop="2dp">
    <shape>
        <size android:width="1dp" />
        <solid android:color="#FFCCCCCC" />
    </shape>
</inset>

Nota muy importante: La LinearLayoutCompatvista no se extiende LinearLayouty por lo tanto no debe usar las propiedades android:showDividerso android:dividersino las personalizadas: app:showDividersy app:divider. En el código, también debe usar LinearLayoutCompat.LayoutParamsnot the LinearLayout.LayoutParams!


¿Es esta la única forma de agregar relleno vertical a un divisor?
SARose

1
@SARose no, siempre puede crear una vista personalizada o piratear componentes de vista existentes. Sin embargo, este es el método predeterminado y preferido para hacerlo.
Rolf ツ

8

Hoy me encontré con el mismo problema. Como indican las respuestas anteriores, el problema surge del uso de un color en la etiqueta divisoria, en lugar de un dibujo. Sin embargo, en lugar de escribir mi propio xml dibujable, prefiero usar atributos temáticos tanto como sea posible. Puede usar android: attr / dividerHorizontal y android: attr / dividerVertical para obtener un elemento de dibujo predefinido en su lugar:

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:showDividers="middle"
    android:divider="?android:attr/dividerVertical"
    android:orientation="horizontal">
    <!-- other views -->
</LinearLayout>

Los atributos están disponibles en API 11 y superior.

Además, como lo menciona bocekm en su respuesta, la propiedad dividerPadding NO agrega relleno adicional a ambos lados de un divisor vertical, como se podría suponer. En su lugar, define el relleno superior e inferior y, por lo tanto, puede truncar el divisor si es demasiado grande.


6

Puede usar el divisor incorporado, esto funcionará para ambas orientaciones.

<LinearLayout
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:divider="?android:attr/listDivider"
  android:orientation="horizontal"
  android:showDividers="middle">

3

Es frustrante que tenga que habilitar la visualización de los separadores del código en su actividad. Por ejemplo:

protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    // Set the view to your layout
    setContentView(R.layout.yourlayout);

    // Find the LinearLayout within and enable the divider
    ((LinearLayout)v.findViewById(R.id.llTopBar)).
        setShowDividers(LinearLayout.SHOW_DIVIDER_MIDDLE);

}

Aunque es otra forma de hacerlo, no es necesario.
Ricardo A.

2

Es posible que su divisor no se muestre debido a un divisorPadding demasiado grande. Establece 22dip, eso significa que el divisor se trunca en 22dip desde arriba y 22dip desde abajo. Si la altura de su diseño es menor o igual a 44 dip, no se verá ningún divisor.


1

Si la respuesta de Kapil Vats no funciona, intente algo como esto:

drawable / divider_horizontal_green_22.xml

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

    <size android:width="22dip"/>
    <solid android:color="#00ff00"/>

</shape>

layout / your_layout.xml

LinearLayout 
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:id="@+id/llTopBar"
            android:orientation="horizontal"
            android:divider="@drawable/divider_horizontal_green_22"
            android:showDividers="middle"
           >

Encontré un problema en el que el atributo de relleno no funcionaba, por lo que tuve que establecer la altura del divisor directamente en el divisor.

Nota:

Si desea usarlo en LinearLayout vertical, cree uno nuevo, como este: drawable / divider_vertical_green_22.xml

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

    <size android:height="22dip"/>
    <solid android:color="#00ff00"/>

</shape>

0

Para poder dibujar, el divisor de LinearLayoutdebe tener cierta altura, mientras ColorDrawableque (que es esencialmente #00ff00tan bueno como cualquier otro color codificado) no tiene. Una forma simple (y correcta) de resolver esto es envolver su color en algunos Drawablecon una altura predefinida, como shapedibujable


-1

Debe crear cualquier vista para separadores como vista de texto o vista de imagen y luego establecer el fondo para eso, si tiene una imagen, use el color como fondo.

Espero que esto te ayude.

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.