How to make usable padding space around circle in canvas (Android) - java

I am having problems displaying dots on the outer ring of a circle. When a dot is placed at one of the edges of the circle, the dot is half cut off . Screenshot: https://drive.google.com/file/d/0B9BaYaKRY3v3Y2hXYkpSOE1nY28/edit?usp=sharing
I simply want to make the circles radius a litte smaller so there is some space around it where the outer dots have got some space. Of course the circle must still stay in the middle of the view. Tipps on how to do this are very appreciated.
The working code blow is fully working accept for the fact that the dots are being cut off. (Thanks to #Sherif elKhatib for the help on creating a 2 color circle)
public class PercentView extends View {
public PercentView(Context context) {
super(context);
init();
}
public PercentView(Context context, AttributeSet attrs) {
super(context, attrs);
init();
}
public PercentView(Context context, AttributeSet attrs, int defStyle) {
super(context, attrs, defStyle);
init();
}
private void init() {
paint = new Paint();
paint.setColor(Color.parseColor("#3498db"));
paint.setAntiAlias(true);
paint.setStyle(Paint.Style.FILL);
bgpaint = new Paint();
bgpaint.setColor(Color.parseColor("#2980b9"));
bgpaint.setAntiAlias(true);
bgpaint.setStyle(Paint.Style.FILL);
rect = new RectF();
circlePaint = new Paint();
}
Paint paint;
Paint bgpaint;
RectF rect;
float percentage = 5;
Paint circlePaint;
float[] dots = new float[1000];
int dotsNum = -1;
String[] colorCode = new String[1000];
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
// draw background circle anyway
canvas.drawArc(rect, -90, 360, true, bgpaint);
if (percentage != 0) {
int left = 0;
int width = getWidth();
int top = 0;
rect.set(left, top, left + width, top + width);
canvas.drawArc(rect, -90, (float) (3.6 * percentage), true, paint);
for (int i = 0; i <= dotsNum; i++) {
circlePaint.setAntiAlias(true);
circlePaint.setColor(Color.parseColor(colorCode[i]));
circlePaint.setStyle(Paint.Style.FILL);
float dotX = (float) (this.getWidth() / 2 + this.getWidth() / 2
* Math.cos((dots[i] * 3.6 - 90) * Math.PI / 180));
float dotY = (float) (this.getHeight() / 2 + this.getWidth()
/ 2 * Math.sin((dots[i] * 3.6 - 90) * Math.PI / 180));
canvas.drawCircle(dotX, dotY, 30, circlePaint);
}
}
}
public void setPercentage(float inpercentage) {
this.percentage = inpercentage;
invalidate();
}
public void setDot(int type) {
dotsNum++;
switch (type) {
case 0:
colorCode[dotsNum] = "#27ae60";
break;
case 1:
colorCode[dotsNum] = "#f1c40f";
break;
case 2:
colorCode[dotsNum] = "#e74c3c";
break;
case 3:
colorCode[dotsNum] = "#34495e";
break;
}
dots[dotsNum] = percentage;
invalidate();
}
}

The only one working approach for me was that piece of code "width = getWidth() - padding". Kudos #Catherine.

Related

Add a delay timer in Android Studio

