Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Java Development

Reply
Highlighted
New Developer
Posts: 108
Registered: ‎01-23-2012
My Device: torch,bold,curve,strom
My Carrier: Blackberry
Accepted Solution

Need animation in a manager

Hi all,

 i want to give animation in  a manager. I have a list while clicking on the first row of that list it will add 3 more rows in bellow of that and when i click again in that same row these row will delete. i am doing this by addind and deleting the manager but i want to give the animation while addind or deleting the manager!

 

Plz suggest!

Thanks & Regards,
Kumar Shivam
Developer
Posts: 19,636
Registered: ‎07-14-2008
My Device: Not Specified

Re: Need animation in a manager

There are a variety of approaches you could try, but be warned, none of them is easy, all are hacks to some extent and I have tried none of them, though I have thought about how I would do something like this should someone ask.

 

Then first point is that if I was asked to do this, I would make 200% sure it was needed,  I would in fact try to persuade my client that this sort of thing is not BlackBerry ish. 

 

The facebook app does something similar, but as you can see from this Thread, it is done with smoke and mirrors anyway...

http://supportforums.blackberry.com/t5/Java-Development/Facebook-Like-Slide-Down-Transition/td-p/157...

As Tim says: "It's all a bunch of crazy tricks behind the scenes."

 

So are you prepared to spend a week trying crazy tricks that may or may not work?

Developer
Posts: 134
Registered: ‎08-03-2011
My Device: torch, Z10
My Carrier: Vodafone, Airtel

Re: Need animation in a manager

Hi shivam,

 

I got this code from somewhere and I have manage to change the code for manager.
Hope this code will helpful for you... 

 

TestScreen.java

 

package com.animationtest;

import net.rim.device.api.ui.component.ButtonField;
import net.rim.device.api.ui.component.LabelField;
import net.rim.device.api.ui.component.NullField;
import net.rim.device.api.ui.container.MainScreen;
import net.rim.device.api.ui.container.VerticalFieldManager;

public class TestScreen extends MainScreen {
	private AnimatedManager _manager1,_manager2;

	public TestScreen() {

		VerticalFieldManager vfm =new VerticalFieldManager();
		vfm.add(new LabelField("labelField 1"));
		vfm.add(new ButtonField("buttonField 1"));
		vfm.add(new LabelField("labelField 2"));
		vfm.add(new ButtonField("buttonField 2"));
	
		_manager1=new AnimatedManager(vfm,true);
		add(_manager1);
		
		
		VerticalFieldManager vfm2 =new VerticalFieldManager();
		vfm2.add(new LabelField("labelField 3"));
		vfm2.add(new ButtonField("buttonField 3"));
		vfm2.add(new LabelField("labelField 4"));
		vfm2.add(new ButtonField("buttonField 4"));
			
		_manager2=new AnimatedManager(vfm2,false);
		add(_manager2);
	}

	protected void onUiEngineAttached(boolean attached) {
		super.onUiEngineAttached(attached);

		if (attached) {
			_manager1.startAnimation();
			_manager2.startAnimation();
		}
	}
}

 

AnimatedManager.java

package com.animationtest;


import net.rim.device.api.system.Application;
import net.rim.device.api.system.Display;
import net.rim.device.api.ui.Field;
import net.rim.device.api.ui.Manager;

import com.animationtest.Animation.AnimationListener;

public class AnimatedManager extends Manager implements AnimationListener {
	private final Animation _animation;		
	private final int _duration = 1000;
	private boolean isFromTop;
	private volatile boolean _isAnimating;
	
	private Manager _field = new Manager(FIELD_HCENTER) {
		protected void sublayout(int width, int height) {
			setExtent(getPreferredWidth(), getPreferredHeight());
		}
	};

	private AnimatedField leftToRightAnimationManager = new AnimatedField() {

		private final int _sx = - Display.getWidth();
		private final Point _pos = new Point(_sx, 0);
		private final Point _dest = new Point(0 , 0);

		public void setField(Manager _manager) {
			_field=_manager;
		}

		public Point getCurrentPosition() {
			return _pos;
		}
		
		public Field getField() {
			return _field;
		}

		public void updatePosition(int time, int duration) {
			_pos.x = _sx + (_dest.x - _sx) * time / duration;
		}
	};

	private AnimatedField topToBottomAnimationManager = new AnimatedField() {

		private final int _sy = - Display.getHeight();
		private final Point _pos = new Point(0,_sy);
		private final Point _dest = new Point(0, 0);

		public void setField(Manager _manager) {
			_field=_manager;
		}

		public Point getCurrentPosition() {
			return _pos;
		}
		public Field getField() {
			return _field;
		}
		public void updatePosition(int time, int duration) {
			_pos.y = _sy + (_dest.y - _sy)  * time / duration;
		}
	};

	public AnimatedManager(Manager _manage, boolean _isFromTop) {
		super(USE_ALL_HEIGHT | USE_ALL_WIDTH);
		isFromTop=_isFromTop;
		_animation = new Animation(_duration);
		_animation.setListener(this);

		if(isFromTop){
			topToBottomAnimationManager.setField(_manage);
			add(topToBottomAnimationManager.getField());
		}
		else{
			leftToRightAnimationManager.setField(_manage);
			add(leftToRightAnimationManager.getField());
		}
	}

	public void startAnimation() {
		_isAnimating = true;
		_animation.start();
	}

