Animation with Eclipse Shell – A simplistic approach – Part-III

Animation with Eclipse Shell – A simplistic approach
An article by Debadatta Mishra
Introduction
While designing web page screens or desktop screens, it also matters how attractive is the screen design. In case of web page design, there are many APIs to enhance the beauty of the screens. However in case of modern screen design, animation in a screen plays a vital role. In case of desktop application, we can also provide better screen design with a bit of screen animation to impress the user. In this article I will show you how you can provide animated screens using Eclipse API in a simple manner.

Technicalities
As per the technicalities involved in SWT and Jface, there is no default animation effect API. All the API provided by Eclipse is generic and you can model your UI design in various ways. You can achieve the movement of a shell by dynamically setting the size of the shell. You have to understand certain methods like “setBounds”,”setLocation()” and “setSize()” provided by Eclipse API. Let us have a look into the following code structures for better understanding.

Code for TestShellAnimation.java

package com.core.plugin.shell;

import org.eclipse.swt.SWT;
import org.eclipse.swt.events.SelectionAdapter;
import org.eclipse.swt.events.SelectionEvent;
import org.eclipse.swt.graphics.Point;
import org.eclipse.swt.layout.RowLayout;
import org.eclipse.swt.widgets.Button;
import org.eclipse.swt.widgets.Display;
import org.eclipse.swt.widgets.Event;
import org.eclipse.swt.widgets.Listener;
import org.eclipse.swt.widgets.Shell;

/**
* This class is used to show the simplest animation
* while opening the shell.
* @author Debadatta Mishra(PIKU)
*
*/
public class TestShellAnimation
{
/**method used to increase the shell rapidly
* @param shell of type Shell
*/
private static void doAnimation( Shell shell )
{
for( int i = 21 ; i < 501 ; i++ )
{
shell.setSize(20+i, 20+i);
}
}

/**Method used to open the shell and then display
* the animation with the shell by increasing
* the shell size dynamically.
* @param shell of tyep {@link Shell}
*/
private static void openAnimation( Shell shell )
{
try
{
shell.open();
doAnimation(shell);
}
catch( Exception e )
{
e.printStackTrace();
}
}

/**
* This method is used to show the animation
* by decreasing the x and y coordinates and
* by setting the size dynamically.
* @param shell of type {@link Shell}
*/
private static void shrinkClose( Shell shell )
{
Point shellArea = shell.getSize();
int x = shellArea.x;
int y = shellArea.y;
while( x != -200 )
{
try
{
shell.setSize(x–, y–);
}
catch( Exception e )
{
e.printStackTrace();
}
}
}
//Main method to execute
public static void main(String[] args)
{
Display display = new Display();
final Shell shell = new Shell(display);
shell.setLayout( new RowLayout());
shell.setSize(20, 20);
Button b = new Button(shell, SWT.BORDER | SWT.BOLD);
b.setText(“Close me”);

b.addSelectionListener( new SelectionAdapter()
{
public void widgetSelected(SelectionEvent se)
{
shrinkClose(shell);
shell.dispose();
}
}
);
openAnimation(shell);
shell.addListener(SWT.Close, new Listener()
{
public void handleEvent(Event arg0)
{
shrinkClose(shell);
}
}
);
while (!shell.isDisposed())
{
if (!display.readAndDispatch())
display.sleep();
}
display.dispose();
}
}
In the above program, a Shell will be animated and the size will be increased dyanmically while opening.

Assumptions
I assume that reader of this article has
Exposure to eclipse plugin development
Knowledge on Java language
Knowledge on running programs in Eclipse editor

Test Case details
I have tested the above program in the following conditions.
OS Name : Windows Vista
Eclipse API : 3.2
Java : 1.6.0_16
Java Editor : Eclipse 3.2

Conclusion
I hope that you will enjoy my article. This article does not bear any commercial significance , it is only meant for learning and for novice developers. In case of any problem or errors , feel free to contact me in the email debadatta.mishra@gmail.com .

Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s