FaceView.java
package com.example.richelle.neeuro;
public class FaceView extends View {
private float radius;
NormalFace normalFace;
HappyFace happyFace;
public FaceView(Context context, AttributeSet attrs) {
super(context, attrs);
// get radius value
TypedArray a = context.getTheme().obtainStyledAttributes(
attrs,
R.styleable.FaceView,
0, 0
);
try {
radius = a.getDimension(R.styleable.FaceView_radius, 20.0f);
} finally {
a.recycle();
}
// initiate HappyFace class
normalFace = new NormalFace(radius);
happyFace = new HappyFace(radius);
}
Handler setDelay;
Runnable startDelay;
#Override
protected void onDraw(final Canvas canvas) {
super.onDraw(canvas);
normalFace.draw(canvas);
//delay timer
setDelay = new Handler();
startDelay = new Runnable() {
#Override
public void run() {
happyFace.draw(canvas);
}
};
setDelay.postDelayed(startDelay,5000);
}
#Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
int desiredWidth = (int) radius*2+(int) Math.ceil((radius/1.70));
int desiredHeight = (int) radius*2+(int)Math.ceil((radius/1.70));
int widthMode = MeasureSpec.getMode(widthMeasureSpec);
int widthSize = MeasureSpec.getSize(widthMeasureSpec);
int heightMode = MeasureSpec.getMode(heightMeasureSpec);
int heightSize = MeasureSpec.getSize(heightMeasureSpec);
int width;
int height;
//Measure Width
if (widthMode == MeasureSpec.EXACTLY) {
//Must be this size
width = widthSize;
} else if (widthMode == MeasureSpec.AT_MOST) {
//Can't be bigger than...
width = Math.min(desiredWidth, widthSize);
Log.d("Width AT_MOST", "width: "+width);
} else {
//Be whatever you want
width = desiredWidth;
Log.d("Width ELSE", "width: "+width);
}
//Measure Height
if (heightMode == MeasureSpec.EXACTLY) {
//Must be this size
height = heightSize;
} else if (heightMode == MeasureSpec.AT_MOST) {
//Can't be bigger than...
height = Math.min(desiredHeight, heightSize);
} else {
//Be whatever you want
height = desiredHeight;
}
//MUST CALL THIS
setMeasuredDimension(width, height);
}
public float getRadius() {
return radius;
}
public void setRadius(float radius) {
this.radius = radius;
}
}
NormalFace.java
public class NormalFace {
//Paint object
Paint facePaint;
Paint mePaint;
float radius;
float adjust;
float mouthLeftX, mouthRightX, mouthTopY, mouthBottomY;
RectF mouthRectF;
Path mouthPath;
float eyeLeftX, eyeRightx, eyeTopY, eyeBottomY;
RectF eyeLeftRectF, eyeRightRectF;
public NormalFace(float radius){
this.radius= radius;
facePaint = new Paint();
facePaint.setColor(0xfffed325); // face color - yellow
facePaint.setDither(true);
facePaint.setStrokeJoin(Paint.Join.ROUND);
facePaint.setStrokeCap(Paint.Cap.ROUND);
facePaint.setPathEffect(new CornerPathEffect(10) );
facePaint.setAntiAlias(true);
facePaint.setShadowLayer(4, 2, 2, 0x80000000);
mePaint = new Paint();
mePaint.setColor(0xff2a2a2a); //black
mePaint.setDither(true);
mePaint.setStyle(Paint.Style.STROKE);
mePaint.setStrokeJoin(Paint.Join.ROUND);
mePaint.setStrokeCap(Paint.Cap.ROUND);
mePaint.setPathEffect(new CornerPathEffect(10) );
mePaint.setAntiAlias(true);
mePaint.setStrokeWidth(radius / 14.0f);
adjust = radius / 3.2f;
// Left Eye
eyeLeftX = radius-(radius*0.43f);
eyeRightx = eyeLeftX + (radius*0.3f);
eyeTopY = radius-(radius*0.5f);
eyeBottomY = eyeTopY + (radius*0.4f);
eyeLeftRectF = new RectF(eyeLeftX+adjust,eyeTopY+adjust,eyeRightx+adjust,eyeBottomY+adjust);
// Right Eye
eyeLeftX = eyeRightx + (radius*0.3f);
eyeRightx = eyeLeftX + (radius*0.3f);
eyeRightRectF = new RectF(eyeLeftX+adjust,eyeTopY+adjust,eyeRightx+adjust,eyeBottomY+adjust);
// Mouth
mouthLeftX = radius-(radius/2.0f);
mouthRightX = mouthLeftX+ radius;
// mouthTopY = 125 - (125*0.01f);
// mouthBottomY = mouthTopY + (125*0.01f);
mouthTopY = radius - (radius*(-0.2f));
mouthBottomY = mouthTopY + (radius*0.01f);
mouthRectF = new RectF(mouthLeftX+adjust,mouthTopY+adjust,mouthRightX+adjust,mouthBottomY+adjust);
//mouthRectF = new RectF(mouthLeftX+adjust,mouthTopY+70,mouthRightX+adjust,mouthBottomY+20); //a line
mouthPath = new Path();
mouthPath.arcTo(mouthRectF, 30, 120, true);
// mouthPath.arcTo(mouthRectF, 15, 135, true);
}
public void draw(Canvas canvas) {
// 1. draw face
canvas.drawCircle(radius+adjust, radius+adjust, radius, facePaint);
// 2. draw mouth
mePaint.setStyle(Paint.Style.STROKE);
canvas.drawPath(mouthPath, mePaint);
//canvas.drawLine(90, 155, 176, 155, mePaint);
// 3. draw eyes
mePaint.setStyle(Paint.Style.FILL);
canvas.drawArc(eyeLeftRectF, 0, 360, true, mePaint);
canvas.drawArc(eyeRightRectF, 0, 360, true, mePaint);
}
}
HappyFace.java
public class HappyFace {
//Paint object
Paint facePaint;
Paint mePaint;
float radius;
float adjust;
float mouthLeftX, mouthRightX, mouthTopY, mouthBottomY;
RectF mouthRectF;
Path mouthPath;
float eyeLeftX, eyeRightx, eyeTopY, eyeBottomY;
RectF eyeLeftRectF, eyeRightRectF;
public HappyFace(float radius){
this.radius= radius;
facePaint = new Paint();
facePaint.setColor(0xfffed325); // face color - yellow
facePaint.setDither(true);
facePaint.setStrokeJoin(Paint.Join.ROUND);
facePaint.setStrokeCap(Paint.Cap.ROUND);
facePaint.setPathEffect(new CornerPathEffect(10) );
facePaint.setAntiAlias(true);
facePaint.setShadowLayer(4, 2, 2, 0x80000000);
mePaint = new Paint();
mePaint.setColor(0xff2a2a2a); //black
mePaint.setDither(true);
mePaint.setStyle(Paint.Style.STROKE);
mePaint.setStrokeJoin(Paint.Join.ROUND);
mePaint.setStrokeCap(Paint.Cap.ROUND);
mePaint.setPathEffect(new CornerPathEffect(10) );
mePaint.setAntiAlias(true);
mePaint.setStrokeWidth(radius / 14.0f);
adjust = radius / 3.2f;
// Left Eye
eyeLeftX = radius-(radius*0.43f);
eyeRightx = eyeLeftX + (radius*0.3f);
eyeTopY = radius-(radius*0.5f);
eyeBottomY = eyeTopY + (radius*0.4f);
eyeLeftRectF = new RectF(eyeLeftX+adjust,eyeTopY+adjust,eyeRightx+adjust,eyeBottomY+adjust);
// Right Eye
eyeLeftX = eyeRightx + (radius*0.3f);
eyeRightx = eyeLeftX + (radius*0.3f);
eyeRightRectF = new RectF(eyeLeftX+adjust,eyeTopY+adjust,eyeRightx+adjust,eyeBottomY+adjust);
// Smiley Mouth
mouthLeftX = radius-(radius/2.0f);
mouthRightX = mouthLeftX+ radius;
mouthTopY = radius - (radius*0.2f);
mouthBottomY = mouthTopY + (radius*0.5f);
mouthRectF = new RectF(mouthLeftX+adjust,mouthTopY+adjust,mouthRightX+adjust,mouthBottomY+adjust);
mouthPath = new Path();
mouthPath.arcTo(mouthRectF, 30, 120, true);
}
public void draw(Canvas canvas) {
// 1. draw face
canvas.drawCircle(radius+adjust, radius+adjust, radius, facePaint);
// 2. draw mouth
mePaint.setStyle(Paint.Style.STROKE);
canvas.drawPath(mouthPath, mePaint);
// 3. draw eyes
mePaint.setStyle(Paint.Style.FILL);
canvas.drawArc(eyeLeftRectF, 0, 360, true, mePaint);
canvas.drawArc(eyeRightRectF, 0, 360, true, mePaint);
}
}
FaceView.java is to display the different facial expressions in the canvas. The NormalFace.java and HappyFace.java are the UI of the different facial expressions. I want to add a delay timer in FaceView.java so that the display of the normal face can be change to a happy face after the timer had finished counting down.
Use this: ms is delay in millisecond
try {
Thread.sleep(ms);
} catch (InterruptedException e) {
e.printStackTrace();
}
You can use Handler class for this in android.Handler has a method postDelayed(),you can use this method for the delay,read about handler from here
Runnable happy = new Runnable() {
public void run() {
happyFace(); //suppose this is the method for happy face
}
};
and then call this method like this after 5 sec
handler.postDelayed(happy,5000);
It will post your code to be run after 5 sec
You can use Handler to delay your next task
import android.os.Handler;
Handler handler=new Handler();
Runnable r=new Runnable() {
public void run() {
// Your next task
}
};
handler.postDelayed(r, 30000);
30000 is the value of delay in milli seconds which makes it 30 secs

