Drawing multiple line in edittext - android

I'm trying to draw lines in edittext. I have a scrollview inside which is editText.When number of lines in the editText is less then the total possible line that can be accommodated in view, I still want to draw the left lines after already drawn lines for text present in editText.
For example suppose if the no of lines in the edittext are 3 then only 3 lines are drawn .But I want to draw lines throughout the view in this case.
I've written below code but it is only drawing line upto height of text not beyond that.It will be a great help if anyone could help it .
public class DisplayActivity extends AppCompatActivity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_display);
final TextView textView_header = (TextView) findViewById(R.id.header);
final String randomText = getIntent().getExtras().getString("Data");
int index = Integer.parseInt(randomText);
int pos = MainActivity.keyList.get(index);
final String text = MainActivity.settings.getString("data" + pos, "");
final String text_2 = MainActivity.settings_2.getString("data" + pos,
"");
textView_header.setText(text);
LayoutParams textViewLayoutParams = new LayoutParams(
LayoutParams.MATCH_PARENT, LayoutParams.MATCH_PARENT);
LinearLayout ll = (LinearLayout) findViewById(R.id.editText_layout);
ScrollView sv = new ScrollView(this);
sv.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT,
LayoutParams.MATCH_PARENT));
LinedEditText et = new LinedEditText(this, null);
et.setLayoutParams(textViewLayoutParams);
et.setText(text_2);
et.setKeyListener(null);
et.setEnabled(false);
et.setTextColor(Color.BLACK);
et.setBackgroundColor(Color.TRANSPARENT);
sv.addView(et);
ll.addView(sv);
}
public class LinedEditText extends EditText {
private Rect mRect;
private Paint mPaint;
public LinedEditText(Context context, AttributeSet attrs) {
super(context, attrs);
mRect = new Rect();
mPaint = new Paint();
mPaint.setStyle(Paint.Style.STROKE);
mPaint.setColor(Color.GRAY);
}
#Override
protected void onDraw(Canvas canvas) {
int height = getHeight();
int line_height = getLineHeight();
int count = height / line_height;
if (getLineCount() > count)
count = getLineCount();// for long text with scrolling
Rect r = mRect;
Paint paint = mPaint;
int baseline = getLineBounds(0, r);// first line
for (int i = 0; i < count; i++) {
canvas.drawLine(r.left, baseline + 1, r.right, baseline + 1,
paint);
baseline += getLineHeight();// next line
}
super.onDraw(canvas);
}
}
}
This is my xml layout for the activity
<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:background="#drawable/page2"
tools:context="com.example.writenote.DisplayActivity" >
<TextView
android:id="#+id/textView"
android:layout_width="match_parent"
android:layout_height="140px" />
<LinearLayout
android:id="#+id/editText_layout"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_below="#+id/line"
android:layout_marginTop="0px"
android:orientation="vertical" />
<TextView
android:id="#+id/line"
android:layout_width="match_parent"
android:layout_height="1px"
android:layout_below="#+id/header"
android:layout_marginLeft="20px"
android:layout_marginRight="5px"
android:layout_marginTop="10dp"
android:background="#a9a9a9" />
<TextView
android:id="#+id/header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/textView"
android:layout_marginLeft="30px"
android:layout_marginRight="25px"
android:layout_marginTop="30px"
android:text="hello"
android:textColor="#000"
android:textSize="60px" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="260px"
android:layout_height="260px"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:src="#drawable/circleedit" />
</RelativeLayout>
I think the problem is in getHeight() which is in onDraw. It is returning height of editext which consists of three lines. Is there any way to provide the height of linearlayout which encloses edittext? I tried to provide height of linearlayout in onDraw method but there is no effect it's still drawing 3 lines.
I tried to do this in onDraw method
//ll is linearLayout
int height = ll.getHeight();

