Develop Reference

onTouchEvent on Path

I figured out that the width of the RectF is 0.0 so thats why it is always false. So can I set the width of the RectF width the StrokeWidth?
I have a path. And I want to handle clicks on it.
So I found out I can check that with an onTouchEvent.
So in the OnDraw() Method I draw a path and add the bounds to a rectF where I can get the left, right, top, bottom in the onTouchEvent correctly I guess.
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.util.Log;
import android.view.MotionEvent;
import android.view.View;
import android.widget.Toast;
public class PathTest extends View {
Paint paint;
Path path;
RectF rectF = new RectF();
public PathTest(Context context) {
super(context);
init();
}
public PathTest(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
public PathTest(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init();
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
path.moveTo((float)getWidth()/2,getHeight()-20);
path.lineTo((float)getWidth()/2,20);
path.close();
path.computeBounds(rectF,true);
canvas.drawPath(path,paint);
}
private void init(){
paint = new Paint();
paint.setColor(Color.RED);
paint.setStrokeWidth(100);
paint.setAntiAlias(true);
paint.setStyle(Paint.Style.STROKE);
path = new Path();
}
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
int height = MeasureSpec.getSize(heightMeasureSpec);
int width = MeasureSpec.getSize(widthMeasureSpec);
setMeasuredDimension(width,height/2);
}
#Override
public boolean onTouchEvent(MotionEvent event) {
if(event.getAction() == MotionEvent.ACTION_DOWN){
if(rectF.contains(event.getX(),event.getY())){
Log.d("HALLO","HI");
}else{
Log.d("HALLO","left"+rectF.left+" top"+rectF.top+" right"+rectF.right+" bottom"+rectF.bottom + " x->"+event.getX()+" y->"+event.getY());
}
}
return super.onTouchEvent(event);
}
}
It is always the else. I don't know why.
So I log the rectF Coordinates and the MotionEvent.ACTION_DOWN event.
D/HALLO: left540.0 top20.0 right540.0 bottom2240.0 x->528.0 y->490.0
D/HALLO: left540.0 top20.0 right540.0 bottom2240.0 x->1047.0 y->1021.0
D/HALLO: left540.0 top20.0 right540.0 bottom2240.0 x->1016.0 y->961.0
D/HALLO: left540.0 top20.0 right540.0 bottom2240.0 x->1059.0 y->1062.0```

Hexagon shaped ProgressBar

I am trying to make a game where a user gains experience points and his level increases as shown in the image below.
I was thinking of achieving this with the use of progress bar,but I am not able to make a progress bar with the shape of a Hexagon.
The yellow line should increase as the users points increase.
Can anyone give me ideas on how I can achieve this??(I tried Custom ProgressBar,but it did not work.)
Thanks.

I managed to change the code that Nilesh mentioned and made a progressbar which did not have any curves.
This works fine for me.
Now I just have to figure out how to insert the image inside the progressbar. :p
package com.example.benedict.progress;
import android.animation.ObjectAnimator;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Matrix;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.PathMeasure;
import android.graphics.RectF;
import android.support.annotation.Nullable;
import android.util.AttributeSet;
import android.util.Log;
import android.view.View;
import android.widget.ImageButton;
import android.widget.ImageView;
public class V extends View implements View.OnClickListener {
Path segment = new Path();
Paint paint = new Paint();
PathMeasure pm;
String TAG = "View";
Path path;
public V(Context context) {
super(context);
init();
}
public V(Context context, #Nullable AttributeSet attrs) {
super(context, attrs);
init();
}
public V(Context context, #Nullable AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init();
}
public V(Context context, #Nullable AttributeSet attrs, int defStyleAttr, int defStyleRes) {
super(context, attrs, defStyleAttr, defStyleRes);
init();
}
void init() {
setOnClickListener(this);
paint.setColor(0xaa00ff00);
paint.setStyle(Paint.Style.STROKE);
paint.setStrokeWidth(10);
paint.setStrokeCap(Paint.Cap.ROUND);
}
#Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
Path src = new Path();
src.moveTo(8.80000f, 0.630000f);//0
src.lineTo(26.030001f, 0.630000f);//1
src.lineTo(32.109999f, 14.030000f);//2
src.lineTo(26.030001f, 28.440001f);//3
src.lineTo(7.800000f, 28.440001f);//4
src.lineTo(2.200000f, 14.030000f);//5
src.lineTo(8.80000f, 0.630000f);//6
Matrix m = new Matrix();
RectF srcRect = new RectF(0, 0, 32, 40);
RectF dstRect = new RectF(0, 0, w, h);
dstRect.inset(paint.getStrokeWidth() / 2, paint.getStrokeWidth() / 2);
m.setRectToRect(srcRect, dstRect, Matrix.ScaleToFit.CENTER);
Path dst = new Path();
src.transform(m, dst);
pm = new PathMeasure(dst, true);
pm.getSegment(0, pm.getLength() / 2, segment, true);
// segment.rLineTo(0, 0);
setProgress(pm.getLength());
}
void setProgress(float progress) {
segment.reset();
float start = 0;
float end = (progress);
if (start < end) {
pm.getSegment(start, end, segment, true);
} /*else {
pm.getSegment(start, length, segment, true);
// pm.getSegment(0, end, segment, true);
}*/
segment.rLineTo(0, 0);
invalidate();
}
#Override
public void onClick(View v) {
ObjectAnimator.ofFloat(this, "progress", 0,
pm.getLength()).setDuration(5 * 2500).start();
Log.d(TAG, pm.getLength() + "");
}
#Override
protected void onDraw(Canvas canvas) {
canvas.drawPath(segment, paint);
}
}
activity_main.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/loading_status"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:gravity="center_horizontal"
android:orientation="vertical"
android:background="#000"
android:visibility="visible" >
<com.example.benedict.progress.V
android:id="#+id/progress"
android:src="#drawable/poster1"
android:scaleType="centerCrop"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="visible" />
</LinearLayout>

x coordinate with canvas.draw with custom textview not working

I had successfully created an answer of my This question(left drawable alignment with text in andorid)
but the problem is that the canvas.drawText x co-ordinate is not working properly as the x co-ordinate is not affecting the position of text.
Here is the result with overlapped text on drawable,
I just wanted to remove the overlap and give the distance between the drawable and text on canvas.
Here is my code as follows,
import android.annotation.TargetApi;
import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.drawable.Drawable;
import android.os.Build;
import android.support.annotation.NonNull;
import android.support.annotation.Nullable;
import android.util.AttributeSet;
android.widget.TextView;
import cl.tt.R;
public class CenterDrawableButton extends TextView{
private Drawable mDrawableCenter;
public CenterDrawableButton(Context context) {
super(context);
init(context, null);
}
public CenterDrawableButton(Context context, AttributeSet attrs) {
super(context, attrs);
init(context, attrs);
}
public CenterDrawableButton(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
init(context, attrs);
}
#TargetApi(Build.VERSION_CODES.LOLLIPOP)
public CenterDrawableButton(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
super(context, attrs, defStyleAttr, defStyleRes);
init(context, attrs);
}
private void init(Context context, AttributeSet attrs){
if(attrs!=null){
TypedArray a = context.getTheme().obtainStyledAttributes(attrs, R.styleable.CenterDrawableButton, 0, 0);
try {
setCenterDrawable(a.getDrawable(R.styleable.CenterDrawableButton_drawableCenter));
} finally {
a.recycle();
}
}
}
public void setCenterDrawable(#Nullable Drawable center) {
int[] state;
state = getDrawableState();
if (center != null) {
center.setState(state);
center.setBounds(0, 0, center.getIntrinsicWidth(), center.getIntrinsicHeight());
center.setCallback(this);
}
mDrawableCenter = center;
invalidate();
requestLayout();
}
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
if (mDrawableCenter != null) {
setMeasuredDimension(Math.max(getMeasuredWidth(), mDrawableCenter.getIntrinsicWidth()),
Math.max(getMeasuredHeight(), mDrawableCenter.getIntrinsicHeight()));
}
}
#Override
protected void drawableStateChanged() {
super.drawableStateChanged();
if (mDrawableCenter != null) {
int[] state = getDrawableState();
mDrawableCenter.setState(state);
mDrawableCenter.setBounds(0, 0, mDrawableCenter.getIntrinsicWidth(),
mDrawableCenter.getIntrinsicHeight());
}
invalidate();
}
#Override
protected void onDraw(#NonNull Canvas canvas) {
super.onDraw(canvas);
if (mDrawableCenter != null) {
float textWidth = getPaint().measureText((String)getText());
int newPosition=getWidth()-((int)textWidth+getPaddingLeft() + getPaddingRight()+mDrawableCenter.getIntrinsicWidth()+ (int)getResources().getDimension(R.dimen._5sdp));
if(newPosition>0) {
canvas.translate(newPosition, (getHeight() - mDrawableCenter.getIntrinsicHeight()) / 2);
mDrawableCenter.draw(canvas);
canvas.save();
Paint textPaint = new Paint();
int yPos = (int) ((getHeight() - ((textPaint.descent() + textPaint.ascent())) / 2));
canvas.drawText(getText().toString(), newPosition, yPos, textPaint);
canvas.restore();
}else
{
int gnewPosition=getPaddingLeft() + getPaddingRight()+(int)getResources().getDimension(R.dimen._5sdp);
canvas.translate(gnewPosition, (getHeight() - mDrawableCenter.getIntrinsicHeight()) / 2);
mDrawableCenter.draw(canvas);
canvas.save();
int nggewPosition=getPaddingLeft() + getPaddingRight()+mDrawableCenter.getIntrinsicWidth()+ (int)getResources().getDimension(R.dimen._5sdp);
Paint textPaint = new Paint();
int yPos = (int) (getHeight() - ((textPaint.descent() + textPaint.ascent())) / 2);
canvas.translate(nggewPosition, yPos);
canvas.drawText(getText().toString(), nggewPosition, yPos, textPaint);
canvas.restore();
}
}
}
}
here is the attr,
<attr name="drawableCenter" format="reference"/>
<declare-styleable name="CenterDrawableButton">
<attr name="drawableCenter"/>
</declare-styleable>

How ADT Determines that this is a Layout?

I have written a class following some Android Tutorials. The class is stored as
"ToDoList\src\com.example.todolist\ToDoListItemView.java"
package com.example.todolist;
import android.content.Context;
import android.content.res.Resources;
import android.graphics.Canvas;
import android.graphics.Paint;
import android.util.AttributeSet;
import android.widget.TextView;
public class ToDoListItemView extends TextView{
private Paint marginPaint,linePaint;
private int paperColor;
private float margin;
public ToDoListItemView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
init();
}
public ToDoListItemView(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
public ToDoListItemView(Context context) {
super(context);
init();
}
private void init(){
Resources myResources = getResources();
//Create the paint resources to be used in the onDraw method
marginPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
marginPaint.setColor(myResources.getColor(R.color.notepad_margin));
linePaint = new Paint(Paint.ANTI_ALIAS_FLAG);
linePaint.setColor(myResources.getColor(R.color.notepad_lines));
//Get paper background color and margin width
paperColor = myResources.getColor(R.color.notepad_paper);
margin = myResources.getDimension(R.dimen.notepad_margin);
}
#Override
public void onDraw(Canvas canvas) {
canvas.drawColor(paperColor);
//Draw ruled lines
canvas.drawLine(0, 0, 0, getMeasuredHeight(), linePaint);
canvas.drawLine(0, getMeasuredHeight(), getMeasuredWidth(), getMeasuredHeight(), linePaint);
//Draw margin
canvas.drawLine(margin, 0, margin, getMeasuredHeight(), marginPaint);
//Move text across from the margin
canvas.save();
canvas.translate(margin, 0);
//Render
super.onDraw(canvas);
canvas.restore();
}
}
When I create a new layout in
"ToDoList\res\layout"
with any name, it I type "com.", it automatically recommends me the path
"com.example.todolist.ToDoListItemView"
I would like to know that what distinguishing feature in my "ToDoListItemView.java" made eclipse believe that it is a layout?

It recommends ToDoListItemView because it's a CustomView.
Eclipse recognizes that your class ToDoListItemView is derived from TextView which is derived from View.
All classes extending View can be used in a layout.
If your class does not in some way extend View, it cannot be placed into a layout.

Android Clip drawText to Paint over that text

I am new to 2d graphics..
I create a text using drawText method.
I have to paint over the drawtext area..
how can i clip the area of the text and paint over the surface
package com.example.testingcanvas;
import android.app.Activity;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.graphics.Rect;
import android.os.Bundle;
import android.util.AttributeSet;
import android.view.MotionEvent;
import android.view.View;
public class MainActivity extends Activity {
class MyCustomView extends View {
private float x = 0, y = 0;
Path path = new Path();
Paint paint = new Paint();
Bitmap bm = BitmapFactory.decodeResource(getResources(), R.drawable.ii);
private Rect m_ImageRect;
private Rect m_TextRect;
Context m_Context;
// you need these constructor
// you can init paint object or anything on them
public MyCustomView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
m_Context = context;
}
public MyCustomView(Context context, AttributeSet attrs) {
super(context, attrs);
m_Context = context;
}
public MyCustomView(Context context) {
super(context);
m_Context = context;
}
// then override on draw method
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
paint.setAntiAlias(true);
paint.setColor(Color.GREEN);
paint.setStyle(Paint.Style.STROKE);
paint.setStrokeJoin(Paint.Join.ROUND);
paint.setStrokeWidth(3);
paint.setTextSize(100);
// here frist create two rectangle
// one for your image and two for text you want draw on it
m_ImageRect = canvas.getClipBounds();
m_TextRect = canvas.getClipBounds();
// it gives you an area that can draw on it,
// the width and height of your rect depend on your screen size
// device
canvas.save();
canvas.drawBitmap(bm, null, m_ImageRect, paint);
canvas.drawPath(path, paint);
canvas.restore();
canvas.save();
canvas.clipRect(m_TextRect);
canvas.drawText("A", 100, 300, paint);
// canvas.drawText("A", 20, 20,50,50, paint);
// canvas.restore();
}
public boolean onTouchEvent(MotionEvent event) {
// TODO Auto-generated method stub
int action = event.getAction();
switch (action) {
case MotionEvent.ACTION_MOVE:
x = event.getX();
y = event.getY();
path.lineTo(x, y);
break;
case MotionEvent.ACTION_DOWN:
x = event.getX();
y = event.getY();
path.moveTo(x, y);
break;
case MotionEvent.ACTION_UP: {
}
default:
}
invalidate();
return true;
}
}
/** Called when the activity is first created. */
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(new MyCustomView(this));
}
public void onBackPressed() {
int pid = android.os.Process.myPid();
android.os.Process.killProcess(pid);
finish();
onDestroy();
}
}
i am trying to draw over the text area.but i cant get it.