Android TextView Align text to Left and Right

Question

I'm trying to have a TextView that has two texts, one aligned at the left side of the TextView and one at the right side of the TextView.

I referred this [Android TextView Align text to Right and Left (@daemontus) for setting the text.

But how do add a text if I enter the text at right side of the TextView first and then left side of the TextView

1) Input: Enter Button 1 to display Text1

2) Output: Enter Button 2 to display Text2 along with Text1

public void setLeftRightText(TextView view, String left, String right,Enum keysel) {
if(keysel == RSK_KEY) {
        SpannableString merged=new SpannableString(left + "\n" + right);
        merged.setSpan(
                new AlignmentSpan.Standard(Layout.Alignment.ALIGN_NORMAL),
                0, left.length(), Spanned.SPAN_INCLUSIVE_EXCLUSIVE
        );
        merged.setSpan(
                new LineOverlapSpan(),
                left.length(), left.length() + 1, Spanned.SPAN_INCLUSIVE_EXCLUSIVE
        );
        merged.setSpan(
                new AlignmentSpan.Standard(Layout.Alignment.ALIGN_OPPOSITE),
                left.length() + 1, left.length() + 1 + right.length(), Spanned.SPAN_INCLUSIVE_EXCLUSIVE
        );
        view.setText(merged);
    }
    else if (keysel == LSK_KEY){
        final String resultText = right + "  " + left;
        final SpannableString styledResultText = new SpannableString(resultText);
        styledResultText.setSpan((new AlignmentSpan.Standard(Layout.Alignment.ALIGN_OPPOSITE )), left.length() + 2, left.length() + 2 +right.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
        styledResultText.setSpan((new AlignmentSpan.Standard(Layout.Alignment.ALIGN_NORMAL )), 0, left.length(), Spannable.SPAN_EXCLUSIVE_EXCLUSIVE);
        view.setText(styledResultText);

    }

}

LineOverlapSpan.java

public class LineOverlapSpan implements LineHeightSpan {

    public void chooseHeight(final CharSequence text, final int start, final int end, final int spanstartv, final int v, final Paint.FontMetricsInt fm) {
        fm.bottom += fm.top;
        fm.descent += fm.top;
    }
}

Answer 1

You can achieve the desired result in a single text view. Create a view that extends text view and override the onDraw

I've put together a small example. Hope it will give you an idea at-least

public class LeftRightTextView extends AppCompatTextView {

    private TextPaint mTextPaint;
    private String mLeftText, mRightText;

    public LeftRightTextView(Context context) {
        this(context, null);
    }

    public LeftRightTextView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public void setLeftText(String leftText) {
        mLeftText = leftText;
        setText(mLeftText);
    }

    public void setRightText(String rightText) {
        mRightText = rightText;
        invalidate();
    }

    public LeftRightTextView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.LeftRightTextView, defStyleAttr, 0);
        mLeftText = typedArray.getString(R.styleable.LeftRightTextView_lr_left_text);
        mRightText = typedArray.getString(R.styleable.LeftRightTextView_lr_right_text);
        typedArray.recycle();
        setText(mLeftText);
        mTextPaint = new TextPaint();
        mTextPaint.setColor(getCurrentTextColor());
    }

    @Override
    protected void onDraw(Canvas canvas) {
        //let it draw the left text as usual
        super.onDraw(canvas);

        //Now draw the right text
        int rightEnd = getWidth() - getPaddingRight();
        float textWidth = mTextPaint.measureText(mRightText);
        canvas.drawText(mRightText, rightEnd - textWidth, mTextPaint.getFontMetrics().descent - mTextPaint.getFontMetrics().ascent, mTextPaint);

    }
}

And the attributes

<declare-styleable name="LeftRightTextView">
    <attr name="lr_left_text" format="string"/>
    <attr name="lr_right_text" format="string"/>
</declare-styleable>

In layout

<me.srs.myapplication.LeftRightTextView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:lr_left_text="Hello"
    app:lr_right_text="World"/>

And this is the result

Answer 2

You need to take two separate textviews to achieve your requirements.

Please use following code and check.

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="horizontal"
    android:background="@android:color/black"
    android:padding="10dp"
    android:weightSum="1">

    <TextView
        android:text="Left"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="0.5"
        android:textSize="36sp"
        android:fontFamily="sans-serif-light"
        android:textColor="@android:color/white"
        android:background="@android:color/transparent"
        android:gravity="left"
        android:padding="5dp"/>

    <TextView
        android:text="Right"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="0.5"
        android:textSize="36sp"
        android:fontFamily="sans-serif-light"
        android:textColor="@android:color/white"
        android:background="@android:color/transparent"
        android:gravity="right"
        android:padding="5dp"/>

</LinearLayout>

Answer 3

You need to create a custom view and override onDraw method of same , to achieve desired functionality.