Growing Line Android Effect - android

I am developing an android app and I should draw a line from the Point A to the Point B but I would like to show this line be drawing "progressively" from one point to other. How can I do it?
Thanks a lot!

You can use a Thread to progressively increase the size of your line, by increasing its ending x position, as an example, and then call View.postInvalidate() from your thread.
This way, if x is the ending of your line and view the View that draws a line ending at x you would have this thread:
class LineThread extends Thread {
public void run() {
while (x < some_limit) {
x += some_value;
view.postInvalidate();
try {
sleep(some_time);
}
catch(InterruptedException e) {
log.e(getClass.getName(), "sleep() was interrupted", e);
}
}
}
}
and in your view:
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.drawLine(left, top, right + x, bottom, paint);
}
Making LineThread a subclass of your View class would make it easy as they could share x.

You could have a look at linear interpolation, but I'm not sure if it'll be too time consuming just for this - should be fine if you're only doing it for a few lines at a time!
Since you have the start_point and your end_point, you can lerp to find the current_point for each timeframe and then use drawLine between start_point and current_point.

Related

invalidate() doesn't refresh View

i'm struggling with this for a while, not sure if because almost 2 years of absence in Android DEV or my stupidity, I've tried everything and just cannot redraw my screen even if invalidate() is happening. Here's some code:
GameActivity.java
onCreate
...
final CanvasActivity mCanvasActivity = new CanvasActivity(this);
setContentView(mCanvasActivity);
mCanvasActivity.setOnTouchListener(new OnSwipeTouchListener(this) {
#Override
public void onSwipeTop() {
tilesArray[playerPositionY][playerPositionX] = 0;
playerPositionY--;
tilesArray[playerPositionY][playerPositionX] = 2;
mCanvasActivity.invalidate();
}
CanvasActivity.java
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
movePlayer(canvas);
Log.e("player", "x " + playerPositionX + " y " + playerPositionY);
}
movePlayer
if (currentBlock == 0) {
canvas.drawRect(posLeft, posTop, posRight, posBottom, paintWall);
} else if (currentBlock == 1) {
canvas.drawRect(posLeft, posTop, posRight, posBottom, paintLabirynth);
} else if (currentBlock == 3) {
canvas.drawRect(posLeft, posTop, posRight, posBottom, paintExit);
} else {
canvas.drawRect(posLeft, posTop, posRight, posBottom, paintCharacter);
}
So basically, when We swipe to the top, position is being changed by movePlayer (decreasing y in 2d array). Then, every rectangle on screen is being redrawn (whole screen has only rectangles which are drawn with different colors according to array line by line, doesn't matter I suppose). My variables are changing properly, so invalidate() is firing onDraw(), however there's no change on the screen. Any help much appreciated.
Looks like I didn't reset paintY to 0 every onDraw call and it was painting properly, but below the screen. Like I said, could be, and was, my stupidity :).

Can you draw multiple Bitmaps on a single View Method?

currently I am trying to make an animation where some fish move around. I have successfully add one fish and made it animate using canvas and Bitmap. But currently I am trying to add a background that I made in Photoshop and whenever I add it in as a bitmap and draw it to the canvas no background shows up and the fish starts to lag across the screen. I was wondering if I needed to make a new View class and draw on a different canvas or if I could use the same one? Thank you for the help!
Here is the code in case you guys are interested:
public class Fish extends View {
Bitmap bitmap;
float x, y;
public Fish(Context context) {
super(context);
bitmap = BitmapFactory.decodeResource(getResources(), R.drawable.fish1);
x = 0;
y = 0;
}
#Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.drawBitmap(bitmap, x, y, null);
if (x < canvas.getWidth())
{
x += 7;
}else{
x = 0;
}
invalidate();
}
}
You can draw as many bitmaps as you like. Each will overlay the prior. Thus, draw your background first, then draw your other images. Be sure that in your main images, you use transparent pixels where you want the background to show through.
In your code, don't call Invalidate() - that's what causes Android to call onDraw() and should only be called from somewhere else when some data has changed and needs to be redrawn.
You can do something like this, where theView is the view containing your animation:
In your activity, put this code in onCreate()
myAnimation();
Then
private void myAnimation()
{
int millis = 50; // milliseconds between displaying frames
theView.postDelayed (new Runnable ()
{
#Override public void run()
{
theView.invalidate();
myAnimation(); // you can add a conditional here to stop the animation
}
}, millis);
}

Android moving a shape faster on Canvas

I have a class which is extended from ImageView (lets call it 'surface'). On onDraw method, a little dot is drawing on canvas. When I click a button I try to move this dot to another location. You can consider like manual version of translate animation. It works but now I try to figured out speed of this moving. I mean I want dot moving faster.
Relevant part of surface :
private float actual_x=100,actual_y=100; // Dot is drawn on 100,100 at beginning
private float increase_x,increase_y;
private boolean isMovingResume=false;
private int moving_counter;
public void changeLocation(float x,float y){
isMovingResume=true;
moving_counter=0;
increase_x=(x-actual_x)/50;
increase_y=(y-actual_y)/50;
invalidate(); // This trigger onDraw method
}
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
canvas.drawCircle(actual_x,actual_y,15,fill_paint);
if(isMovingResume){
actual_x=actual_x+increase_x;
actual_y=actual_y+increase_y;
if(moving_counter==49){ // Moving will end after 50 redraw
isMovingResume=false;
}
else{
moving_counter++;
}
invalidate(); //redraw
}
}
And my button click :
button.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
surface.changeLocation(200,200);
}
});
Like I said, it works but I want it more faster. For example, in this case moving time is 2 second, How can I make it 0,5 second ?
Thanks for all replies.
You need to switch to surfaceview or even faster textureview, both use a canvas as well, and have better performance. Textureview especially as it is hardware accelerated and I also feel it behaves better than surfaceview. That or even consider going to GLSurfaceView.
You can see some example code of surfaceview and textureview: Here