Your problem comes from the ScrollView, this ViewGroup is made to contain variable content size and add a scrollbar if this content is bigger than the provided space in the layout, thus you cannot use the match_parent configuration inside a ScrollView (your EditText will automatically be set to wrap_content on its height).
You simply have to call sv.fillViewPort(true); in your onCreate to stretch the content if smaller than the ScrollView height, as stated in the android documentation.

<EditText
android:id="#+id/editText"
android:width="wrap_content"
android:height="wrap_content"
android:maxLines="2"/>
maxLines number is your required lines count;
you want multiple lines in edit text ....set edit text width is fixed and height is warap_content then it automaticall enter new line....

Related

EditText with multiple lines, like a notepad

I'm following the example given by max4ever where he showed how to achieve what I'm looking for. I create a custom EditText class:
public class LinedEditText extends AppCompatEditText {
private Rect mRect;
private Paint mPaint;
// we need this constructor for LayoutInflater
public LinedEditText(Context context, AttributeSet attrs) {
super(context, attrs);
mRect = new Rect();
mPaint = new Paint();
mPaint.setStyle(Paint.Style.FILL_AND_STROKE);
mPaint.setColor(getResources().getColor(R.color.black)); //SET YOUR OWN COLOR HERE
}
#Override
protected void onDraw(Canvas canvas) {
//int count = getLineCount();
int height = getHeight();
int line_height = getLineHeight();
int count = height / line_height;
if (getLineCount() > count)
count = getLineCount();//for long text with scrolling
Rect r = mRect;
Paint paint = mPaint;
int baseline = getLineBounds(0, r);//first line
for (int i = 0; i < count; i++) {
canvas.drawLine(r.left, baseline + 1, r.right, baseline + 1, paint);
baseline += getLineHeight();//next line
}
super.onDraw(canvas);
}
}
Then I'm adding it to my layout .xml like this:
<?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"
tools:context="myapp.com.test.NotesLayout">
<myapp.com.test.LinedEditText
android:layout_width="match_parent"
android:layout_height="match_parent" />
</RelativeLayout>
The problem I'm having is that the EditText only starts in the middle of the view like this:
So, my question is, how can I adjust this custom EditText so that it shows on top/from the start of the view?
HOW I FIXED IT
I changed my xml to this
<myapp.com.test.LinedEditText
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#null"
android:imeOptions="actionNone"
android:gravity="top"
/>
Setting android:gravity="top" is why it was starting in the middle of the view. Thank you for all the contributions.
Set
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
in your custom Edittext in your layout file.This will yield the desired result.

EditText with lines like notepad android

I have use custom EditText like notepad from the link Custom EditText
The text entered on the custom EditText doesn't appears correctly on the lines it contains . It some time appears on the line or below the line , unexpected behaviour
My output Click here !
Required output Click here !
Please help me in this case .
LineEditText.java
public class LinedEditText extends EditText {
private Rect mRect;
private Paint mPaint;
// we need this constructor for LayoutInflater
public LinedEditText(Context context, AttributeSet attrs) {
super(context, attrs);
mRect = new Rect();
mPaint = new Paint();
mPaint.setStyle(Paint.Style.FILL_AND_STROKE);
mPaint.setColor(Color.parseColor("#C0C0C0")); //SET YOUR OWN COLOR HERE
}
#Override
protected void onDraw(Canvas canvas) {
//int count = getLineCount();
int height = getHeight();
int line_height = getLineHeight();
int count = height / line_height;
if (getLineCount() > count)
count = getLineCount();//for long text with scrolling
Rect r = mRect;
Paint paint = mPaint;
int baseline = getLineBounds(0, r);//first line
for (int i = 0; i < count; i++) {
canvas.drawLine(r.left, baseline + 1, r.right, baseline + 1, paint);
baseline += getLineHeight();//next line
}
super.onDraw(canvas);
}
}
layout.xml
<RelativeLayout android:id="#+id/rel_edit_story"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/txt_image"
android:padding="10dip"
android:layout_margin="10dip"
android:background="#drawable/relative_lined_edittext_border">
<com.rb.lined.edittext.LinedEditText
android:id="#+id/edit_story"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#null"
android:inputType="textMultiLine|textNoSuggestions"
android:minLines="10"
android:singleLine="false"
android:imeOptions="actionNone"
android:text="Story : " />
</RelativeLayout>
For Desabeling Red underline you can put like
android:inputType="textNoSuggestions"
or
android:inputType="textVisiblePassword"
and for removing blue line this may help.
android:background="#null"
Example
<com.example.lineedittextdemo.LineEditText
android:id="#+id/edit_story"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="20dp"
android:background="#null"
android:inputType="textMultiLine|textNoSuggestions"
android:minLines="10"
android:singleLine="false"
android:imeOptions="actionNone"
android:text="Story : \n" />

