How to create a split between views?

Asked

Viewed 185 times

1

I’m creating an app that uses a ListView to show items and wanted to know the best and most customized way to create splitters between them, also wanted to know how to use another splitter between two icons, which are the options that stay in one Toolbar at the bottom of the screen.

I want the divider between items of ListView like the Whatsapp: inserir a descrição da imagem aqui

But I also want to use a divider between icons in a Toolbar as in the photo, right after "SAVE" (will not be acting as ActionBar, will be at the bottom, I took the image because it was the best I found): inserir a descrição da imagem aqui

I’ve tried using one LinearLayout to serve as a divider in any situation, but was not as legal as the android:divider of ListView, this is the only possible way?

In short: Is there any way to make a splitter whenever you need it as an independent view, which can be fully customizable? This would make it easier to manipulate the size of the ListView and also to be used between Toolbar.

1 answer

2


The android:divider is a drawable. So you can look whatever you want.

In this case, to get him to have margins, use a Insetdrawable:

Divider.xml

<?xml version="1.0" encoding="UTF-8"?>
<inset xmlns:android="http://schemas.android.com/apk/res/android"
    android:insetLeft="45dp"
    android:insetRight="45dp" >

    <shape>
        <solid android:color="#FF0000"  />
    </shape>

</inset>

The attributes

android:insetLeft="45dp"
android:insetRight="45dp"

control the left and right margins.

Use like this:

<ListView
    android:id="@+id/listView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:divider="@drawable/divider"
    android:dividerHeight="2dp"/>

the attribute

android:dividerHeight="2dp"

defines the thickness of Divider.

To use it in a way that separates any view use it in an Imageview:

<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"
    android:orientation="vertical">

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

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="2dp"
        android:layout_marginTop="10dp"
        android:layout_marginBottom="10dp"
        android:src="@drawable/divider"/>

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

Browser other questions tagged

You are not signed in. Login or sign up in order to post.