Android Animate canvas.drawLine

I'm trying to draw a few lines on a DrawView which extends SurfaceView.
in my onDraw method I loop over a list of float arrays and draw lines.
#Override
public void onDraw(final Canvas canvas) {
synchronized (lines) {
super.onDraw(canvas);
for (float[] l : lines) {
paint.setAntiAlias(true);
canvas.drawLines(l, paint);
}
}
}
I would like to animate each of these lines. I've tried to use ViewAnimator even though it's only Honeycomb and above but either I don't understand how to use it or it just isn't meant to be used with canvas.drawLine(). I've tried to use paint.setPathEffect but it doesn't seem to work at all. Anyone have any idea how to do this? I just want each line to take something like 1 second to draw one after the other.

Android image moving animation problem

i used following code to animate a image it works fine but while animating the image looks little jumping rather than smooth moving.(It looks like moving but not quite smooth. it stops a while in between) Can Any one find the problem in code?
class AnimationLoop implements Runnable
{
public void run()
{
while(true)
{
while(running)
{
try
{
Thread.sleep(30);
}
catch(InterruptedException ex) {}
}
}
counter+=1;
updatePosition(0);
main.postInvalidate(); //main is type panel
}
private synchronized void updatePosition(int index) {
mYPositions[index]-=2; // animate from bottom to top
mXPositions[index]-=2;
}
#Override
protected void onDraw(Canvas canvas)
{
canvas.drawBitmap(balloonSet.get(0), mXPositions[0], mYPositions[0],null);
}
The smoothness of your animation will depend on the change in coordinates and the time it stays at a single coordinate. If you want to move the animation at same speed but a little smooother, then reduce the time and unit change by same ratio.
For example: Your case reduce by 50%. That will make x and y position to be deducted by 1 and the sleep time will be 15ms.
This might help how to animate bitmaps

Categories

Resources