Search

Saturday, July 25, 2009

android program to draw grid view using canvas and paint methods

recently i wanted to draw a grids using canvas using draw line and paint method though working with canvas and java is new to me as i am from .NET C# background i did not find any samples on net on android after small R&D i was able to draw it using samples given in SDK, below is the sample code thought of posting it here in case if any body is looking for this



package testt.manju.com;

import android.app.Activity;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.Typeface;
import android.graphics.Paint.Style;
import android.os.Bundle;
import android.view.Display;
import android.view.KeyEvent;
import android.view.MotionEvent;
import android.view.View;

public class gridd extends Activity {
DemoView demoview;
int width = 0;
int height = 0;
int pass = 0;
int xpos = 0;
int ypos = 0;

/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
demoview = new DemoView(this);
setContentView(demoview);
}
@Override
public boolean onKeyDown(int keyCode, KeyEvent event) {
return super.onKeyDown(keyCode, event);
}

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

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

// custom drawing code here
// remember: y increases from top to bottom
// x increases from left to right

Paint paint = new Paint();
paint.setStyle(Paint.Style.FILL);

// make the entire canvas white
paint.setColor(Color.TRANSPARENT);
canvas.drawPaint(paint);

Display display = getWindowManager().getDefaultDisplay();
width = display.getWidth();//start
height = display.getHeight();//end


xpos = width / 7;
ypos = height/7;
for (int i = 0; i < 7; i++) {

paint.setColor(Color.WHITE);
canvas.drawLine(xpos +(xpos*i), 0, xpos +(xpos*i), height, paint);
//canvas.drawLine(startX, startY, stopX, stopY, paint)

}
paint.setStyle(Style.STROKE);
for (int i = 0; i < 7; i++) {
paint.setColor(Color.WHITE);
canvas.drawLine(0, (ypos*pass)+ 5, width, (ypos*pass)+5, paint);
pass++;

}
}
}
}

If the above code is not working or if there is a better way of doing it please leave a comment and your suggestions will be helpful

21 comments:

Anonymous said...

I get a crash when I test the code. :/

Anonymous said...

thanks for the code man its working. this was i looking for can you tell me how to update the grid continiously like animation?

Deenz said...

Thank you so much.. It helped me alot.

Anonymous said...

good one.

saimohanj2me said...

Thanks for this valuable information

I am looking to display these lines in my main.xml
which is already displaying some text and some images which are updates dynamically based on network connection and GPS connection

I am new to android..
Help me in this.. Its very urgent task for me

Anonymous said...

tanks dud

Unknown said...

Thanks...

Nomad0404 said...

Surely you can use i instead of pass.

You declare: int pass = 0;

And start the loop int i = 0;

As pass increases by one with each pass of the loop it can safely be replaced by i.

Phil

Munmun sen said...

thanks! it was gr8 help !

Anonymous said...

Thanks for this tutorial...but can you help me in making this grid structure workable....example: I want to move coins in the grid view, similar to chess game or checker...can you help me.....

Anonymous said...

thaaaaaaaaaaaaaaanks dude helped me soooo much =)

Anonymous said...

wt-f is DemoView

chandrababu said...

Thanks Dude...... :)

Chandra

Anonymous said...

thanks alot..

Anonymous said...

please tell how to erase strokes and then again start drawing

Anonymous said...

This is what I'm looking for, thanks so much for posting!

Tom Esch said...

@anonymous: In the onDraw() method, you can put invalidate() somewhere after the code to paint the canvas.
ie put inside a for loop for the drawing code for i in range(0,10):
canvas.drawLine( 0, i, 0, i , paint)
then outside the loop put invalidate(). Try this it will dynamically draw a line for you

Fun With Puzzles said...

Thanks! Good one to start with

Nithya-Apps said...

Thanks ....good one..

Unknown said...

comment je peux tourner ce code !! je n'arrive pas a lui attacher un layout !!

Unknown said...

thnx, pleaase how can i make this working, i can't assign an xml layout !!! :(((

Post a Comment

Other Interesting Articles



Related Article Widget by Yogith

Search Powered by Google