1

estoy creando una app de notas y nesecito que el layout tenga un estilo parecido a esteestilo

las lineas horizontales serian un Listview de cada nota que yo tenga, hasta ahora tengo el siguiente código para el layout pero quiero saber si existe una mejor forma de hacerlo.

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


<View
    android:id="@+id/line1"
    android:layout_width="0.5dp"
    android:layout_height="match_parent"
    android:background="#E93F67"
    android:layout_marginLeft="20dp"/>

<View
    android:id="@+id/linea2"
    android:layout_width="0.5dp"
    android:layout_height="match_parent"
    android:background="#E93F67"
    android:layout_marginLeft="26dp"/>

<ListView
    android:id="@+id/lista"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginLeft="0dp"
    android:layout_toRightOf="@+id/linea2"
    android:divider="#000"
    android:dividerHeight="1dp"></ListView>

lo que tengo hasta ahora

2
  • 2
    Sería muy guarro ponerlo como imagen de fondo y ajustar la separacion de lineas y el margen para que encaje con las lineas horizontales del fondo ?
    – lois6b
    Commented el 17 abr. 2019 a las 11:20
  • 1
    Yo haría algo similar, pero en lugar de hacer el margen fuera del listview, lo haría parte del layout item.
    – Juan
    Commented el 17 abr. 2019 a las 17:15

1 respuesta 1

2

activity.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ListView android:layout_height="match_parent"
        android:layout_width="match_parent"
        android:background="#f6ff9e"
        android:id="@+id/lv" />
</LinearLayout>

custom_item.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" >


    <View
    android:id="@+id/view3"
    android:layout_width="match_parent"
    android:layout_height="2dp"
    android:background="#40c1ed"
    android:layout_below="@+id/view2"/>


    <View
    android:id="@+id/view1"
    android:layout_width="2dp"
    android:layout_height="50dp"
    android:background="#E93F67"
    android:layout_marginLeft="20dp"/>

    <View
    android:id="@+id/view2"
    android:layout_width="2dp"
    android:layout_height="50dp"
    android:background="#E93F67"
     android:layout_toRightOf="@id/view1"
    android:layout_marginLeft="4dp"/>


    <TextView android:layout_height="wrap_content" 
        android:layout_width="wrap_content" 
        android:text="Elemento" 
        android:id="@+id/tvElemento"
        android:layout_centerVertical="true"
       android:layout_marginLeft="8dp"
       android:layout_toRightOf="@id/view2"/>

</RelativeLayout>

Haz un adapter personalizado, aqui un ejemplo. Aunque con muchos elementos se ve bien, pero no es lo mismo cuando sean pocos.

También se me ocurre que sea el fondo como lo quieres(el fondo amarillo y las lineas rojas) solamente que sin las lineas azules, eso se pondría con el divider del listview

  android:divider="#40c1ed"
  android:dividerHeight="4dp"

Aqui el resultado

introducir la descripción de la imagen aquí

Saludos.

1
  • Muchas gracias!
    – Mauro
    Commented el 19 abr. 2019 a las 6:45

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.