using nine patch images to draw to a canvas in android studio

I am currently using canvas.drawCircle() method to draw dots that represent objects on my screen. I am having trouble using nine patch images instead of circles. Could someone provide an example on how I can implement this?
public class SnakeView extends View {
private Paint mPaint = new Paint();
private TileType snakeViewMap[][];
public SnakeView(Context context, #Nullable AttributeSet attrs) {
super(context, attrs);
}
public void setSnakeViewMap(TileType[][] map) { this.snakeViewMap = map; }
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
if(snakeViewMap != null) {
float tileSizeX = canvas.getWidth() / snakeViewMap.length;
float tileSizeY = canvas.getHeight() / snakeViewMap[0].length;
float circleSize = Math.min(tileSizeX, tileSizeY) / 2;
for (int x = 0; x < snakeViewMap.length; x++) {
for (int y = 0; y <snakeViewMap[x].length; y++) {
switch (snakeViewMap[x][y]) {
case Nothing:
mPaint.setColor(Color.WHITE);
break;
case Wall:
mPaint.setColor(Color.RED);
break;
case SnakeHead:
mPaint.setColor(Color.BLACK);
break;
case SnakeTail:
mPaint.setColor(Color.GREEN);
break;
case Apple:
mPaint.setColor(Color.RED);
break;
}
canvas.drawCircle(x * tileSizeX + tileSizeX / 2f + circleSize / 2, y * tileSizeY + tileSizeY /2f + circleSize / 2, circleSize, mPaint);
}
}
}
}
}

