I am trying to make an animation of growing line it will look like that line is moving towards the end of canvas width and the start of the line will be constant only end of line should be growing
here is my code of the class which paint line on android PLZ HELP ANY HELP WOULD BE APPREICATED.
package com.example.line;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Paint.Align;
import android.view.View;
public class MyPlay extends View{
float startx = 30;
float starty = 60;
float endx=0;
float endy=0;
public MyPlay(Context context) {
super(context);
// TODO Auto-generated constructor stub
}
#Override
protected void onDraw(Canvas canvas) {
// TODO Auto-generated method stub
super.onDraw(canvas);
canvas.drawColor(Color.WHITE);
Paint textPaint = new Paint();
textPaint.setARGB(50, 254, 10, 50);
textPaint.setColor(Color.RED);
textPaint.setTextAlign(Align.CENTER);
textPaint.setTextSize(20);
canvas.drawText("Made by Skyrush", canvas.getWidth()/2, canvas.getHeight()/2, textPaint);
Paint linePaint = new Paint();
linePaint.setColor(Color.BLACK);
linePaint.setStrokeWidth(2);
//canvas.drawLine(startx, starty, endx, endy, linePaint);
if(endx < canvas.getWidth()){
endx = startx+5;
endy = starty-5;
canvas.drawLine(startx, starty, endx, endy, linePaint);
invalidate();
}
invalidate();
}
}
In this webpage there's a way to make an animation of a line growing.
You just have to implement the following methods in a custom view:
#Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
// starting point
x1 = 50;
y1 = 50;
// ending point
x2 = getWidth() / 2 + getWidth() / 4;
y2 = getHeight() / 2 + getHeight() / 4;
Log.d("line xy xy", x1 + " : "+y1+" : "+x2 + " : "+y2);
divideLineIntoEqualParts();
}
// dividing line into 50 equal parts
private void divideLineIntoEqualParts() {
/*
* Courtesy : www.dummies.com
* (x,y) = (x1 + k(x2 - x1),y1 + k(y2 - y1))
* */
listOfPoints.clear();
for (int k = 1; k <= 50; k++) {
listOfPoints.add(new PointF(x1 + ((k * (x2 - x1)) / 50),y1 + (k * (y2 - y1)) / 50));
}
Log.d("listOfPoints : size : ",listOfPoints.size()+"");
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
if(inte < listOfPoints.size()){
canvas.drawLine(listOfPoints.get(0).x, listOfPoints.get(0).y, listOfPoints.get(inte).x,listOfPoints.get(inte).y, paint);
inte++;
if(inte < listOfPoints.size()){
invalidate();
}
}
Related
I am graphically representing audio on x and y axis. From those y-axis points I want to generate audio again.
Followed https://github.com/billthefarmer/scope this to get points on y-axis. I have all of the values of y-axis points. These points can be used to represent a wave graphically.
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.util.AttributeSet;
import android.util.Log;
import android.view.MotionEvent;
import android.view.View;
import java.io.IOException;
import java.io.OutputStreamWriter;
import java.util.Locale;
// Scope
public class Scope extends View {
private int width;
private int height;
private Path path;
private Canvas cb;
private Paint paint;
private Bitmap bitmap;
private Bitmap graticule;
protected boolean storage;
protected boolean clear;
protected float step;
protected float scale;
protected float start;
protected float index;
protected float yscale;
protected boolean points;
protected MainActivity.Audio audio;
// Scope
public Scope(Context context, AttributeSet attrs) {
super(context, attrs);
// Create path and paint
path = new Path();
paint = new Paint();
}
// On size changed
#Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
super.onSizeChanged(w, h, oldw, oldh);
// Get dimensions
width = w;
height = h;
// Create a bitmap for trace storage
bitmap = Bitmap.createBitmap(width, height, Bitmap.Config.ARGB_8888);
cb = new Canvas(bitmap);
// Create a bitmap for the graticule
graticule = Bitmap.createBitmap(width, height,
Bitmap.Config.ARGB_8888);
Canvas canvas = new Canvas(graticule);
// Black background
canvas.drawColor(Color.BLACK);
// Set up paint
paint.setStrokeWidth(2);
paint.setStyle(Paint.Style.STROKE);
paint.setColor(Color.argb(255, 0, 63, 0));
// Draw graticule
for (int i = 0; i < width; i += MainActivity.SIZE)
canvas.drawLine(i, 0, i, height, paint);
canvas.translate(0, height / 2);
for (int i = 0; i < height / 2; i += MainActivity.SIZE) {
canvas.drawLine(0, i, width, i, paint);
canvas.drawLine(0, -i, width, -i, paint);
}
// Draw the graticule on the bitmap
cb.drawBitmap(graticule, 0, 0, null);
cb.translate(0, height / 2);
}
private int max;
// On draw
#Override
protected void onDraw(Canvas canvas) {
// Check for data
if ((audio == null) || (audio.data == null)) {
canvas.drawBitmap(graticule, 0, 0, null);
return;
}
// Draw the graticule on the bitmap
if (!storage || clear) {
cb.drawBitmap(graticule, 0, -height / 2, null);
clear = false;
}
// Calculate x scale etc
float xscale = (float) (2.0 / ((audio.sample / 100000.0) * scale));
int xstart = Math.round(start);
int xstep = Math.round((float) 1.0 / xscale);
int xstop = Math.round(xstart + ((float) width / xscale));
if (xstop > audio.length)
xstop = (int) audio.length;
// Calculate y scale
if (max < 4096)
max = 4096;
yscale = (float) (max / (height / 2.0));
max = 0;
// Draw the trace
path.rewind();
path.moveTo(0, 0);
if (xscale < 1.0) {
for (int i = 0; i < xstop - xstart; i += xstep) {
if (max < Math.abs(audio.data[i + xstart]))
max = Math.abs(audio.data[i + xstart]);
float x = (float) i * xscale;
float y = -(float) audio.data[i + xstart] / yscale;
path.lineTo(x, y);
Log.d("y values", "y = " + String.valueOf(y)); // KING
writeToFile("y = " + String.valueOf(y), getContext());
}
} else {
for (int i = 0; i < xstop - xstart; i++) {
if (max < Math.abs(audio.data[i + xstart]))
max = Math.abs(audio.data[i + xstart]);
float x = (float) i * xscale;
float y = -(float) audio.data[i + xstart] / yscale;
path.lineTo(x, y);
Log.d("y values", "y = " + String.valueOf(y)); // KING
writeToFile("y = " + String.valueOf(y), getContext());
// Draw points at max resolution
if (points) {
path.addRect(x - 2, y - 2, x + 2, y + 2, Path.Direction.CW);
path.moveTo(x, y);
Log.d("y values", "y = " + String.valueOf(y)); // KING
writeToFile("y = " + String.valueOf(y), getContext());
}
}
}
// Green trace
paint.setColor(Color.GREEN);
paint.setAntiAlias(true);
cb.drawPath(path, paint);
// Draw index
if (index > 0 && index < width) {
// Yellow index
paint.setColor(Color.YELLOW);
paint.setAntiAlias(false);
cb.drawLine(index, -height / 2, index, height / 2, paint);
paint.setAntiAlias(true);
paint.setTextSize(height / 48);
paint.setTextAlign(Paint.Align.LEFT);
// Get value
int i = Math.round(index / xscale);
if (i + xstart < audio.length) {
float y = -audio.data[i + xstart] / yscale;
// Draw value
String s = String.format(Locale.getDefault(), "%3.2f",
audio.data[i + xstart] / 32768.0);
cb.drawText(s, index, y, paint);
}
paint.setTextAlign(Paint.Align.CENTER);
// Draw time value
if (scale < 100.0) {
String s = String.format(Locale.getDefault(),
(scale < 1.0) ? "%3.3f" :
(scale < 10.0) ? "%3.2f" : "%3.1f",
(start + (index * scale)) /
MainActivity.SMALL_SCALE);
cb.drawText(s, index, height / 2, paint);
// Log.d("y values", "y = " + String.valueOf(y));
} else {
String s = String.format(Locale.getDefault(), "%3.3f",
(start + (index * scale)) /
MainActivity.LARGE_SCALE);
cb.drawText(s, index, height / 2, paint);
}
}
canvas.drawBitmap(bitmap, 0, 0, null);
}
private void writeToFile(String data, Context context) {
try {
OutputStreamWriter outputStreamWriter = new OutputStreamWriter(context.openFileOutput("Sinusoids.txt", Context.MODE_PRIVATE));
outputStreamWriter.write(data);
outputStreamWriter.close();
} catch (IOException e) {
Log.e("Exception", "File write failed: " + e.toString());
}
}
// On touch event
#Override
public boolean onTouchEvent(MotionEvent event) {
float x = event.getX();
float y = event.getY();
// Set the index from the touch dimension
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
index = x;
break;
case MotionEvent.ACTION_MOVE:
index = x;
break;
case MotionEvent.ACTION_UP:
index = x;
break;
}
return true;
}
}
Generate byte array from y-axis points. The array can then be converted to sound.
I am trying to create a family tree like structure in android. I am using canvas to draw rectangle and line for family members names and connecting line.
I am drawing rectangle and line by the following method with the help of link
DrawView.java
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.util.Log;
import android.view.View;
public class DrawView extends View {
Paint paint = new Paint();
float mx, my, mdensity;
Paint mBGPaint, mTXTPaint,mLINEPaint,mBRDPaint;
String text;
public DrawView(Context context, float x, float y, float density, String text) {
super(context);
paint.setColor(Color.RED);
paint.setStrokeWidth(8);
paint.setStyle(Paint.Style.STROKE);
mx = x;
my = y;
mdensity = density;
this.text = text;
}
#Override
public void onDraw(Canvas canvas) {
super.onDraw(canvas);
init();
mLINEPaint.setStrokeWidth(8);
//draw rect border
canvas.drawRect(100, 100, 200, 200, mBRDPaint);
// //draw text
canvas.drawText(text, 150, 150, mTXTPaint);
// //draw line
float x = mx+150;
canvas.drawLine(x, 10, x, 100, mLINEPaint);
}
public void init() {
//rectangle background
mBGPaint = new Paint();
mBGPaint.setColor(Color.parseColor("#80123456"));
//your text
mTXTPaint = new Paint();
mTXTPaint.setColor(Color.parseColor("#123456"));
//your line
mLINEPaint = new Paint();
mLINEPaint.setColor(0xFFFF00FF);
//rectangle border
mBRDPaint = new Paint();
mBRDPaint.setStyle(Paint.Style.STROKE);
mBRDPaint.setStrokeWidth(10);
mBRDPaint.setColor(Color.parseColor("#80123456"));
}
}
Now I am trying to add multiple views in LinearLayout with orientation horizontal like below :
float density = getApplicationContext().getResources().getDisplayMetrics().density;
DrawView drawView;
float x = 100, y = 200;
int count1 = 1;
int id;
LinearLayout layout2 = new LinearLayout(this);
layout2.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.WRAP_CONTENT, LinearLayout.LayoutParams.WRAP_CONTENT));
layout2.setOrientation(LinearLayout.HORIZONTAL);
main_layout.addView(layout2);
DrawView drawView1;
CircleView circleView;
for (Map.Entry<String, ArrayList<String>> entry : map.entrySet()) {
String key = entry.getKey();
if (count1 < 2) {
x = dirButton.getX();
y = dirButton.getY();
}
drawView1 = new DrawView(this, x, y, density, key);
drawView1.setId(butId++);
drawView1.setLayoutParams(params);
layout2.addView(drawView1);
count1++;
x = x + 100;
}
But when I do this only one view is added to the canvas and others are not visible. I have no experience in working with canvas in android , I would be glad if someone could guide me with this problem.
I tried working on your project but it is too broad to edit on the answer sheet. I must suggest to look these:
Multiple rect.
Rectangle with view
if (count1 < 2) {
x = dirButton.getX();
y = dirButton.getY();
}
from the code line above, you set condition for when the line is executed.
and use if statement.
int count1 = 1; //Count was initialized to 1
This makes the code to enter the if statement on first call
count1++;
This line increases the value of count to 2, hence the if block do not execute again...
And y value never change which leads to overlay.
May be what you missed is regular increament of y
y+=something;
Hope that helps
Please check how i have done this,
You can check from here form myapp, how it work
// How i call to draw rectangle
This is the SDV.class
public static boolean isDrawing = false;
public static float mStartX;
public static float mStartY;
public static float mx;
public static float my;
public static void Shape14(float x, float y, float radius) {
Path path = new Path();
y -= 2 * radius;
radius *= 2;
path.moveTo(x + radius, y + radius);
path.lineTo(x - radius, y + radius);
path.lineTo(x, y);
path.lineTo(x + radius, y + radius);
float div = (2 * radius) / 5;
float top = y + radius;
RectF rect1 = new RectF(x + radius / 4, y, x + radius / 1.9f, y
+ radius);
RectF rect2 = new RectF(x + div / 2, top, x + div / 2 + div, top + div
* 2);
RectF rect3 = new RectF(x - div / 2 - div, top, x - div / 2, top + div
* 2);
RectF rect4 = new RectF(x - div / 2, top, x + div / 2, top + div);
HashMap<String, Object> hm = new HashMap<String, Object>();
hm.put("type", shape14);
hm.put("paint", new Paint(DrawingView.mColorPaint));
hm.put("path", path);
hm.put("rect1", rect1);
hm.put("rect2", rect2);
hm.put("rect3", rect3);
hm.put("rect4", rect4);
al.add(hm);
Gmap.mDrawingView.invalidate();
}
Here is our view,
public class DrawingView extends View {
public static Paint mPaint;
public static int mCurrentShape;
Point p1, p2, p3, p4;
public static Paint mDotedPaint;
public static Paint mColorPaint;
GoogleMap googleMap;
SeekBar sbWidth;
public static float sx, sy;
public DrawingView(Context context, GoogleMap googleMap, SeekBar sbWidth) {
super(context);
this.googleMap = googleMap;
this.sbWidth = sbWidth;
mPaint = new Paint(Paint.DITHER_FLAG);
mPaint.setAntiAlias(true);
mPaint.setDither(true);
mPaint.setColor(SDV.colorChoosen);
mPaint.setStyle(Paint.Style.STROKE);
mPaint.setStrokeJoin(Paint.Join.ROUND);
mPaint.setStrokeCap(Paint.Cap.ROUND);
mPaint.setStrokeWidth(SDV.width);
mDotedPaint = new Paint(Paint.DITHER_FLAG);
mDotedPaint.setAntiAlias(true);
mDotedPaint.setDither(true);
mDotedPaint.setColor(SDV.colorChoosen);
mDotedPaint.setStyle(Paint.Style.STROKE);
mDotedPaint.setStrokeJoin(Paint.Join.ROUND);
mDotedPaint.setStrokeCap(Paint.Cap.ROUND);
mDotedPaint.setStrokeWidth(SDV.width);
mColorPaint = new Paint(Paint.DITHER_FLAG);
mColorPaint.setAntiAlias(true);
mColorPaint.setDither(true);
mColorPaint.setFilterBitmap(true);
mColorPaint.setStyle(Paint.Style.FILL);
mColorPaint.setStrokeWidth(SDV.width);
mColorPaint.setColor(SDV.colorChoosen);
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
sx = super.getWidth() * 0.5f;
sy = super.getHeight() * 0.5f;
if (SDV.isDrawing) {
new OnGoingDrawings().HandleAllOnGoingDrawings(mCurrentShape,
canvas);
} else {
new ShapeDrawer().DrawEverything(canvas, googleMap, sbWidth);
}
}
#Override
public boolean onTouchEvent(MotionEvent event) {
SDV.mx = event.getX();
SDV.my = event.getY();
switch (mCurrentShape) {
case SDV.shape14:
TouchEvents.Shape14(event);
break;
return true;
}
}
Here is touch listener,
public static void Shape14(MotionEvent event) {
switch (event.getAction()) {
case MotionEvent.ACTION_DOWN:
SDV.isDrawing = true;
SDV.mStartX = SDV.mx;
SDV.mStartY = SDV.my;
Gmap.mDrawingView.invalidate();
break;
case MotionEvent.ACTION_MOVE:
Gmap.mDrawingView.invalidate();
break;
case MotionEvent.ACTION_UP:
SDV.isDrawing = false;
float x = SDV.mStartX,
y = SDV.mStartY;
float DifX = Math.abs(SDV.mx - SDV.mStartX);
float DifY = Math.abs(SDV.my - SDV.mStartY);
float radius;
if (DifY > DifX)
radius = Math.abs(SDV.my - SDV.mStartY);
else
radius = Math.abs(SDV.mx - SDV.mStartX);
SDV.Shape14(x, y, radius);
break;
}
}
I am able to draw a text on canvas on motion view now the problem is that when i draw text & go for the next draw on same canvas my draw text is getting disappear i mean screen is getting redraw because of invalidate i want keep my previous draw and make new draw on same canvas how am i going to do that ?
public class PuzzleView extends View {
private float width; // width of one tile
private float height; // height of one tile
private int selX; // X index of selection
private int selY; // Y index of selection
private final Rect selRect = new Rect();
private final Game game;
float positionX = 5;
float positionY = 15;
String strgettile = null;
float x, y;
Paint foreground = new Paint(Paint.ANTI_ALIAS_FLAG);
String getorientation;
public PuzzleView(Context context) {
super(context);
this.game = (Game) context;
setFocusable(true);
setFocusableInTouchMode(true);
}
#Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
width = w / 9f;
height = h / 9f;
// getRect(selX, selY, selRect);
Log.d(TAG, "onSizeChanged: width " + width + ", height " + height);
super.onSizeChanged(w, h, oldw, oldh);
}
#Override
protected void onDraw(Canvas canvas) {
//super.onDraw(canvas);
// canvas.save();
// Draw the background...
Paint background = new Paint();
background.setColor(getResources().getColor(R.color.puzzle_background));
canvas.drawRect(0, 0, getWidth(), getHeight(), background);
// Draw the board...
// Define colors for the grid lines
Paint dark = new Paint();
dark.setColor(getResources().getColor(R.color.puzzle_dark));
Paint hilite = new Paint();
hilite.setColor(getResources().getColor(R.color.puzzle_hilite));
Paint light = new Paint();
light.setColor(getResources().getColor(R.color.puzzle_light));
// Draw the minor grid lines
for (int i = 0; i < 9; i++) {
canvas.drawLine(0, i * height, getWidth(), i * height, light);
canvas.drawLine(0, i * height + 1, getWidth(), i * height + 1,
hilite);
canvas.drawLine(i * width, 0, i * width, getHeight(), light);
canvas.drawLine(i * width + 1, 0, i * width + 1, getHeight(),
hilite);
}
// Draw the major grid lines
for (int i = 0; i < 9; i++) {
if (i % 3 != 0)
continue;
canvas.drawLine(0, i * height, getWidth(), i * height, dark);
canvas.drawLine(0, i * height + 1, getWidth(), i * height + 1,
hilite);
canvas.drawLine(i * width, 0, i * width, getHeight(), dark);
canvas.drawLine(i * width + 1, 0, i * width + 1, getHeight(),
hilite);
}
// // Draw the numbers...
Paint hint = new Paint();
int m;
if (strgettile != null) {
for (m = 0; m < strgettile.length(); m++) {
System.out.println(strgettile.charAt(m));
char convertst = strgettile.charAt(m);
String characterToString = Character.toString(convertst);
if (getorientation.equalsIgnoreCase("Horizontal")) {
canvas.drawText(characterToString, m * width + positionX,
positionY, foreground); // for motion event
hint.setColor(Color.BLACK);
hint.setTextSize(45);
} else {
canvas.drawText(characterToString, positionX, m * height
+ positionY, foreground);
hint.setColor(Color.BLACK);
hint.setTextSize(45);
}
}
//invalidate();
}
}
#Override
public boolean onTouchEvent(MotionEvent event) {
if (event.getAction() != MotionEvent.ACTION_DOWN)
return super.onTouchEvent(event);
// select((int) (event.getX() / width), (int) (event.getY() /
// height));
game.showKeypadOrError(selX, selY);
foreground.setColor(getResources().getColor(R.color.puzzle_foreground));
foreground.setStyle(Style.FILL);
foreground.setTextSize(height * 0.75f);
foreground.setTextScaleX(width / height);
foreground.setTextAlign(Paint.Align.CENTER);
// // Draw the number in the center of the tile
FontMetrics fm = foreground.getFontMetrics();
// // Centering in X: use alignment (and X at midpoint)
// positionX = width / 2;
// // Centering in Y: measure ascent/descent first
// positionY = height / 2 - (fm.ascent + fm.descent) / 2;
positionX = (int) event.getX();
positionY = (int) event.getY() - (fm.ascent + fm.descent) / 2;
// Draw the numbers...
// Define color and style for numbers
// invalidate();
Log.d(TAG, "onTouchEvent: x " + selX + ", y " + selY);
return true;
}
public void setSelectedTile(String tile, String strorientations) {
// TODO Auto-generated method stub
Log.v("getting string in puzzle view ", tile);
strgettile = tile;
getorientation = strorientations;
invalidate();
}
}
Call invalidate() at the end of onDraw.
This function let the onDraw to get called again.
Hi I am trying to create Circle using canvas like following image.
But now I can only able to make like following.
I don't understand how can I make this. I need to cut the circle from one side and need to fill that circle border only.
Here is my code For review.
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
// Clear canvas
canvas.drawColor(Color.TRANSPARENT);
// Draw Ticks and colored arc
drawTicks(canvas);
}
private void drawTicks(Canvas canvas) {
float availableAngle = 160;
float majorStep = (float) (majorTickStep/ maxSpeed *availableAngle);
float majorTicksLength = 30;
RectF oval = getOval(canvas, 1);
float radius = oval.width()*0.35f;
float currentAngle = 10;
double curProgress = 0;
while (currentAngle <= 170) {
if (labelConverter != null) {
canvas.save();
canvas.rotate(180 + currentAngle, oval.centerX(), oval.centerY());
float txtX = oval.centerX() + radius + majorTicksLength/2 + 8;
float txtY = oval.centerY();
canvas.rotate(+90, txtX, txtY);
//canvas.drawText(labelConverter.getLabelFor(curProgress, maxSpeed), txtX, txtY, txtPaint);
canvas.restore();
}
currentAngle += majorStep;
curProgress += majorTickStep;
}
RectF smallOval = getOval(canvas, 0.7f);
colorLinePaint.setColor(defaultColor);
//canvas.drawArc(smallOval, 185, 170, false, colorLinePaint);
canvas.drawCircle(250, 210, 180, colorLinePaint);
for (ColoredRange range: ranges) {
colorLinePaint.setColor(range.getColor());
//canvas.drawArc(smallOval, (float) (190 + range.getBegin()/ maxSpeed *160), (float) ((range.getEnd() - range.getBegin())/ maxSpeed *160), false, colorLinePaint);
//canvas.drawArc(smallOval, (float) (190 + range.getBegin()/ maxSpeed *160), (float) ((range.getEnd() - range.getBegin())/ maxSpeed *160), false, colorLinePaint);
//canvas.drawCircle((float) (190 + range.getBegin()/ maxSpeed *160), (float) ((range.getEnd() - range.getBegin())/ maxSpeed *160), 100, colorLinePaint);
//canvas.drawCircle((float)(300 + range.getBegin()/ maxSpeed *160), (float) ((range.getEnd() - range.getBegin())/ maxSpeed *160), 180, colorLinePaint);
}
}
private RectF getOval(Canvas canvas, float factor) {
RectF oval;
final int canvasWidth = canvas.getWidth() - getPaddingLeft() - getPaddingRight();
final int canvasHeight = canvas.getHeight() - getPaddingTop() - getPaddingBottom();
if (canvasHeight*2 >= canvasWidth) {
oval = new RectF(0, 0, canvasWidth*factor, canvasWidth*factor);
} else {
oval = new RectF(0, 0, canvasHeight*2*factor, canvasHeight*2*factor);
}
oval.offset((canvasWidth-oval.width())/2 + getPaddingLeft(), (canvasHeight*2-oval.height())/2 + getPaddingTop());
return oval;
}
Really got stuck on this. Please give me any hint or reference.
i created a View for you.. it may help.. just give a try... its only a basic view...i think it will give an idea..
package abbitfoot.likhil.customeprogressbar;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Rect;
import android.graphics.RectF;
import android.util.AttributeSet;
import android.view.View;
import android.widget.ProgressBar;
public class CustomeView extends View {
Paint red=new Paint();
Paint white=new Paint();
Paint bg=new Paint();
int radiusBg=200;
public CustomeView(Context context, AttributeSet attrs) {
super(context, attrs);
// TODO Auto-generated constructor stub
init();
}
private void init(){
red.setColor(Color.RED);
white.setColor(Color.WHITE);
bg.setColor(Color.rgb(0x99, 0x99, 0x99));
}
#Override
protected void onDraw(Canvas canvas) {
// TODO Auto-generated method stub
super.onDraw(canvas);
canvas.save();
canvas.drawCircle(getWidth()/2, getHeight()/2, radiusBg, bg);
Rect oval=new Rect(getWidth()/2-radiusBg+10, getHeight()/2-radiusBg+10,getWidth()/2+radiusBg-10,getHeight()/2+radiusBg-10 );
RectF rectF=new RectF(oval);
canvas.drawArc(rectF, 140,200,true, red);
canvas.drawArc(rectF, 340,60,true, white);
canvas.drawCircle(getWidth()/2, getHeight()/2, radiusBg-25, bg);
canvas.restore();
}
}
hope this will help you...and sorry this is not a rightmethod i think..
I'm trying to figure out how to wite a simple drawing program in Android. I saw a sample program that stored each stroke in a array, then played back the array when the screen needed to be updated. To me this did not seem to proctical. I would like to draw in a bitmap, and the update would just draw the bitmap instad of every stroke. ( i could not figure out how to do this in android)
Any thoughts
?
Ted
Look at the Android samples: there are a couple of moderately complicated bits, but this is from the Sensors.java api demo in the Android SDK. It demonstrates the bitmap manipulation:
private class GraphView extends View implements SensorEventListener
{
private Bitmap mBitmap;
private Paint mPaint = new Paint();
private Canvas mCanvas = new Canvas();
private Path mPath = new Path();
private RectF mRect = new RectF();
private float mLastValues[] = new float[3*2];
private float mOrientationValues[] = new float[3];
private int mColors[] = new int[3*2];
private float mLastX;
private float mScale[] = new float[2];
private float mYOffset;
private float mMaxX;
private float mSpeed = 1.0f;
private float mWidth;
private float mHeight;
public GraphView(Context context) {
super(context);
mColors[0] = Color.argb(192, 255, 64, 64);
mColors[1] = Color.argb(192, 64, 128, 64);
mColors[2] = Color.argb(192, 64, 64, 255);
mColors[3] = Color.argb(192, 64, 255, 255);
mColors[4] = Color.argb(192, 128, 64, 128);
mColors[5] = Color.argb(192, 255, 255, 64);
mPaint.setFlags(Paint.ANTI_ALIAS_FLAG);
mRect.set(-0.5f, -0.5f, 0.5f, 0.5f);
mPath.arcTo(mRect, 0, 180);
}
#Override
protected void onSizeChanged(int w, int h, int oldw, int oldh) {
mBitmap = Bitmap.createBitmap(w, h, Bitmap.Config.RGB_565);
mCanvas.setBitmap(mBitmap);
mCanvas.drawColor(0xFFFFFFFF);
mYOffset = h * 0.5f;
mScale[0] = - (h * 0.5f * (1.0f / (SensorManager.STANDARD_GRAVITY * 2)));
mScale[1] = - (h * 0.5f * (1.0f / (SensorManager.MAGNETIC_FIELD_EARTH_MAX)));
mWidth = w;
mHeight = h;
if (mWidth < mHeight) {
mMaxX = w;
} else {
mMaxX = w-50;
}
mLastX = mMaxX;
super.onSizeChanged(w, h, oldw, oldh);
}
#Override
protected void onDraw(Canvas canvas) {
synchronized (this) {
if (mBitmap != null) {
final Paint paint = mPaint;
final Path path = mPath;
final int outer = 0xFFC0C0C0;
final int inner = 0xFFff7010;
if (mLastX >= mMaxX) {
mLastX = 0;
final Canvas cavas = mCanvas;
final float yoffset = mYOffset;
final float maxx = mMaxX;
final float oneG = SensorManager.STANDARD_GRAVITY * mScale[0];
paint.setColor(0xFFAAAAAA);
cavas.drawColor(0xFFFFFFFF);
cavas.drawLine(0, yoffset, maxx, yoffset, paint);
cavas.drawLine(0, yoffset+oneG, maxx, yoffset+oneG, paint);
cavas.drawLine(0, yoffset-oneG, maxx, yoffset-oneG, paint);
}
canvas.drawBitmap(mBitmap, 0, 0, null);
float[] values = mOrientationValues;
if (mWidth < mHeight) {
float w0 = mWidth * 0.333333f;
float w = w0 - 32;
float x = w0*0.5f;
for (int i=0 ; i<3 ; i++) {
canvas.save(Canvas.MATRIX_SAVE_FLAG);
canvas.translate(x, w*0.5f + 4.0f);
canvas.save(Canvas.MATRIX_SAVE_FLAG);
paint.setColor(outer);
canvas.scale(w, w);
canvas.drawOval(mRect, paint);
canvas.restore();
canvas.scale(w-5, w-5);
paint.setColor(inner);
canvas.rotate(-values[i]);
canvas.drawPath(path, paint);
canvas.restore();
x += w0;
}
} else {
float h0 = mHeight * 0.333333f;
float h = h0 - 32;
float y = h0*0.5f;
for (int i=0 ; i<3 ; i++) {
canvas.save(Canvas.MATRIX_SAVE_FLAG);
canvas.translate(mWidth - (h*0.5f + 4.0f), y);
canvas.save(Canvas.MATRIX_SAVE_FLAG);
paint.setColor(outer);
canvas.scale(h, h);
canvas.drawOval(mRect, paint);
canvas.restore();
canvas.scale(h-5, h-5);
paint.setColor(inner);
canvas.rotate(-values[i]);
canvas.drawPath(path, paint);
canvas.restore();
y += h0;
}
}
}
}
}
public void onSensorChanged(SensorEvent event) {
//Log.d(TAG, "sensor: " + sensor + ", x: " + values[0] + ", y: " + values[1] + ", z: " + values[2]);
synchronized (this) {
if (mBitmap != null) {
final Canvas canvas = mCanvas;
final Paint paint = mPaint;
if (event.sensor.getType() == Sensor.TYPE_ORIENTATION) {
for (int i=0 ; i<3 ; i++) {
mOrientationValues[i] = event.values[i];
}
} else {
float deltaX = mSpeed;
float newX = mLastX + deltaX;
int j = (event.sensor.getType() == Sensor.TYPE_MAGNETIC_FIELD) ? 1 : 0;
for (int i=0 ; i<3 ; i++) {
int k = i+j*3;
final float v = mYOffset + event.values[i] * mScale[j];
paint.setColor(mColors[k]);
canvas.drawLine(mLastX, mLastValues[k], newX, v, paint);
mLastValues[k] = v;
}
if (event.sensor.getType() == Sensor.TYPE_MAGNETIC_FIELD)
mLastX += mSpeed;
}
invalidate();
}
}
}
public void onAccuracyChanged(Sensor sensor, int accuracy) {
}
}