1. Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved. 0132130807 1 Introduction to Android (Part 3) Understanding Android Graphics

2. Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved. 0132130807 The Android libraries do not have the same type of Color class as the one available in the standard Java Awt library. The Android Color library (from the android.graphics package) consist of a set of Static methods for producing an integer value that represents 4 byte Alpha-RGB value or ARGB value. The first byte is the alpha value (0-255), the second byte is the red value (0-255), the third byte is the green value (0-255), and the fourth byte is the blue value (0-255). Representing Color

3. Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved. 0132130807 You can use the Color constants provided in the Color class or you can you the Color.rgb(red,green,blue) method or the Color.argb(alpha,red,green,blue) method to create a custom color value. The Alpha value gives the amount of transparency in the color. A value of 255 means no transparency, and a value of 0 means completely transparent. The other RGB values combine to create colors in the normal way, meaning that (255,255,0) will create yellow. RGB Color Combinations

4. Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved. 0132130807 F The predefined colors include the following: Object Color.BLACK Color.BLUE Color.CYAN Color.DKGRAY Color.GRAY Color.GREEN Color.LTGRAY Color.MAGENTA Color.RED Color.TRANSPARENT Color.WHITE Color.YELLOW ARGB Value 255, 0, 0, 0 255, 0, 0, 255 255, 0, 255, 255 255, 64, 64, 64 255, 128, 128, 128 255, 0, 255, 0 255, 192, 192, 192 255, 255, 0, 255 255, 255, 0, 0 0, 255, 255, 255 255, 255, 255, 255 255, 255, 255, 0 The Color Constants

5. Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved. 0132130807  Let's explore some of the methods of the Canvas class that draw shapes in more detail F The first parameters specify the top left coordinates and the bottom right coordinates (leftX, topY, rightX, bottomY). F The last parameter specifies a Paint object that determines the color to use, whether the object is filled (FILL) or unfilled (STROKE) and other drawing details of the pen that will draw the shape. The paint object can be set like so: paint.setColor (Color.RED); paint.setStyle (Style.STROKE); Drawing Shapes

6. Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved. 0132130807 X Y 10 20 150 45 canvas.drawLine (10,20,150,45,paint); canvas.drawLine (150,45,10,20,paint); or Drawing a Line

7. Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved. 0132130807 X Y canvas.drawRect (50,20,150,60,paint); 50 20 100 40 (150, 60) Drawing a Rectangle

8. Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved. 0132130807 X Y Rectf ovalRect = new Rectf(); ovalRect.set (175,20,225,100); canvas.drawOval (ovalRect,paint); 175 20 50 80 (225, 100) bounding rectangle Drawing an Oval (Note: You must create a RectF object and place the oval inside)

9. Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved. 0132130807  The drawArc method draws an arc. drawArc(oval, 180, 180, false, paint);  The drawArc method takes five arguments. –The first argument is the bounding RectF object, like with the drawOval method. –The next two arguments indicate where the arc starts, and the number of degrees through which is sweeps clockwise. –The next argument determines if the center point is shown as a connected point in a unfilled (stroke) drawing. –The next argument is the paint to use. Drawing an Arc

10. Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved. 0132130807 (Note: You must create a RectF object and place the oval inside) Rectf oval = new Rectf(); oval.set(x,y,x+Width,y+Height); canvas.drawArc(oval,0,90,false,paint); Rectf oval = new Rectf(); oval.set(x,y,x+Width,y+Height); canvas.drawArc(oval,0,-90,false,paint); The fourth argument is a flag to determine if the center is included in the arc (making it a wedge). It is false in the above examples. Specifying an Arc

11. Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved. 0132130807 (Note: You must create a RectF object and place the oval inside) Rectf oval = new Rectf(); oval.set(x,y,x+Width,y+Height); canvas.drawArc(oval,0,90,true,paint); Rectf oval = new Rectf(); oval.set(x,y,x+Width,y+Height); canvas.drawArc(oval,0,-90,true,paint); The fourth argument is a flag to determine if the center is included in the arc (making it a wedge). It is true in the above examples. Specifying an Arc

12. Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved. 0132130807 3 In the Canvas class the following methods are available for drawing certain shapes: canvas.drawLine(x1, y1, x2, y2, paint); canvas.drawRect(x, y, x+width, y+height, paint); canvas.drawOval(x, y, x+width, y+height, paint); canvas.drawArc(x, y, x+width, y+height, startAngle, arcAngle, paint); canvas.drawText(String, x, y, paint); canvas.drawColor(Color); // fills entire canvas with color, like a backgrd color And the following methods are available for manipulating the pen: paint.setColor(Color); // sets pen color paint.setStyle(Style); // Style.FILL = filled/ Style.STROKE = unfilled paint.setStrokeWidth(Width); // sets stroke width, Width is an int paint.setTextSize(Size); // sets text size, Size is an int paint.setTypeface(TypeFace); // sets type face Basic Drawing Methods

13. Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved. 0132130807 F In the Canvas class, to draw polygons, the Path class is used instead of standard Java Polygon class. For instance, a three sided shape that had vertices at the three points (x1,y1), (x2,y2) and (x3,y3) would be drawn by creating a Path object like so: Path pathShape = new Path(); pathShape.moveTo(x1,y1); pathShape.lineTo(x2,y2); pathShape.lineTo(x3,y3); pathShape.close (); canvas.drawPath(pathShape, paint); F The moveTo() method starts the path, then points are added with the lineTo() command, and when you call close() a line segment to the original point is added. You can also just lineTo() the first point to end the path, or that and the close() out to end the path. Polygons

14. Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved. 0132130807 F In the Canvas class, Bitmap objects are used instead of standard Java Image objects to show images. F PNG, GIF and JPEG images are supported. To load an image file, you must put it in one of the “drawable” folders and then use a command like the following that does not include the image’s file extension in the filename: Bitmap bmp = BitmapFactory.decodeResource(resource, R.drawable.filename); F The resource object that is passed to this method is usually retrieved using the getResources() method if you are in a View or the getApplicationResources() method in an Activity. Bitmaps

15. Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved. 0132130807 F Once you have the Bitmap object you can place it anywhere on the canvas using its (x,y) coordinate. For instance, you could display the bitmap at position (40,20) as its top left corner like so: canvas.drawBitmap(bmp,40,20,paint); F If you want to resize the bitmap, you need to create a Rect or RectF object that has the new size dimensions in it, then you can resize the bitmap and place it at any (x,y) coordinate like so: Rect newDim = new Rect(x,y,x+newWidth,y+newHeight); canvas.drawBitmap(bmp,null,newDim,paint); Bitmaps

16. Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved. 0132130807 F If you want to draw just a portion of the bitmap, you can provide two Rect objects, where the first has the portion of the original Bitmap dimensions you wish to use, the second has the place you would like two draw that portion on the canvas. The following lines draws the top left corner of a bitmap onto the top left corner of the screen at whatever new dimensions are desired: Rect oldDim = new Rect(0,0,bmpWidth/2,bmpHeight/2); Rect newDim = new Rect(0,0,newWidth,newHeight); canvas.drawBitmap(bmp,oldDim,newDim,paint); Bitmaps

17. Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved. 0132130807 F If you want a bitmap to blend into its background, you can do so by setting the alpha value of the paint to whatever transparency level you want. The following example draws the bitmap at a half transparent alpha value because 128 is about half of 255: paint.setColor(Color.argb(128,0,0,0)); canvas.drawBitmap(bmp,x,y,paint); Bitmaps

18. Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved. 0132130807 The onDraw() method and Animation F You can draw your bitmap onto any View using the onDraw() method of the View. The onDraw() method accepts a Canvas object which you use to draw into the View. F To animate a bitmap you would repeatedly move the x and/or y coordinate of the image in a different method than the onDraw() method, and then call the inValidate() method of the View which will trigger the onDraw() method to run. If you do this in a Timer, you can manage the interval of the updates to make the animation update accordingly.

19. Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved. 0132130807 Timers F There are many ways to make a task run at a certain interval in Android, and we will cover some of the ways that are native to the Android OS in the future. However, using the Timer class from the standard java.util library is a very reliable approach. The only issue that is tricky with this approach is that you cannot access the Android UI thread directly from the thread the Timer triggers. F Instead the Timer thread must call a separate method to post a new thread which will run on the Android UI thread. Although this may sound convoluted, it is a simple pattern to follow as shown in the example that follows.

20. Liang, Introduction to Java Programming, Eighth Edition, (c) 2011 Pearson Education, Inc. All rights reserved. 0132130807 Timer Example  Setting up the timer for INTERVAL milliseconds: // Constructor header code goes up here myTimer = new Timer(); myTimer.schedule(new TimerTask() { @Override public void run() { TimerMethod(); } }, 0, INTERVAL); // End the Constructor down here private void TimerMethod() { //Same thread as the timer, so need to call runOnUiThread() method from here. this.runOnUiThread(Timer_Tick); } private Runnable Timer_Tick = new Runnable() { public void run() { //This method runs in the Android UI thread. // Do your UI tasks here } };