	protected void sublayout(int maxwidth, int maxheight) {
		final int width = _field.getPreferredWidth();
		final int height = _field.getPreferredHeight();
		if(isFromTop)
			updateAnimation(topToBottomAnimationManager);
		else
			updateAnimation(leftToRightAnimationManager);
			
		setExtent(width, height);
	}

	private void updateAnimation(AnimatedField af) {
		Field f = af.getField();
		final int width = f.getPreferredWidth();
		final int height = f.getPreferredHeight();

		if (!_isAnimating) layoutChild(f, width, height);	
		setPositionChild(f, af.getCurrentPosition().x, af.getCurrentPosition().y);
	}

	public int getPreferredHeight() {
		return _field.getPreferredHeight();
	}

	public int getPreferredWidth() {
		return _field.getPreferredWidth();
	}
	
	public void onNewFrame(int time) {
		if(isFromTop)
			topToBottomAnimationManager.updatePosition(time, _duration);
		else
			leftToRightAnimationManager.updatePosition(time, _duration);
		synchronized(Application.getEventLock()) {
			updateLayout();
			_isAnimating = time == _duration; 
		}
	}
}

 

Animation.java

package com.animationtest;

public class Animation {
	public static interface AnimationListener {
		void onNewFrame(int time);
	}
	
	private static final int DEFAULT_FPS = 40;
	
	private int _duration;
	private int _time;
	private int _fps = DEFAULT_FPS;
	private Thread _thread;
	private volatile boolean _running;
	
	private AnimationListener _listener;
	
	public Animation(int duration) {
		_duration = duration;
	}

	public void setFPS(int fps) {
		_fps = fps;
	}
	
	public int getFPS() {
		return _fps;
	}
	
	public void setDuration(int duration) {
		_duration = duration;
	}
	
	public int getDuration() {
		return _duration;
	}
	
	public int getTimeElapsed() {
		return _time;
	}
	
	public void setListener(AnimationListener l) {
		_listener = l;
	}
	
	public synchronized void start() {
		if (_thread == null) {
			_running = true;
			_thread = new Thread(new Runnable() {
				public void run() {
					
					final int idleTime = (1000 / _fps * 10 + 10) / 10;
					final int duration = _duration;
					_time = 0;
					
					try {
						while(_running && _time <= duration) {
							animate(_time);
							_time += idleTime;

							Thread.sleep(idleTime);
						}
						
						if (_time - idleTime < duration) animate(duration);
						
					} catch (InterruptedException e) {}
					
					stop();
				}
			});
			
			_thread.start();
		}
	}
	
	public synchronized void stop() {
		
		_running = false;
		
		if (_thread != null && _thread.isAlive()) {
			_thread.interrupt();
			_thread = null;
		}
	}
	
	private void animate(int time) {
		AnimationListener listener = _listener;
		if (listener != null) {
			listener.onNewFrame(time);
		}
		
	}
}

 

AnimatedField.java

package com.animationtest;

import net.rim.device.api.ui.Field;
import net.rim.device.api.ui.Manager;


public interface AnimatedField {

	Field getField();
	
	void setField(Manager _manager);

	void updatePosition(int time, int duration);

	Point getCurrentPosition();
}

 

 

Point.java

package com.animationtest;

public final class Point {
	public int x, y;
	
	public Point(int x, int y) {
		this.x = x;
		this.y = y;
	}
}

 

-----------------------------------------------------------------------
"Like" if you liked the post.
"Accept as Solution" if the post solves your question.
-----------------------------------------------------------------------
Developer
Posts: 134
Registered: ‎08-03-2011
My Device: torch, Z10
My Carrier: Vodafone, Airtel

Re: Need animation in a manager

Hi,

 

in the last posted code 

Here i am passing boolean value true for applying the animation from TOP to BOTTOM and passing false for applying the animation from LEFT to RIGHT.


_manager1=new AnimatedManager(vfm,true);

 

 

-----------------------------------------------------------------------
"Like" if you liked the post.
"Accept as Solution" if the post solves your question.
-----------------------------------------------------------------------
Developer
Posts: 19,636
Registered: ‎07-14-2008
My Device: Not Specified

Re: Need animation in a manager

[ Edited ]

Original source for the code appears to be here:

http://www.nloko.ca/?p=235

 

I have added the source zip to this post in case someone wants to grab the code without cut/paste.  But note the license associated if you do. 

 

I'm not sure how this code would be applied to this situation, but before looking hard, can the OP confirm that they really want to do this?

Developer
Posts: 19,636
Registered: ‎07-14-2008
My Device: Not Specified

Re: Need animation in a manager

Another blog from the same author extending the ideas...

 

http://www.nloko.ca/?p=256

New Developer
Posts: 108
Registered: ‎01-23-2012
My Device: torch,bold,curve,strom
My Carrier: Blackberry

Re: Need animation in a manager

[ Edited ]

Hi brajesh!

 

Thanks a lot for your reply. This code works fine for me.

 

Thanks & Regards,
Kumar Shivam
Developer
Posts: 19,636
Registered: ‎07-14-2008
My Device: Not Specified

Re: Need animation in a manager

To help the next person who comes along with a similar request, could you briefly explain how you have reworked the code to meet your requirment?  Thanks

Visitor
Posts: 1
Registered: ‎09-29-2013
My Device: Nothing
My Carrier: Rogers

Re: Need animation in a manager

Author of those blog posts here. They URLs have since changed (noticed some hits while digging around analytics):

https://www.nloko.ca/blog/2010/11/blackberry-animated/

https://www.nloko.ca/blog/2010/11/blackberry-animated-part-2/

 

Hope the posts help!