I am creating a textview which looks similar to a page of notebook.So how could I create Lines in a textview? Someone could help??
You can use the notepad example but specifically look at the the NoteEditor.java the LineEditText class
public static 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.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);
}
}
Related
So I have this 9png :
And I have this image :
I need to achieve something like this:
This is the closest I can get to it:
This is how I tried to do it:
public class CustomView extends ImageView {
private Bitmap mImage;
private Bitmap mMask;
private int mPosX = 0;
private int mPosY = 0;
private final Paint maskPaint;
private final Paint imagePaint;
public CustomView(Context context) {
super(context);
maskPaint = new Paint();
maskPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
imagePaint = new Paint();
imagePaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.DST_OVER));
mImage = BitmapFactory.decodeResource(context.getResources(), R.drawable.dummy_video);
mMask = BitmapFactory.decodeResource(context.getResources(), R.drawable.friend_bubble);
}
#Override
public void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.save();
canvas.drawBitmap(mMask, 0, 0, maskPaint);
canvas.drawBitmap(mImage, mPosX, mPosY, imagePaint);
canvas.restore();
}
}
My guess is that the 9png just keeps on drawing and doesn't know when to stop.
Can anyone help? :)
This is my activity where i am using to draw the dotted line . but i want to draw gradient or some style in line ..
DragObserverLayout.java
//class for draw line from one place to another
public class DragObserverLayout extends RelativeLayout {
float startX, startY, stopX, stopY;
private Paint mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
private List<Rect> lines = new ArrayList<Rect>();
public List<Path> linePath = new ArrayList<Path>();
//class for dragging
public DragObserverLayout(Context context, AttributeSet attrs) {
super(context, attrs);
//setting color stroke and effect
mPaint.setColor(Color.RED);
mPaint.setStyle(Style.STROKE);
mPaint.setStrokeCap(Paint.Cap.BUTT);
mPaint.setPathEffect(new DashPathEffect(new float[] {5,5}, 0));
mPaint.setStrokeWidth(10.0f);
}
//for canvas
#Override
protected void dispatchDraw(Canvas canvas) {
super.dispatchDraw(canvas);
final int count = lines.size();
for (int i = 0; i < count; i++) {
final Rect r = lines.get(i);
canvas.drawLine(r.left, r.top, r.right, r.bottom, mPaint);
}
}
I want to have a line between each row in TextView.
Can original TextView do this?
If not, how can I do it?
ANSWER:
Thanks to #Slartibartfast reference and advice. I made a customized TextView. And I get something like this.
This is what I want!
The code:
public class LinedTextView extends TextView {
private Rect mRect;
private Paint mPaint;
public LinedTextView(Context context) {
super(context);
initialize();
}
public LinedTextView(Context context, AttributeSet attrs) {
super(context, attrs);
initialize();
}
public LinedTextView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
initialize();
}
private void initialize() {
mRect = new Rect();
mPaint = new Paint();
mPaint.setStyle(Paint.Style.STROKE);
mPaint.setColor(0x800000ff);
}
#Override
protected void onDraw(Canvas canvas) {
int cnt = getLineCount();
Rect r = mRect;
Paint paint = mPaint;
for (int i = 0; i < cnt; i++) {
int baseLine = getLineBounds(i, r);
canvas.drawLine(r.left, baseLine + 1, r.right, baseLine + 1, paint);
}
super.onDraw(canvas);
}
}
Use the following line of code below your TextView
<View android:layout_width="fill_parent"
android:layout_height="1px"
android:background="#android:color/background_dark" />
You can configure it according to your need.
You can also use ListView with divider.
I was taking a look at the notepad sample in the android SDK see here: http://developer.android.com/resources/samples/NotePad/src/com/example/android/notepad/NoteEditor.html
Thing is it only draws the current line the cursor is on e.g http://cdn2.staztic.com/screenshots/simple-notepad-app-al-1.jpg
But I'd like to display lines that fill up the screen e.g. http://www.itismyworld.info/wp-content/uploads/2010/03/AK-notebook.png
Any suggestions would be great. The relevent bit of code seems to be here:
protected void onDraw(Canvas canvas) {
// Gets the number of lines of text in the View.
int count = getLineCount();
// Gets the global Rect and Paint objects
Rect r = mRect;
Paint paint = mPaint;
/*
* Draws one line in the rectangle for every line of text in the EditText
*/
for (int i = 0; i < count; i++) {
// Gets the baseline coordinates for the current line of text
int baseline = getLineBounds(i, r);
/*
* Draws a line in the background from the left of the rectangle to the right,
* at a vertical position one dip below the baseline, using the "paint" object
* for details.
*/
canvas.drawLine(r.left, baseline + 1, r.right, baseline + 1, paint);
}
// Finishes up by calling the parent method
super.onDraw(canvas);
}
This is the code, based on jkhouws1's suggestion and google's note editor
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(R.color.edit_note_line); //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);
}
}
In Eclipse IDE press Ctrl+Shift+O to add all needed imports
I think this is what you need:
public class LinedEditText extends EditText {
private static Paint linePaint;
static {
linePaint = new Paint();
linePaint.setColor(Color.BLACK);
linePaint.setStyle(Style.STROKE);
}
public LinedEditText(Context context, AttributeSet attributes) {
super(context, attributes);
}
#Override
protected void onDraw(Canvas canvas) {
Rect bounds = new Rect();
int firstLineY = getLineBounds(0, bounds);
int lineHeight = getLineHeight();
int totalLines = Math.max(getLineCount(), getHeight() / lineHeight);
for (int i = 0; i < totalLines; i++) {
int lineY = firstLineY + i * lineHeight;
canvas.drawLine(bounds.left, lineY, bounds.right, lineY, linePaint);
}
super.onDraw(canvas);
}
}
maybe after that for loop, you draw estimated* additional lines.
getHeight() will return EditText's height in pixels
getLineHeight() will height of one standard line
so getHeight/getlineHeight-getCount will be number of lines left to draw.
you can't use getLineBounds, using the above functions you could calculate the position of the remaining lines to draw.
*Estimated since formatting of text could change the line height, but since there is no text in these lines yet that shouldnt be an issue. But for that same reason you should only draw the remaining lines, and not use this to draw all the lines.
<com.example.goh2.pronoornotepad.LinedEditText
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#ffffcc4b"
android:gravity="top|left"
android:singleLine="false"
android:text=""
/>
The above XML works with the code from Max4ever's answer:
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(R.color.edit_note_line); //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);
}
}
Is it possible to show pagelines in a EditText?
I mean these lines:
Let's say my EditText is 500 by 500 pixels in size. I want those lines to be visible across that 500 by 500 square.
Is there a build in way to do this? I already tried Google but I couldn't find an answer.
I guess my other option is to dynamically create a graphic based on the textheight and linespacing, such an ugly work-around.
The notepad application sample from the android dev site shows you how to do this.
http://developer.android.com/resources/samples/NotePad/index.html
Looks like this (scroll down for code):
Most of the relevant code is in this file. Pay attention to the LinedEditText inner class. It is defined within the activity. It draws the lines required.
Inside the activity onCreate() method, setContentView(R.id.note_editor) is set as the view, it is defined like here
Snippet extracted from here. Update: Code modified by #Pieter888 to draw lines on the entire EditText control.
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.Rect;
import android.util.AttributeSet;
import android.widget.EditText;
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(0xFF000000);
}
/**
* This is called to draw the LinedEditText object
* #param canvas The canvas on which the background is drawn.
*/
#Override
protected void onDraw(Canvas canvas)
{
int height = canvas.getHeight();
int curHeight = 0;
Rect r = mRect;
Paint paint = mPaint;
int baseline = getLineBounds(0, r);
for (curHeight = baseline + 1; curHeight < height;
curHeight += getLineHeight())
{
canvas.drawLine(r.left, curHeight, r.right, curHeight, paint);
}
super.onDraw(canvas);
}
}
#gideon's answer above works well but has an issue when you enter more text in the edittext because more lines are not drawn accordingly. To solve this, I wrote an override for onMeasure() and called invalidate(). and more lines will be drawn when text increases.
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec,heightMeasureSpec);
invalidate();
}
The code now is:
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.graphics.Rect;
import android.util.AttributeSet;
import android.widget.EditText;
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(0xFF000000);
}
/**
* This is called to draw the LinedEditText object
* #param canvas The canvas on which the background is drawn.
*/
#Override
protected void onDraw(Canvas canvas)
{
int height = canvas.getHeight();
int curHeight = 0;
Rect r = mRect;
Paint paint = mPaint;
int baseline = getLineBounds(0, r);
for (curHeight = baseline + 1; curHeight < height;
curHeight += getLineHeight())
{
canvas.drawLine(r.left, curHeight, r.right, curHeight, paint);
}
super.onDraw(canvas);
}
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec,heightMeasureSpec);
invalidate();
}
}
#gideon's code works but more lines not be drawn
you must just change canvas.getHeight() to getHeight() as following below:
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(ResourcesCompat.getColor(getResources(), R.color.blue,null));
}
#Override
protected void onDraw(Canvas canvas)
{
int height = getHeight();
int curHeight = 0;
Rect r = mRect;
Paint paint = mPaint;
int baseline = getLineBounds(0, r);
for (curHeight = baseline + 1; curHeight < height;
curHeight += getLineHeight())
{
canvas.drawLine(r.left, curHeight, r.right, curHeight, paint);
}
super.onDraw(canvas);
}