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

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 AnimatedShell.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.Rectangle;
import org.eclipse.swt.layout.RowLayout;
import org.eclipse.swt.widgets.Button;
import org.eclipse.swt.widgets.Display;
import org.eclipse.swt.widgets.Shell;

/**
* This class is used to display the minimal animation
* effect in a shell in a very simple manner.
* @author Debadatta Mishra(PIKU)
*
*/
public final class AnimatedShell
{
/**
* This method is used to move down the shell
* in the monitor area. Here the key point is
* X coordinate is constant and Y coordinate
* increases slowly to bring the effect.
* @param shell of type {@link Shell}
* @author Debadatta Mishra(PIKU)
*/
private static void moveDown( final Shell shell )
{
int x = shell.getBounds().x;
int y = shell.getBounds().y;
//X constant and Y increases
while( y < 1000 )
{
try
{
shell.setLocation(x, y++);
Thread.sleep(2);
}
catch( Exception e )
{
e.printStackTrace();
}
}
}

/**
* This method is used to move up the shell
* in the monitor area. Here the key point is
* X coordinate is constant and Y coordinate
* decreases slowly to bring the effect.
* @param shell of type {@link Shell}
* @author Debadatta Mishra(PIKU)
*/
private static void moveUp( final Shell shell )
{
int x = shell.getBounds().x;
int y = shell.getBounds().y;
//X constant and Y decreases
while( y > -200 )
{
try
{
shell.setLocation(x, y–);
Thread.sleep(2);
}
catch( Exception e )
{
e.printStackTrace();
}
}
}

/**
* This method is used to move right up the shell
* in diagonal of the right side of monitor area.
* Here the key point is
* X coordinate increases and Y coordinate
* decreases slowly to bring the effect.
* @param shell of type {@link Shell}
* @author Debadatta Mishra(PIKU)
*/
private static void moveRightDiagonalUp( final Shell shell )
{
int x = shell.getBounds().x;
int y = shell.getBounds().y;
//X increases and Y decreases
while( y > -200 )
{
try
{
shell.setLocation(x++, y);
shell.setLocation(x++, y–);
Thread.sleep(2);
}
catch (Exception e)
{
e.printStackTrace();
}
}
}

/**
* This method is used to move up the shell
* in the left side of monitor area. Here the key point is
* X coordinate decreases and Y coordinate
* decreases slowly to bring the effect.
* @param shell of type {@link Shell}
* @author Debadatta Mishra(PIKU)
*/
private static void moveLeftDiagonalUp( final Shell shell )
{
int x = shell.getBounds().x;
int y = shell.getBounds().y;
//X decreases and Y decreases
while( y > -200 )
{
try
{
shell.setLocation(x–, y);
shell.setLocation(x–, y–);
Thread.sleep(2);
}
catch (Exception e)
{
e.printStackTrace();
}
}
}

/**
* This method is used to move down the shell
* in the left side of monitor area. Here the key point is
* X coordinate decreases and Y coordinate
* increases slowly to bring the effect.
* @param shell of type {@link Shell}
* @author Debadatta Mishra(PIKU)
*/
private static void moveLeftDiagonalDown( final Shell shell )
{
int x = shell.getBounds().x;
int y = shell.getBounds().y;
//X decreases and Y increases
while( x > -200 )
{
try
{
shell.setLocation(x–, y);
shell.setLocation(x–, y++);
Thread.sleep(2);
}
catch (Exception e)
{
e.printStackTrace();
}
}
}

/**
* This method is used to move down the shell
* in the right side of monitor area. Here the key point is
* X coordinate increases and Y coordinate
* decreases slowly to bring the effect.
* @param shell of type {@link Shell}
* @author Debadatta Mishra(PIKU)
*/
private static void moveRightDiagonalDown( final Shell shell )
{
int x = shell.getBounds().x;
int y = shell.getBounds().y;
//X increases and Y decreases
while( y < 700 )
{
try
{
shell.setLocation(x++, y);
shell.setLocation(x++, y++);
Thread.sleep(2);
}
catch (Exception e)
{
e.printStackTrace();
}
}
}

/**
* This method is used to place the shell in
* the centre of the monitor area.
* @param shell of type {@link Shell}
* @author Debadatta Mishra(PIKU)
*/
private static void setShellLocation( Shell shell )
{
Rectangle monitorArea = shell.getDisplay().getPrimaryMonitor().getBounds();
Rectangle shellArea = shell.getBounds();
int x = monitorArea.x + (monitorArea.width – shellArea.width)/2;
int y = monitorArea.y + (monitorArea.height – shellArea.height)/2;
shell.setLocation(x,y);
}

//Method to execute class
public static void main(String[] args)
{
Display display = new Display();
final Shell shell = new Shell(display,SWT.TITLE);
shell.setLayout( new RowLayout());
shell.setSize(200, 200);

Button b = new Button(shell, SWT.PUSH);
b.setText(“Animate”);

b.addSelectionListener( new SelectionAdapter()
{
public void widgetSelected(SelectionEvent se)
{
/*
* Uncomment the following methods one by one
* to the animation effect of the shell.
*/
//Move up the shell
// moveUp(shell);
//Move down the shell
// moveDown(shell);
//Move up in the right diagonal up
// moveRightDiagonalUp(shell);
//Move left diagonal up
// moveLeftDiagonalUp(shell);
//Move left diagonal down
// moveLeftDiagonalDown(shell);
//Move right diagonal down
moveRightDiagonalDown(shell);
shell.dispose();
}
}
);
shell.open();
setShellLocation(shell);
while (!shell.isDisposed())
{
if (!display.readAndDispatch())
display.sleep();
}
display.dispose();
}
}

In the above program, I have written many methods for the movement of the Shell. A shell can have movement effect
from any corner of the monitor display. Here the location of the Shell is changed dynamically and it appears to the
user that shell is moving.

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