In the following paragraphs, we will show you how to create your first JVx application with minimal effort and code.

The application's task is to display data from a database table and make the data editable.

Before you start you will need the following libraries and tools:

• JVx Binary package
• Eclipse IDE (>= 3.4) with JDT (recommended: Eclipse IDE for Java EE developers)
• JDK 5.0 (1.5) or higher
• HSQLDB library (http://www.hsqldb.org)
• JVx sample Eclipse projekt

For our JVx sample application we need the following parts:

• Application
• Work screen
• Business object
• Database connection

Create an application

We need an application as a frame for the client. Each application must implement the interface javax.rad.application.IApplication. In our example, we derive from the standard implementation com.sibvisions.rad.application.Application, whereby we use the following code:

package apps.firstapp;

import javax.rad.application.genui.UILauncher;
import javax.rad.genui.UIImage;
import javax.rad.genui.component.UIButton;
import javax.rad.genui.container.UIToolBar;
import javax.rad.genui.menu.UIMenu;
import javax.rad.genui.menu.UIMenuItem;
import javax.rad.remote.IConnection;

import com.sibvisions.rad.application.Application;
import com.sibvisions.rad.server.DirectServerConnection;

/**
 * First application with JVx, Enterprise Application Framework.
 * <p/>
 * @author René Jahn
 */
public class FirstApplication extends Application
{
  //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  // Initialization
  //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  /**
   * Creates a new instance of <code>FirstApplication</code> with a technology
   * dependent launcher.
   * <p/>
   * @param pLauncher the technology dependent launcher
   */
  public FirstApplication(UILauncher pLauncher)
  {
    super(pLauncher);
  }
  
  //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  // Overwritten methods
  //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  /**
   * {@inheritDoc}
   */
  @Override
  protected IConnection createConnection() throws Exception
  {
    return new DirectServerConnection();
  }

  /**
   * {@inheritDoc}
   */
  @Override
  protected String getApplicationName()
  {
    return "firstapp";
  }
  
  /**
  * {@inheritDoc}
  */
  @Override
  protected void afterLogin()
  {
    super.afterLogin();
  
    //configure MenuBar
  
    UIMenu menuMasterData = new UIMenu();
    menuMasterData.setText("Master data");
  
    UIMenuItem miDBEdit = createMenuItem
                          ("doOpenDBEdit", null, "DB Edit", 
                           UIImage.getImage(UIImage.SEARCH_LARGE));

    menuMasterData.add(miDBEdit);

    //insert before Help
    getMenuBar().add(menuMasterData, 1);
  
    //configure ToolBar

    UIToolBar tbMasterData = new UIToolBar();
  
    UIButton butDBEdit = createToolBarButton
                         ("doOpenFrame", null, "DB Edit", 
                          UIImage.getImage(UIImage.SEARCH_LARGE));
  
    tbMasterData.add(butDBEdit);
  
    getLauncher().addToolBar(tbMasterData);
  }

  //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  // Actions
  //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  
  /**
   * Opens the edit screen.
   * <p/>
   * @throws Throwable if the edit frame can not be opened
   */
  public void doOpenDBEdit() throws Throwable
  {
    DBEditFrame frame = new DBEditFrame(this);
 
    configureFrame(frame);
 
    frame.setVisible(true);
  }

}  // FirstApplication

Create a work screen

Once we have created the application framework, we now reate our first work screen with the following code:

package apps.firstapp.frames;

import javax.rad.genui.container.UIGroupPanel;
import javax.rad.genui.container.UIInternalFrame;
import javax.rad.genui.control.UITable;
import javax.rad.genui.layout.UIBorderLayout;
import javax.rad.remote.AbstractConnection;
import javax.rad.remote.MasterConnection;

import com.sibvisions.rad.application.Application;
import com.sibvisions.rad.model.remote.RemoteDataBook;
import com.sibvisions.rad.model.remote.RemoteDataSource;

/**
 * A simple database table editor.
 * <p/>
 * @author René Jahn
 */
public class DBEditFrame extends UIInternalFrame
{
  //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  // Class members
  //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  /** the application. */
  private Application application;
  
  /** the communication connection to the server. */
  private AbstractConnection connection;
  
  /** the DataSource for fetching table data. */
  private RemoteDataSource dataSource = new RemoteDataSource();
  
  /** the contacts tabl. */
  private RemoteDataBook rdbContacts = new RemoteDataBook();
  
  //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  // Initialization
  //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  
  /**
   * Creates a new instance of DBEditFrame for a specific application.
 * <p/>
 * @param pApp the application
 * @throws Throwable if the remote access fails
 */
 public DBEditFrame(Application pApp) throws Throwable
 {
 super(pApp.getDesktopPane());
 
 application = pApp;
 
 initializeModel();
 initializeUI();
 }
 
 /**
 * Initializes the model.
 * <p/>
 * @throws Throwable if the initialization throws an error
 */
 private void initializeModel() throws Throwable
 {
 //we use a new "session" for the screen
 connection = ((MasterConnection)application.getConnection()).
 createSubConnection("apps.firstapp.frames.DBEdit");
 connection.open();

 //data connection
 dataSource.setConnection(connection);
 dataSource.open();
 
 //table
 rdbContacts.setDataSource(dataSource);
 rdbContacts.setName("contacts");
 rdbContacts.open();
 }
 
 /**
 * Initializes the UI.
 * <p/>
 * @throws Exception if the initialization throws an error
 */
 private void initializeUI() throws Exception
 {
 UIGroupPanel group = new UIGroupPanel();
 group.setText("Available Contacts");
 
 UITable table = new UITable();
 table.setDataBook(rdbContacts);
 
 group.setLayout(new UIBorderLayout());
 group.add(table);
 
 //same behaviour as centered component in BorderLayout 
 setLayout(new UIBorderLayout());
 add(group); 

 setTitle("Contacts");
 setSize(new UIDimension(400, 500));
 } 

} // DBEditFrame

Create a business object

Once we have created the client, we need the corresponding business object on the server, so as to define the source of the data more precisely. To do so, we use the following code:

package apps.firstapp.frames;

import javax.rad.persist.IStorage;

import com.sibvisions.rad.persist.jdbc.DBStorage;

import apps.firstapp.Session;

/**
 * The LCO for the DBEdit WorkScreen.
 * <p/>
 * @author René Jahn
 */
public class DBEdit extends Session
{
  //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  // User-defined methods
  //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

  /**
   * Returns the contacts storage.
   * 
   * @return the contacts storage
   * @throws Exception if the initialization throws an error
   */
  public IStorage getContacts() throws Exception
  {
    DBStorage dbsContacts = (DBStorage)get("contacts");
  
    if (dbsContacts == null)
    {
      dbsContacts = new DBStorage();
      dbsContacts.setDBAccess(getDBAccess());
      dbsContacts.setFromClause("CONTACTS");
      dbsContacts.setWritebackTable("CONTACTS");
      dbsContacts.open();
   
      put("contacts", dbsContacts);
    }
  
    return dbsContacts;
  }
  
}  // DBEdit

Create a database connection

In the business object, we referred to the data source with the method getDBAccess(). In our case we use a HyperSQL database. We define the database connection in the following class:

package apps.firstapp;

import com.sibvisions.rad.persist.jdbc.DBAccess;
import com.sibvisions.rad.persist.jdbc.IDBAccess

/**
 * The LCO for the session.
 * <p/>
 * @author René Jahn
 */
public class Session extends Application
{
  //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  // User-defined methods
  //~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
  
  /**
   * Returns access to the database.
   * 
   * @return the database access
   * @throws Exception if a connection error occurs
   */
  public IDBAccess getDBAccess() throws Exception
  {
    DBAccess dba = (DBAccess)get("dBAccess");
  
    if (dba == null)
    {
      dba = new HSQLDBAccess();
   
      dba.setUrl("jdbc:hsqldb:hsql://localhost/firstappdb"); 
      dba.setUsername("sa");
      dba.setPassword("");
      dba.open();
     
      put("dBAccess", dba);
    }
  
    return dba;
  }  

}  // Session

The application is now fully implemented and ready to run. To be able to work with the application we need the database including the CONTACTS table which we want to access. It has already been created in the Eclipse project and can be started with ../JVxFirstApp/db/startHSqlDB.bat.

The first JVx application

Once the database has been started, the application can be started via the Run menu in Eclipse. The finished application should now look as follows:

You can find more details about the components of a JVx application as well as step by step instructions to Eclipse under Step by step introductions to the JVx application.