0

How to wrap or Justify the text i use Relative layout i attached the image below

 <TextView
            android:id="@+id/txt_text_madina"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true"
            android:layout_below="@id/txt_desc_madina"
            android:layout_centerHorizontal="true"
            android:layout_gravity="center_vertical|left"
            android:layout_marginLeft="2dp"
            android:layout_marginTop="2dp"
            android:text="In front of the sacred tomb of The Holy Prophet (peace be upon him), there are three sections of brass screens and all three have holes in them. Look at the picture carefully. If you stand in front of the middle section between the pillars, you'll see a big round hole on your left. This is in front of the face of the Holy Prophet. Adjacent to it is a door that stays closed. Right after it on the right side is a round hole which is in front of the face of Hadrat Abu Bakr Siddique. On the right of it, there is another round hole which is in front of the face of Hadrat Umar Farooq."
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textColor="@color/appscreen"


            />

enter image description here

ahmad
  • 39
  • 1
  • 10

1 Answers1

0

Create a new Java class and add the code below

public class JustifiedTextView extends TextView {

    private int mLineY;
    private int mViewWidth;

    public JustifiedTextView(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    @Override
    protected void onLayout(boolean changed, int left, int top, int right,
            int bottom) {
        super.onLayout(changed, left, top, right, bottom);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        TextPaint paint = getPaint();
        paint.setColor(getCurrentTextColor());
        paint.drawableState = getDrawableState();
        mViewWidth = getMeasuredWidth();
        String text = (String) getText();
        mLineY = 0;
        mLineY += getTextSize();
        Layout layout = getLayout();
        for (int i = 0; i < layout.getLineCount(); i++) {
            int lineStart = layout.getLineStart(i);
            int lineEnd = layout.getLineEnd(i);
            String line = text.substring(lineStart, lineEnd);

            float width = StaticLayout.getDesiredWidth(text, lineStart,
                    lineEnd, getPaint());
            if (needScale(line)) {
                drawScaledText(canvas, lineStart, line, width);
            } else {
                canvas.drawText(line, 0, mLineY, paint);
            }

            mLineY += getLineHeight();
        }
    }

    private void drawScaledText(Canvas canvas, int lineStart, String line,
            float lineWidth) {
        float x = 0;
        if (isFirstLineOfParagraph(lineStart, line)) {
            String blanks = "  ";
            canvas.drawText(blanks, x, mLineY, getPaint());
            float bw = StaticLayout.getDesiredWidth(blanks, getPaint());
            x += bw;

            line = line.substring(3);
        }

        float d = (mViewWidth - lineWidth) / line.length() - 1;
        for (int i = 0; i < line.length(); i++) {
            String c = String.valueOf(line.charAt(i));
            float cw = StaticLayout.getDesiredWidth(c, getPaint());
            canvas.drawText(c, x, mLineY, getPaint());
            x += cw + d;
        }
    }

    private boolean isFirstLineOfParagraph(int lineStart, String line) {
        return line.length() > 3 && line.charAt(0) == ' '
                && line.charAt(1) == ' ';
    }

    private boolean needScale(String line) {
        if (line.length() == 0) {
            return false;
        } else {
            return line.charAt(line.length() - 1) != '\n';
        }
    }

}

Go to your xml layout file and change this:

<TextView
            android:id="@+id/txt_text_madina"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true"
            android:layout_below="@id/txt_desc_madina"
            android:layout_centerHorizontal="true"
            android:layout_gravity="center_vertical|left"
            android:layout_marginLeft="2dp"
            android:layout_marginTop="2dp"
            android:text="In front of the sacred tomb of The Holy Prophet (peace be upon him), there are three sections of brass screens and all three have holes in them. Look at the picture carefully. If you stand in front of the middle section between the pillars, you'll see a big round hole on your left. This is in front of the face of the Holy Prophet. Adjacent to it is a door that stays closed. Right after it on the right side is a round hole which is in front of the face of Hadrat Abu Bakr Siddique. On the right of it, there is another round hole which is in front of the face of Hadrat Umar Farooq."
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textColor="@color/appscreen"

            />

with

<com.yourpackage.JustifiedTextView
            android:id="@+id/txt_text_madina"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_alignParentRight="true"
            android:layout_below="@id/txt_desc_madina"
            android:layout_centerHorizontal="true"
            android:layout_gravity="center_vertical|left"
            android:layout_marginLeft="2dp"
            android:layout_marginTop="2dp"
            android:text="In front of the sacred tomb of The Holy Prophet (peace be upon him), there are three sections of brass screens and all three have holes in them. Look at the picture carefully. If you stand in front of the middle section between the pillars, you'll see a big round hole on your left. This is in front of the face of the Holy Prophet. Adjacent to it is a door that stays closed. Right after it on the right side is a round hole which is in front of the face of Hadrat Abu Bakr Siddique. On the right of it, there is another round hole which is in front of the face of Hadrat Umar Farooq."
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textColor="@color/appscreen"
            />

Hope it will help

piotrek1543
  • 19,130
  • 7
  • 81
  • 94