Custom ImageView loses transparency as soon as it goes out of screen in recycleView

I have a custom ImageView that overrides onDraw method to crop corners using Path to give rounded corner of given radius. I have a RecyclerView where I have these custom ImageView in all of the 4 items. Now the problem is this custom ImageView renders fine for the first time it shows up in the list. Only 2 accommodate in the screen at a time. As I scroll down everything is fine in all views. I can see rounded corner in all of them. But when I scroll up to previous item. Now these corner lose their transparency in corners and become black in all but third item in the list. Canvas in onDraw also has isOpaque = true. I have tried many things but nothing seem to be working. Here is the code
public class RoundedImageView extends ImageView
{
private Paint mPaint;
private int mCornerRadius = 0;
private boolean mRoundedTopLeft = true, mRoundedBottomLeft = true, mRoundedTopRight = true, mRoundedBottomRight = true;
public void setCornerRadius(int mCornerRadius)
{
this.mCornerRadius = mCornerRadius;
}
public void RoundCorners(boolean isRoundedTopLeft, boolean isRoundedTopRight, boolean isRoundedBottomLeft, boolean isRoundedBottomRight)
{
mRoundedTopLeft = isRoundedTopLeft;
mRoundedBottomLeft = isRoundedBottomLeft;
mRoundedBottomRight = isRoundedBottomRight;
mRoundedTopRight = isRoundedTopRight;
}
public RoundedImageView(Context context)
{
super(context);
if (Build.VERSION.SDK_INT >= 11)
setLayerType(View.LAYER_TYPE_SOFTWARE, null);
setupPaint();
}
public RoundedImageView(Context context, AttributeSet attrs)
{
super(context, attrs);
if (Build.VERSION.SDK_INT >= 11)
setLayerType(View.LAYER_TYPE_SOFTWARE, null);
setupPaint();
}
public RoundedImageView(Context context, AttributeSet attrs, int defStyleAttr)
{
super(context, attrs, defStyleAttr);
if (Build.VERSION.SDK_INT >= 11)
setLayerType(View.LAYER_TYPE_SOFTWARE, null);
setupPaint();
}
#TargetApi(21)
public RoundedImageView(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes)
{
super(context, attrs, defStyleAttr, defStyleRes);
if (Build.VERSION.SDK_INT >= 11)
setLayerType(View.LAYER_TYPE_SOFTWARE, null);
setupPaint();
}
private Paint setupPaint()
{
mPaint = new Paint();
mPaint.setColor(Color.TRANSPARENT);
mPaint.setStyle(Paint.Style.FILL_AND_STROKE);
mPaint.setAntiAlias(true);
mPaint.setDither(true);
mPaint.setStrokeWidth(1);
mPaint.setStrokeJoin(Paint.Join.ROUND);
mPaint.setStrokeCap(Paint.Cap.ROUND);
mPaint.setXfermode(new PorterDuffXfermode(PorterDuff.Mode.CLEAR));
return mPaint;
}
#Override
protected void onDraw(Canvas canvas)
{
super.onDraw(canvas);
Path path = RoundedRect(0, 0, getWidth(), getHeight(), mCornerRadius, mCornerRadius,
mRoundedTopLeft, mRoundedTopRight, mRoundedBottomRight, mRoundedBottomLeft);
canvas.drawPath(path, mPaint);
}
public static Path RoundedRect(
float left, float top, float right, float bottom, float rx, float ry,
boolean tl, boolean tr, boolean br, boolean bl)
{
Path path = new Path();
if (rx < 0) rx = 0;
if (ry < 0) ry = 0;
float width = right - left;
float height = bottom - top;
if (rx > width / 2) rx = width / 2;
if (ry > height / 2) ry = height / 2;
float widthMinusCorners = (width - (2 * rx));
float heightMinusCorners = (height - (2 * ry));
path.moveTo(right, top + ry);
if (tr)
path.rQuadTo(0, -ry, -rx, -ry);//top-right corner
else
{
path.rLineTo(0, -ry);
path.rLineTo(-rx, 0);
}
path.rLineTo(-widthMinusCorners, 0);
if (tl)
path.rQuadTo(-rx, 0, -rx, ry); //top-left corner
else
{
path.rLineTo(-rx, 0);
path.rLineTo(0, ry);
}
path.rLineTo(0, heightMinusCorners);
if (bl)
path.rQuadTo(0, ry, rx, ry);//bottom-left corner
else
{
path.rLineTo(0, ry);
path.rLineTo(rx, 0);
}
path.rLineTo(widthMinusCorners, 0);
if (br)
path.rQuadTo(rx, 0, rx, -ry); //bottom-right corner
else
{
path.rLineTo(rx, 0);
path.rLineTo(0, -ry);
}
path.rLineTo(0, -heightMinusCorners);
path.close();//Given close, last lineto can be removed.
path.setFillType(Path.FillType.INVERSE_EVEN_ODD);
return path;
}
}
What I have already tried:
- setting isRecyclable false in ViewHolder
setting different PorterDuff mode in paint
LAYER_TYPE_HARDWARE (hardware acceleration) for this view
setDrawingCacheBackgroundColor(0x00000000); in constructor
setLayerType(View.LAYER_TYPE_SOFTWARE, paint); passing paint in this function
tried making canvas transparent before super.onDraw()
UPDATE:
After a lot of fiddling around I have concluded that whenever my viewHolder's view goes out of screen. All it's alpha channel become black. I have a feeling it has to do something with the setLayerType(View.LAYER_TYPE_SOFTWARE, null);
Worked by making the parent software accelerated.
I solved it by putting
if (Build.VERSION.SDK_INT >= 11)
view.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
in constructor of my ViewHolder. It worked even if I enabled software acceleration for any parent container view.
Now I don't know why this worked.

