I am building a simple app that will need to graph some data, so I found myself in the need of using Android’s drawing library. There are a few good tutorials out there of how to do this using a canvas, but I read somewhere that it was possible to draw directly into a view and I wanted to try that. Drawing directly into the view is useful when you have data that you don’t need to redraw very often. When you use a canvas you have to manually call the onDraw method every time you want to show something, which makes sense for animations. For more static data you can draw directly into the view and the onDraw method will be called automatically every time the view it is shown to the user.

The first thing I did was create a custom view. I created a views folder inside my project folder (e.g. src/com/ncona/myapp/views) and then created a custom view file called RedCircle.java:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
// The package is the folder where this view lives
package com.ncona.myapp.views;

// Some packages that we use in this class
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Path;
import android.view.View;

// Our class extends View
public class RedCircle extends View
{
    // The constructor calls the View constructor
    public RedCircle(Context context)
    {
        super(context);
    }

    // This is automatically called every time this view is
    // shown to the user
    @Override
    protected void onDraw(Canvas canvas)
    {
        // Draw a red circle
        Path circle = new Path();
        Paint paint = new Paint();
        paint.setStyle(Paint.Style.FILL);
        paint.setColor(Color.RED);
        circle.addCircle(150, 150, 100, Path.Direction.CW);
        canvas.drawPath(circle, paint);
    }
}

I added some comments explaining what each part does, it should be really easy to understand. The next thing I had to do was modify my main activity file (src/com/ncona/myapp/MyApp.java):

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
package com.ncona.myapp;

import android.app.Activity;
import android.os.Bundle;

// To import our view we need to use the fully qualified
// name. This is basically the path beginning from the src
// directory but using . instead of /
import com.ncona.myapp.views.RedCircle;

public class MyApp extends Activity
{
    @Override
    public void onCreate(Bundle savedInstanceState)
    {
        super.onCreate(savedInstanceState);
        // Note here that instead of passing R.layout.main as
        // you would usually do, we are passing an instance of
        // our custom view, which will result on a screen
        // showing a red circle
        setContentView(new RedCircle(this));
    }
}

And this is how it looks:

red_circle

Now I have a very exciting piece of software I can show off to my mom.

[ android  java  mobile  programming  ]
Android development with Docker android mobile
Installable web apps mobile programming
Android development with Docker android mobile
Adding a drawer to your Android app android java mobile programming
Create a navigation menu for your Android app mobile android java programming