| Author |
Message |
Marchu Junior Developer

Joined: 27 Sep 2008 Posts: 21 Location: Netherlands
|
Posted: Thu Oct 09, 2008 1:44 am Post subject: Basic and simple 2D drawing / animation |
|
|
I just started with Android, and have always start a new language with some graphical experiments.
After looking thruw a lot of information, i didn't found a simple way of drawing a (resource) bitmap, and let the bitmap move over the screen. Man, for a simple moving picture, i looked in the api demo's at more then 100 lines of complex code..
The first thought was, that this was more complexer then doing this in other platforms.
But its not.
So i have put together a little example on how to do this, with a few lines of code.
I use 1 class for the ball objects, and for moving the balls over the screen.
ColorBall.java
This class holds the Bitmap, and the position on the screen.
Also he takes care that the ball is not going of the screen. (who knows where he will end up..)
| Java: |
public void moveBall(int goX, int goY) {
// check the borders, and set the direction if a border has reached
if (coordX > 270){
goRight = false;
}
if (coordX < 0){
goRight = true;
}
if (coordY > 400){
goDown = false;
}
if (coordY < 0){
goDown = true;
}
// move the x and y
if (goRight){
coordX += goX;
}else
{
coordX -= goX;
}
if (goDown){
coordY += goY;
}else
{
coordY -= goY;
}
}
|
Also there is a View to draw the balls on. (can't do without)
DrawView.java
| Java: |
package eas.org;
import android.content.Context;
import android.graphics.Canvas;
import android.view.View;
public class DrawView extends View {
private ColorBall colorball1, colorball2, colorball3, colorball4, colorball5;
public DrawView(Context context) {
super(context);
setFocusable(true); //not yet necessary, but you never know what the future brings
// declare each ball with the ColorBall class
colorball1 = new ColorBall(context,R.drawable.bol_groen);
colorball2 = new ColorBall(context,R.drawable.bol_rood);
colorball3 = new ColorBall(context,R.drawable.bol_blauw);
colorball4 = new ColorBall(context,R.drawable.bol_geel);
colorball5 = new ColorBall(context,R.drawable.bol_paars);
}
@Override protected void onDraw(Canvas canvas) {
//canvas.drawColor(0xFFCCCCCC); //if you want another background color
// move the balls at every canvas draw
colorball1.moveBall(5,3);
colorball2.moveBall(3,4);
colorball3.moveBall(2,2);
colorball4.moveBall(4,5);
colorball5.moveBall(5,1);
//draw the balls on the canvas
canvas.drawBitmap(colorball1.getBitmap(), colorball1.getX(), colorball1.getY(), null);
canvas.drawBitmap(colorball2.getBitmap(), colorball2.getX(), colorball2.getY(), null);
canvas.drawBitmap(colorball3.getBitmap(), colorball3.getX(), colorball3.getY(), null);
canvas.drawBitmap(colorball4.getBitmap(), colorball4.getX(), colorball4.getY(), null);
canvas.drawBitmap(colorball5.getBitmap(), colorball5.getX(), colorball5.getY(), null);
// refresh the canvas
invalidate();
}
}
|
Plus some balls to experiment further with this.
This example is written simple and straight forward, but i hope this helps others who just started.
Cheers
| Description: |
|
 Download |
| Filename: |
Balls.rar |
| Filesize: |
57.32 KB |
| Downloaded: |
1437 Time(s) |
|
|
| Back to top |
|
 |
|
|
 |
isaackearl Junior Developer

Joined: 25 Nov 2008 Posts: 20
|
Posted: Tue Nov 25, 2008 8:18 pm Post subject: question for you |
|
|
I've been messing with your tutorial trying to get the bitmap and 2d drawing down.. but I'm having some issues. I made a similiar program.. except I was trying to make some different images bounce around, and this is where I'm having the issues. I am using png files, that are all about the same size as the ones you used for the balls (4k) and they don't work.. I get an error that says "no resources found that match the given name at ( 'src' with value drawable etc etc..."
now if I replace my images with your ball images and change your ball imgs to have the same name as my images were then it works just fine!? and the balls bounce arund and do some other things. but its blowing my mind why my images aren't working! if there are certain rules for the drawable folder or something idon't know them... any help would be appreciated.
thanks
|
|
| Back to top |
|
 |
isaackearl Junior Developer

Joined: 25 Nov 2008 Posts: 20
|
Posted: Wed Nov 26, 2008 8:53 am Post subject: got that working |
|
|
hey marchu I really like your little tutorial... it has really helped me figure some stuff out. I have a question for you or anybody else who may want to answer... lets say that you wanted this program to be exactly as is except for instead of the balls bouncing as soon as the program starts, how could I make them wait until some other cue is given like for example a screen touch.
As of now I have it set up so that the balls bounce for 2 seconds and then they stop. i did this by just doing an if statement that basically says:
if the ball has been bouncing for less then two seconds let it keep moving
else colorball.moveball(0,0)
and it stops
now how could I making it start again with a screen touch or something...
thanks, in advance
|
|
| Back to top |
|
 |
sitara Junior Developer

Joined: 27 Nov 2008 Posts: 13
|
Posted: Fri Nov 28, 2008 3:13 am Post subject: |
|
|
hi,
i am using the tutorial above DrawView.java to run it in android.
public class DrawView extends View {
private [b]ColorBall [/b]colorball1, colorball2, colorball3, colorball4, colorball5;
the word ColorBall has th red curlyy underlined i the program. it says tat th ColorBall cannot be resolved to a type.
because the ColorBall is highlighted with the red curly lines, the rest of the colorballs have been highlighted the same was as well.
do you know how i can resolve the error? anyone?
sitara
|
|
| Back to top |
|
 |
nithin.warier Experienced Developer

Joined: 28 Feb 2008 Posts: 84 Location: Malappuram Kerala India
|
Posted: Wed Mar 11, 2009 3:00 pm Post subject: |
|
|
Hi Marchu,
superb program, the way you did, you use complete android resource, didnt use any thread, in onDraw, you redrawing the balls, really nice way of coding..
Thanks
Nithin
|
|
| Back to top |
|
 |
Marchu Junior Developer

Joined: 27 Sep 2008 Posts: 21 Location: Netherlands
|
Posted: Sun Mar 22, 2009 7:36 pm Post subject: |
|
|
| nithin.warier wrote: | Hi Marchu,
superb program, the way you did, you use complete android resource, didnt use any thread, in onDraw, you redrawing the balls, really nice way of coding..
Thanks
Nithin |
Well you have stated how good you are, so why not giving a code remake, instead of complaining about this.
See the date of the post, and my comment that i was just started with android at the the time of writing. (6 months ago)
Also my comment 'This example is written simple and straight forward, but i hope this helps others who just started', shows that its not a killer app, but only to get the idea about simple drawing.
Beside that, its really not contributing anything, the way you give this comment. (negative, sarcastic and from above)
Or are you doing this with all the old posts, to give yourself a 'go(o)d' feeling?
Marchu
Last edited by Marchu on Mon Mar 23, 2009 2:04 am; edited 1 time in total |
|
| Back to top |
|
 |
|
|
 |
nithin.warier Experienced Developer

Joined: 28 Feb 2008 Posts: 84 Location: Malappuram Kerala India
|
Posted: Mon Mar 23, 2009 1:56 am Post subject: |
|
|
| nithin.warier wrote: | Hi Marchu,
superb program, the way you did, you use complete android resource, didnt use any thread, in onDraw, you redrawing the balls, really nice way of coding..
Thanks
Nithin |
|
|
| Back to top |
|
 |
nithin.warier Experienced Developer

Joined: 28 Feb 2008 Posts: 84 Location: Malappuram Kerala India
|
Posted: Mon Mar 23, 2009 1:58 am Post subject: |
|
|
| I said, i like the way you coded, its not sarcasm, its appreciation buddy...
|
|
| Back to top |
|
 |
Marchu Junior Developer

Joined: 27 Sep 2008 Posts: 21 Location: Netherlands
|
Posted: Mon Mar 23, 2009 2:07 am Post subject: |
|
|
| nithin.warier wrote: | | I said, i like the way you coded, its not sarcasm, its appreciation buddy... |
Well then i must give you my excuse.
I totaly misunderstood your comment, and thougth it was like i mentioned.
Sorry about that. (no harm done i hope..)
|
|
| Back to top |
|
 |
Derek5432 Junior Developer

Joined: 12 Mar 2009 Posts: 15
|
Posted: Wed Apr 08, 2009 5:21 am Post subject: |
|
|
| I like this approach as well, Marchu. But I have a question: How might you use this approach to handle a sequence of animations? E.g., on touching the screen, a red ball moves across the screen from left to right. On a second touch, a yellow ball moves from the bottom to the top of the screen? Would this be possible with the current approach, or would Android's Animation package be required?
|
|
| Back to top |
|
 |
msharank Once Poster

Joined: 15 Apr 2009 Posts: 1
|
Posted: Wed Apr 15, 2009 10:40 am Post subject: |
|
|
Ive just started with Java and Android and its very nice example Marchu. Thanks.
btw i just wondering how to add background on this example? Ive tryed with image and layout background but when i start app there is just black screen. I guess it has something to do with redrawing screen everytime you move balls ?
|
|
| Back to top |
|
 |
crockysam Freshman

Joined: 26 Oct 2009 Posts: 3
|
Posted: Wed Oct 28, 2009 6:55 pm Post subject: |
|
|
How can I put this DrawView into XML so that I can position it on the screen using the XML layout?
Do I need a ViewStub or something like that?
Thx for the example btw, great thing you made
|
|
| Back to top |
|
 |
crockysam Freshman

Joined: 26 Oct 2009 Posts: 3
|
Posted: Wed Oct 28, 2009 9:00 pm Post subject: |
|
|
Ok, I solved this by creating a LinearLayout inside my XML and then add the DrawView to the LinearLayout:
| Java: | LinearLayout ll= (LinearLayout) findViewById(R.id.ll);
int width = ll.getLayoutParams().width;
int height = ll.getLayoutParams().height;
DrawView drawView = new DrawView(this, width, height);
ll.addView(drawView, new LinearLayout.LayoutParams(width, height)); |
Also updated the drawView constructor to accept the width an the height and use it as a maximum X and Y for the balls to move...
|
|
| Back to top |
|
 |
|
|
You cannot post new topics in this forum You cannot reply to topics in this forum You cannot edit your posts in this forum You cannot delete your posts in this forum You cannot vote in polls in this forum You cannot attach files in this forum You can download files in this forum
|
© 2007, Android Development Community
All rights reserved.
Powered by phpBB.
|