Android - Drawing

Objective #1: Understand how to upload a normal picture into a program

• Android supports png graphic files (i.e. graphic files with the .png file extension).
• If you want to upload a picture into a program, save the picture with .png extension in the drawable-hdpi folder.  To access this file go to your workspace folder -> project folder -> res -> which drawable file you need, each folder has different uses:
• Drawable-hdpi is the file used by the code in the xml folder and is for high-density screens.
• Drawable-ldpi is the file used by the code as well, but for low-density screens.
• Drawable-mdpi is the file for the icons that will be seen by the user on the phone window.  The m in the mdpi stands for manifest, which can only be accessed by the manifest folder.
• To access the picture in the drawable-hdpi folder in the xml window enter this code

android:background="@drawable/nameofpicture(without.png)"

• This code goes into any object, if you want it as the background for the program, just type this code in the parent layout
• You can also use an ImageView to hold the graphic.
  
  
• To change the icon for the application:
• In the Package Explorer of Eclipse go to “AndroidManifest.xml” of that project.  Here you can change the properties of the application in certain ways.  You can change the name of the application that appears on the Android, or what we are interested in at this time is the icon of the application on the Android.
• It is easier to access the drawable-mdpi folder and edit that icon to ensure that the size is not distorted.
• After you have changed the icon, go to the Icon property and click “Browse.”  Go directly to the drawable-mdpi folder and find your icon.  If you edited the icon they provided, you just need to refresh and can skip this step.

Objective #2: Understand how to change colors in xml format

• When you want to change the color of an object in your project you can do it in both xml and in the normal code window.
  
  
• To change the color of an xml object type this code:

 android:background="#hexadecimal code"

• To find hexadecimal values go to: http://www.cloford.com/resources/colours/500col.htm
  
  
• Likewise to change text color use:

android:textColor="#000

Objective #3: Understand how to change colors in code

• Typing the code for changing colors is similar to programming it in XML code.
• You need to use      import android.graphics.Color;     in order to type in different colors
• This code will type in blue color

TextView x = new TextView(this);       
x.setText("BLUE");
x.setTextColor(Color.BLUE);      
setContentView(x);

Objective #4: Understand how to use the onDraw method

• This is an example of how you should go about using onDraw

public class DrawView extends Activity
{
      DemoView demoview;
      /** Called when the activity is first created. */
      @Override
      public void onCreate(Bundle savedInstanceState)
      {
            super.onCreate(savedInstanceState);
            demoview = new DemoView(this);
            setContentView(demoview);
      }

      private class DemoView extends View
      {
            public DemoView(Context context)
            {
                  super(context);
            }

            @Override protected void onDraw(Canvas canvas)
            {
                  super.onDraw(canvas);

• You need to implement a DemoView as a global variable in order for this to work.  Then in the onCreate method fully implement it, and set the screen as the DemoView that you will then create.
• The DemoView class needs to be considered private and MUST extend the View class.
• Inside of the DemoView class begin typing the public class that sets all of the properties as the context.
• The onDraw method begins to draw what you want. You must @Override this method in order for it to work!!
• Prior to typing out the code, install these packages at the top of the code

import android.app.Activity;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.os.Bundle;
import android.view.View;

• A sample piece of code for drawing a rectangle is:

canvas.drawRect(100, 160, 220, 280, paint);

• Inside of the drawRect method the values are (startX-coordinate, startY-coordinate, endX-coordinate, endY-coordinate, paint);
• You should draw your design on graph paper before coding your program.
  
  
• To draw a line type this code:

canvas.drawLine(100, 160, 220, 280, paint);

• The parameters for drawLine are identical to drawRect

• In order to draw a rectangle or an object, you should instantiate a Paint object that will act as a “paintbrush” for the screen, an example of this is      Paint paint = new Paint( );        
  
  After creating a new “paintbrush,” you can now change the paint color and paint brush style. 
  By typing paint.setColor(Color.RED); your “paintbrush” is now red. 
  By typing paint.setStyle(Paint.Style.FILL); the paintbrush will now paint everything inside of the object that color.
  
  
• The setAntiAlias method of the Paint class causes for the edges to be smooth, for example: if you program a circle without setting the AntiAlias method to “true”, the edges will be “pixely.”  With the AntiAlias set to “true,” the edges are perfectly round and smooth.
  
  
• This author explains various draw methods - http://bestsiteinthemultiverse.com/2008/11/android-graphics-example