android : How to show a text inline another

Is there any solution to have 2 textview like this :
image
in fact i want to show Text2 lines below the Text1 lines. For exmple to show the translation Text1.
Any solution?
You can use setLineSpacing to set a big enough gap in your TextViews and overlap them, then translate it so one shows up in between the lines of the other.
Try this code.
You can set lineSpacingExtra property of TextView and can use relative layout to overlap them. After this you cna set properties of your text view accordingly
In your xml define text view properties like this
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/LinearLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="10dp"
tools:context=".MainActivity" >
<TextView
android:id="#+id/tv1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="This is Text 1. This is Text1. This is Text 1. This is Text1. This is Text 1. This is Text1"
android:lineSpacingExtra="20dp"
android:textColor="#5F4C0B"
android:textSize="24sp"
android:textStyle="bold" />
<TextView
android:id="#+id/tv2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="26dp"
android:lineSpacingExtra="26dp"
android:text="This is Text 2. This is Text2. This is Text2. This is Text2. This is Text2. This is Text2"
android:textColor="#B40404"
android:textSize="20sp" />
</RelativeLayout>
You will get output like this
Accept the answer if you found it useful
You can dynamically create this view,
In Main Activity write the following code
public class MainActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
RelativeLayout rl = new RelativeLayout(this);
RelativeLayout.LayoutParams text1 = new RelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
text1.setMargins(0, 0, 0, 0);
RelativeLayout.LayoutParams text2 = new RelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
text2.setMargins(0, 26, 0, 0);
LinesTextView tv1 = new LinesTextView(this, null);
tv1.setText("This is Text 1. This is Text 1. This is Text 1. This is Text 1. This is Text 1. This is Text 1.");
tv1.setLineSpacing(20.0f, 1.0f);
tv1.setLayoutParams(text1);
tv1.setTextSize(24.0f);
tv1.setTextColor(getResources().getColor(android.R.color.darker_gray));
LinesTextView tv2 = new LinesTextView(this, null);
tv2.setText("This is Text 2. This is Text 2. This is Text 2. This is Text 2. This is Text 2. This is Text 2.");
tv2.setLineSpacing(25.0f, 1.0f);
tv2.setLayoutParams(text2);
tv2.setTextSize(18.0f);
tv2.setTextColor(getResources().getColor(android.R.color.black));
rl.addView(tv1);
rl.addView(tv2);
this.setContentView(rl);
}
}
In LinesTextView class write the following code
public class LinesTextView extends TextView
{
private Rect mRect;
private Paint mPaint;
// we need this constructor for LayoutInflater
public LinesTextView(Context context, AttributeSet attrs) {
super(context, attrs);
mRect = new Rect();
mPaint = new Paint();
mPaint.setStyle(Paint.Style.STROKE);
mPaint.setColor(0x800000FF);
}
#Override
protected void onDraw(Canvas canvas) {
int count = getLineCount();
Rect r = mRect;
Paint paint = mPaint;
for (int i = 0; i < count; i++) {
int baseline = getLineBounds(i, r);
canvas.drawLine(r.left, baseline + 1, r.right, baseline + 1, paint);
}
super.onDraw(canvas);
}
}
Check Screen shot
Set Text color, style, margin and size accordingly.

