Summary Notes : Drawing Shapes, Paint Gradient, Animation

Drawing Shapes using Canvas

 private static class ViewWithRedDot extends View {
 public ViewWithRedDot(Context context) {
 super(context);
 }
 @Override
 protected void onDraw(Canvas canvas)
 {
 canvas.drawColor(Color.BLACK);
 Paint circlePaint = new Paint();
 circlePaint.setColor(Color.rgb(123, 0, 55));
 //canvas.drawCircle(canvas.getWidth()/2,canvas.getHeight()/2,canvas.getWidth()/2, circlePaint);
 //canvas.drawRect(10, 10, 150, 50, circlePaint);
 circlePaint.setColor(Color.WHITE);
 //canvas.drawCircle(25, 25, 10, circlePaint);
 RectF rf = new RectF(10, 10, 150, 150);
 //canvas.drawArc(rf, 180, 90, true, circlePaint);
 //canvas.drawRoundRect(rf, 100, 20, circlePaint);
 canvas.drawText("hello", 100, 100, circlePaint);
 }
 }
 setContentView(new ViewWithRedDot(this));

Applying Gradient Effects to shapes

Linear Gradient


Paint circlePaint = new Paint(Paint.ANTI_ALIAS_FLAG);
 LinearGradient linGrad = new LinearGradient(0, 0, 25, 25,
 Color.RED, Color.BLACK,
 Shader.TileMode.MIRROR);
 circlePaint.setShader(linGrad);
 canvas.drawCircle(100, 100, 100, circlePaint);

Radial Gradient


Paint circlePaint = new Paint(Paint.ANTI_ALIAS_FLAG);
 RadialGradient radGrad = new RadialGradient(250,175, 50, Color.GREEN, Color.BLACK,
 Shader.TileMode.MIRROR);
 circlePaint.setShader(radGrad);
 canvas.drawCircle(250, 175, 50, circlePaint);

Sweep Gradient


Paint circlePaint = new Paint(Paint.ANTI_ALIAS_FLAG);
 SweepGradient sweepGrad = new
 SweepGradient(canvas.getWidth()-175,canvas.getHeight()-175, new int[] { Color.RED, Color.YELLOW, Color.GREEN, Color.BLUE, Color.MAGENTA }, null);
 circlePaint.setShader(sweepGrad);
 canvas.drawCircle(canvas.getWidth()-175,canvas.getHeight()-175, 100, circlePaint);

Applying font size and type


Paint mPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
 Typeface mType;
 mPaint.setTextSize(16);
 mPaint.setTypeface(null);
 canvas.drawText(“Default Typeface”, 20, 20, mPaint);

Drawing Shapes (Using ShapeDrawable)
 Drawing Rectangle


 ShapeDrawable rect = new ShapeDrawable(new RectShape());
 rect.setIntrinsicHeight(20);
 rect.setIntrinsicWidth(100);
 rect.getPaint().setColor(Color.MAGENTA);

ImageView iView = (ImageView)findViewById(R.id.ImageView1);
 iView.setImageDrawable(rect);

Drawing Rounded Rectangle


ShapeDrawable rndrect = new ShapeDrawable(new RoundRectShape( new float[] { 15, 15, 5, 5, 15, 15, 5, 5 }, null, null));
 rndrect.setIntrinsicHeight(50);
 rndrect.setIntrinsicWidth(100);
 rndrect.getPaint().setColor(Color.CYAN);

ImageView iView = (ImageView)findViewById(R.id.ImageView1);
 iView.setImageDrawable(rndrect);

or


float[] outerRadii = new float[]{ 16,16, 6, 6, 16,16, 6,6 };
 RectF insetRectangle = new RectF(15, 15, 15, 15);
 float[] innerRadii = new float[]{ 6, 6, 16,16, 6, 6, 16, 16 };
 ShapeDrawable rndrect = new ShapeDrawable(new RoundRectShape( outerRadii,insetRectangle , innerRadii));
 rndrect.setIntrinsicHeight(50);
 rndrect.setIntrinsicWidth(100);
 rndrect.getPaint().setColor(Color.WHITE);

ImageView iView = (ImageView)findViewById(R.id.ImageView1);
 iView.setImageDrawable(rndrect);

Drawing Oval & Circle


ShapeDrawable oval = new ShapeDrawable(new OvalShape());
 oval.setIntrinsicHeight(50);
 oval.setIntrinsicWidth(50);
 oval.getPaint().setColor(Color.CYAN);
 ImageView iView = (ImageView)findViewById(R.id.ImageView1);
 iView.setImageDrawable(oval);

Drawing Arc


ShapeDrawable pacMan = new ShapeDrawable(new ArcShape(0, 340));
 pacMan.setIntrinsicHeight(100);
 pacMan.setIntrinsicWidth(100);
 pacMan.getPaint().setColor(Color.MAGENTA);

ImageView iView = (ImageView) findViewById(R.id.ImageView1);
 iView.setImageDrawable(pacMan);

Drawing Path


Path p = new Path();
 p.moveTo(50, 0);
 p.lineTo(25,100);
 p.lineTo(100,50);
 p.lineTo(0,50);
 p.lineTo(75,100);
 p.lineTo(50,0);

ShapeDrawable star = new ShapeDrawable(new PathShape(p, 100, 100));
 star.setIntrinsicHeight(10);
 star.setIntrinsicWidth(10);
 star.getPaint().setColor(Color.YELLOW);
 star.getPaint().setStyle(Paint.Style.STROKE);

ImageView iView = (ImageView)findViewById(R.id.ImageView1);
 iView.setImageDrawable(star);

Animation

Frame-by-frame animation
(JAVA way)


ImageView iv = (ImageView)findViewById(R.id.ImageView1);
 BitmapDrawable f1 = (BitmapDrawable)getResources().getDrawable(R.drawable.a);
 BitmapDrawable f2 = (BitmapDrawable)getResources().getDrawable(R.drawable.b);
 BitmapDrawable f3 = (BitmapDrawable)getResources().getDrawable(R.drawable.c);
 BitmapDrawable f4 = (BitmapDrawable)getResources().getDrawable(R.drawable.d);

int d = 100;

AnimationDrawable ad = new AnimationDrawable();
 ad.addFrame(f1, d);
 ad.addFrame(f2, d);
 ad.addFrame(f3, d);
 ad.addFrame(f4, d);

iv.setBackgroundDrawable(ad);
ad.start();

Summary Notes Chapter 9 Download