How to make an OR separator in RelativeLayout in android?

Question

how can I make a separator line with "OR" in the middle in RelativeLayout in xml file of an activity? I'm trying to make something like " ------- OR --------" , with proper lines and "OR" in middle.

it worked, thanks for the help – Arpit Tomar Feb 18 '16 at 16:24 — Arpit Tomar, Feb 18 '16 at 16:24
You are welcome, Happy that i helped you, :) :) – Swaminathan V Feb 18 '16 at 16:25 — Swaminathan V, Feb 18 '16 at 16:25

score 0 · Answer 1 · answered Feb 18 '16 at 16:06

0

Try a TextView with width "match_parent"/"fill_parent" and put its gravity in center.

answered Feb 18 '16 at 16:06

Lerul Ler

339
7
21

score 0 · Answer 2 · edited May 23 '17 at 11:45

After some research I found this question here : Source

This should just be what you need. Essence is to create a custom drawable class which extends Drawable and takes text in its constructor.

If you need more information I will take some time to get your custom drawable done.

Edit: here is full source

package com.example.XXX.customdividerdrawable;

import android.graphics.Canvas;
import android.graphics.ColorFilter;
import android.graphics.Paint;
import android.graphics.PixelFormat;
import android.graphics.Rect;
import android.graphics.drawable.Drawable;

public class TextDividerDrawable extends Drawable {

    private final String text;
    private final Paint paint;

    public TextDividerDrawable(String text, Paint paint) {
        this.text = text;
        this.paint = paint;
    }

    @Override
    public void draw(Canvas canvas) {
       Rect bounds = new Rect();
       paint.getTextBounds(text, 0, text.length(), bounds);
       int margin = 10;

       canvas.drawLine(
           margin, (canvas.getHeight() / 2) - (bounds.height() / 2),
           canvas.getWidth() / 2 - margin,
           (canvas.getHeight() / 2) - (bounds.height() / 2), paint
       );

       canvas.drawText(text, canvas.getWidth() / 2, canvas.getHeight() / 2, paint);

       canvas.drawLine(
          canvas.getWidth() / 2 + (margin + bounds.width()),
          (canvas.getHeight() / 2) - (bounds.height() / 2),
          canvas.getWidth() - margin,
          (canvas.getHeight() / 2) - (bounds.height() / 2), paint
       );
    }

    @Override
    public void setAlpha(int alpha) {
        paint.setAlpha(alpha);
    }

    @Override
    public void setColorFilter(ColorFilter cf) {
        paint.setColorFilter(cf);
    }

    @Override
    public int getOpacity() {
        return PixelFormat.TRANSLUCENT;
    }
}

No put this as a background in every view you want like this:

        Paint paint = new Paint();
        paint.setColor(Color.BLACK);
        paint.setTextSize(22f);
        paint.setStyle(Paint.Style.FILL);

        TextDividerDrawable textDividerDrawable = new TextDividerDrawable("OR", paint);

        View view= findViewById(R.id.view);

        view.setBackground(textDividerDrawable);

For example:

<?xml version="1.0" encoding="utf-8"?>
<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"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context="com.example.XXX.customdividerdrawable.MainActivity">

    <View
        android:id="@+id/view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">

    </View>

</RelativeLayout>

score 0 · Accepted Answer · answered Feb 18 '16 at 16:09

You can try something like below.

  <LinearLayout
   xmlns:android = "http://schemas.android.com/apk/res/android"
   android:layout_width = "match_parent"
   android:layout_height = "match_parent"
   android:background = "#ffffff"
   android:gravity = "center"
   android:orientation = "horizontal">

  <View
     android:layout_width = "75dp"
     android:layout_height = "3dp"
     android:background = "#000"/>

  <TextView
     android:id = "@+id/tv"
     android:layout_width = "wrap_content"
     android:layout_height = "wrap_content"
     android:layout_gravity = "center"
     android:layout_marginLeft = "5dp"
     android:layout_marginRight = "5dp"
     android:gravity = "center"
     android:text = "or"
     android:textSize = "24sp"/>

  <View
     android:layout_width = "75dp"
     android:layout_height = "3dp"
     android:background = "#000"/>
</LinearLayout>

Hope it will help you.

How to make an OR separator in RelativeLayout in android?

3 Answers3