setPadding(0,0,0,0) called several times on View after constructor

Good evening! I'm trying to setPadding on a custom View i built and the native setPadding() did nothing so i wrote my own... After a while i realized that setPadding gets called several times after my original call and i have no idea why... Please help :) (I realize that my custom setPadding maybe quite excessive ^^)
Here is the XML containing the View. It's the PieChart.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/PieDialog_llParent"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<TextView
android:id="#+id/PieDialog_tvHeader"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Header"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/PieDialog_tvDiv1"
android:layout_width="match_parent"
android:layout_height="2dp"
android:textSize="0sp"/>
<TextView
android:id="#+id/PieDialog_tvDiv2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="0sp" />
<com.SverkerSbrg.Spendo.Statistics.Piechart.PieChart
android:id="#+id/PieDialog_Pie"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<TextView
android:id="#+id/PieDialog_tvDiv3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="0sp" />
<FrameLayout
android:id="#+id/PieDialog_flClose"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/PieDialog_tvClose"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Large Text" />
</FrameLayout>
</LinearLayout>
And here is the code where i use the xml:
package com.SverkerSbrg.Spendo.Transaction.TransactionList.PieDialog;
imports...
public class PieDialog extends SpendoDialog{
private TransactionSet transactionSet;
private TransactionGroup transactionGroup;
private GUI_attrs gui_attrs;
private PieData pieData;
private PieChart pie;
private TextView tvHeader;
public Dialog onCreateDialog(Bundle savedInstanceState) {
AlertDialog.Builder builder = new AlertDialog.Builder(getActivity());
LayoutInflater inflater = getActivity().getLayoutInflater();
View view = inflater.inflate(R.layout.transaction_list_pie_dialog, null);
LinearLayout llParent = (LinearLayout) view.findViewById(R.id.PieDialog_llParent);
llParent.setBackgroundColor(gui_attrs.color_Z0);
tvHeader = (TextView) view.findViewById(R.id.PieDialog_tvHeader);
tvHeader.setTextSize(gui_attrs.textSize_header);
TextView tvDiv1 = (TextView) view.findViewById(R.id.PieDialog_tvDiv1);
tvDiv1.setBackgroundColor(gui_attrs.color_Z2);
TextView tvDiv2 = (TextView) view.findViewById(R.id.PieDialog_tvDiv2);
tvDiv2.setPadding(0, gui_attrs.padding_Z0, 0, 0);
PieChart pie = (PieChart) view.findViewById(R.id.PieDialog_Pie);
pie.setPadding(40, 10, 40, 10);
builder.setView(view);
AlertDialog ad = builder.create();
return ad;
}
public void initialize(GUI_attrs gui_attrs, TransactionSet transactionSet, long groupIdentifier){
this.gui_attrs = gui_attrs;
this.transactionSet = transactionSet;
}
}
Just to extrapolate on my comment, it is your custom View object's responsibility to respect the padding that is set. You can do something like the following to make sure that you handle that case:
onMeasure()
int desiredWidth, desiredHeight;
desiredWidth = //Determine how much width you need
desiredWidth += getPaddingLeft() + getPaddingRight();
desiredHeight = //Determine how much height you need
desiredHeight += getPaddingTop() + getPaddingBottom();
int measuredHeight, measuredWidth;
//Check against the MeasureSpec -- if it's MeasureSpec.EXACTLY, or MeasureSpec.AT_MOST
//follow those restrictions to determine the measured dimension
setMeasuredDimension(measuredWidth, measuredHeight);
onLayout()
int leftOffset = getPaddingLeft();
int topOffset = getPaddingTop();
//layout your children (if any) according to the left and top offsets,
//rather than just 0, 0
onDraw()
canvas.translate (getPaddingLeft(), getPaddingTop());
//Now draw your stuff as normal

Custom Button with two TextView