How to design a simple game map in Android?

I'm making a very very simple game in Android, and I'm not using OpenGL or any other libraries, just Java!
Now I'm stuck in designing my map...
I want to design something like this:
(Those lines should consider as walls and players can't get out of them)
How to design something like this using XML only? Or I should start using Unity3D?
This isn't done with xml, but you neither need any libraries.
public class Background extends View {
private static final int BORDER_WIDTH = 2; //in px
private int[] points; //2n = x, 2n+1 = y
public Background(Context context, AttributeSet attrs) {
super(context, attrs);
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
for(Drawable drawable : drawBackground()){
drawable.draw(canvas);
}
}
private Drawable[] drawBackground() {
Drawable[] drawables = new Drawable[2];
int width = getWidth();
int height = getHeight();
int corner = width / 4;
//draw border
Path path = new Path();
path.moveTo(0, corner);
path.lineTo(corner, 0);
path.lineTo(width, 0);
path.lineTo(width, height - corner);
path.lineTo(width - corner, height);
path.lineTo(0, height);
path.close();
drawables[0] = new ShapeDrawable(new PathShape(path, width, height));
drawables[0].setBounds(0, 0, width, height);
//draw inside the border
points = {
BORDER_WIDTH, corner,
corner, BORDER_WIDTH,
width - BORDER_WIDTH, BORDER_WIDTH,
width - BORDER_WIDTH, height - corner,
width - corner, height - BORDER_WIDTH,
BORDER_WIDTH, height - BORDER_WIDTH
}
path = new Path();
path.moveTo(points[0], points[1]);
for (int i = 2, i < points.length, i++) {
path.lineTo(points[i], points[++i]);
}
path.close();
ShapeDrawable shapeDrawable = new ShapeDrawable(new PathShape(path, width, height));
shapeDrawable.getPaint().setColor(Color.rgb(238, 238, 238));
shapeDrawable.setBounds(0, 0, width, height);
drawables[1] = shapeDrawable;
return drawables;
}
public Point[] getPoints() {
return points;
}
}
The result:

Using Seek Bar to zoom android Canvas

this is my first question in stackoverflow. any help would be very much appreciated.
I am trying zoom a canvas using a seek bar, so depend on the progress of the seekbar, the canvas will zoom in and zoom out.
here is my code in the main activity:
#Override
public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {
// TODO Auto-generated method stub
Toast.makeText(MainActivity.this, "Seekbar Value : " + progress, Toast.LENGTH_SHORT).show();
CPaintView paint = (CPaintView) this.findViewById(R.id.cPaintView1);
paint.zoomX = (float)progress;
paint.zoomY = (float)progress;
paint.invalidate();
}
then it will pass the progress value to the CPaintView class which contain the canvas:
public class CPaintView extends View implements OnTouchListener {
final Paint paint = new Paint();
int color = Color.parseColor("#FF0000");
Bitmap offScreenBitmap;
Canvas offScreenCanvas;
final int CIRCLE = 0;
final int TRIANGLE = 1;
final int SQUARE = 2;
int shape = CIRCLE;
private int mActivePointerId;
float zoomX = 0;
float zoomY = 0;
public CPaintView(Context context) {
super(context);
setup();
}
public CPaintView(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
setup();
}
public CPaintView(Context context, AttributeSet attrs) {
super(context, attrs);
setup();
}
public void setup()
{
setOnTouchListener(this); // define event listener and start intercepting events
}
#Override
protected void onDraw(Canvas canvas) {
// TODO Auto-generated method stub
// draw the off screen bitmap
if(zoomX > 0)
{
canvas.save();
canvas.scale(zoomX, zoomY);
canvas.drawBitmap(offScreenBitmap, 0, 0, paint);
canvas.restore();
}
else
canvas.drawBitmap(offScreenBitmap, 0, 0, paint);
}
#Override
public boolean onTouch(View v, MotionEvent event) {
// get the x,y coordinates of the MotionEvent.ACTION_MOVE event
int pointerIndex = 0;
for(int i = 0; i < event.getPointerCount(); i++)
{
mActivePointerId = event.getPointerId(i);
pointerIndex = event.findPointerIndex(mActivePointerId);
float x = event.getX(pointerIndex);
float y = event.getY(pointerIndex);
float y1 = y + 20;
float x2 = x + 20;
float y2 = y1 - 10;
paint.setColor(color);
float verts[] = {x, y, x, y1, x2, y2};
int[] vertsColors = {color, color, color, color, color, color};
switch(shape)
{
case CIRCLE:
offScreenCanvas.drawCircle(x, y, 10, paint); break;// draw a red circle at the x,y coordinates specified by the user
case TRIANGLE:
offScreenCanvas.drawVertices(Canvas.VertexMode.TRIANGLES, verts.length, verts, 0, null, 0, vertsColors, 0, null, 0, 0, paint);break;
case SQUARE:
offScreenCanvas.drawRect(x-10, y-10, x+10, y+10, paint); break;
}
invalidate();
}
return true;
}
#Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
// create / re-create the off screen bitmap to capture the state of our drawing
// this operation will reset the user's drawing
offScreenBitmap = Bitmap.createBitmap(w, h, Bitmap.Config.ARGB_8888);
offScreenCanvas = new Canvas(offScreenBitmap);
}
}
I am having problem with the onDraw method. The problem is, when I increase the seekbar progress, the whole canvas disappear and I try to draw on it, it seems like it doesn't draw. But when I decrease the seekbar progress back to 0, all the drawing comes back and I can see it again, including the drawing that seems like not working.
I am sorry for my bad english.
Thank you very much.
Your problem is conceptual with how scale works. Scaling at 0,0 is undefined. Scaling at 1f,1f is the default. The scaling isn't working much at all,
if(zoomX > 0)
{
canvas.save();
canvas.scale(zoomX, zoomY);
canvas.drawBitmap(offScreenBitmap, 0, 0, paint);
canvas.restore();
}
else
canvas.drawBitmap(offScreenBitmap, 0, 0, paint);
if the zoom is 0, then it'll properly draw the scaled bitmap. Because it'll skip your zoom step. else you have a scaling of like 50 which is basically going to maybe have the bitmap be a dot. Try getting the zoom to hover around 1. Something like zoom = 12 / (1 + progress) Then the zoom can range from like 12x to values less than zero. Your drawing seems like it should be there, it's just WAAAAY small. Except at zero where you skip that step and make it 1.

Categories

Resources