I'm trying to Customize button with two TextView with different typeface within a single button. For that I just extended Button and with have written the following code inside the constructor,
LayoutInflater layoutInflater = (LayoutInflater) context
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View layout = layoutInflater.inflate(R.layout.custom_button,
(ViewGroup) findViewById(R.id.custom_button_view));
TextView firstTextView = (TextView) layout
.findViewById(R.id.firstTextView);
TextView secondTextView = (TextView) layout
.findViewById(R.id.secondTextView);
in the layout custom_button I have placed two TextView with different typeface and text and custom_button_view is the ID of that LinearLayout, what I got is an empty button with no text.
Any Ideas, Thanks.
You can use Layout as a button by setting ur custom button style to layout and can add two textViews to it, in this way:
<LinearLayout android:id="#+id/customButtonLayout"
android:layout_height="wrap_content" style="#android:style/Widget.Button"
android:layout_width="wrap_content">
<TextView android:text="First" android:id="#+id/firstTextView"
android:layout_width="wrap_content" android:layout_height="wrap_content"
android:textColor="#000"></TextView>
<TextView android:textColor="#000" android:text="Second"
android:layout_height="wrap_content" android:id="#+id/secondTextView"
android:layout_width="wrap_content" android:layout_marginLeft="10dp"></TextView>
</LinearLayout>
and in Activity you can have this to set different typeface:
Typeface font=Typeface.createFromAsset(getAssets(),"ARIALN.TTF") ;
Typeface font2=Typeface.createFromAsset(getAssets(), "COMPCTAN.TTF");
TextView firstTextView = (TextView)findViewById(R.id.firstTextView);
TextView secondTextView = (TextView)findViewById(R.id.secondTextView);
firstTextView.setTypeface(font);
secondTextView.setTypeface(font2);
LinearLayout btnLayout=(LinearLayout) findViewById(R.id.customButtonLayout);
btnLayout.setOnClickListener(this);
You can derive a new class from Button and override the onDraw(Canvas canvas) method. I did it for a button with an icon and a text, and it works without any xml. The main problem will be to write the text at the good place on the button. For this you can use the Paint.getTextBounds() function to get the text dimensions.
Using a LayoutInflater is probably a better practice, but I didn't manage to make it work.
public class CustomButton extends Button {
private int mWidth;
private int mHeight;
private Bitmap mBitmap;
private String mText;
private Paint mPaintIcon;
private Rect mRectIconSrc;
private Rect mRectIconDst;
private Paint mPaintText;
public CustomButton(Context context, Bitmap bitmap, int width, int height, String text) {
super(context);
mBitmap = bitmap;
mWidth = width;
mHeight = height;
mText = text;
RelativeLayout.LayoutParams params = new RelativeLayout.LayoutParams(width, height);
setLayoutParams(params);
mPaintIcon = new Paint();
mRectIconSrc = new Rect(0, 0, mBitmap.getWidth(), mBitmap.getHeight());
mRectIconDst = new Rect(0, 0, mHeight, mHeight);
mPaintText = new Paint();
mPaintText.setColor(0xFF778800);
mPaintText.setTextSize(30);
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.drawBitmap(mBitmap, mRectIconSrc, mRectIconDst, mPaintIcon);
canvas.drawText(mText, mWidth/4, mHeight*2/3, mPaintText);
}
}
You can surround the button with a FrameLayout and then add a textview within the FrameLayout. You can manage the typeface in the activity. If the text doesn't show try using bringToFront()
layout:
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
android:id="#+id/button_frame"
>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/button_border"
android:gravity="center"
android:onClick="onClick"
android:text="#string/get_more"
android:id="#+id/get_more"
android:stateListAnimator="#null"
/>
<TextView
android:id="#+id/linearTimer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_gravity="right"
android:padding="10dp"
android:text="123"
>
</FrameLayout>
Activity:
countDownView = (TextView) findViewById(R.id.linearTimer);
Typeface tf = Typeface.createFromAsset(getAssets(), "fonts/digital-7.ttf");
countDownView.setTypeface(tf);
countDownView.bringToFront();

Categories

Resources