Brand your Eclipse RCP applications
How to understand and use Eclipse Production Configuration ![]() |
![]() |
![]() |
Level: Intermediate Xing Xing Li (lixx@cn.ibm.com), Software Engineer, IBM 08 May 2007 This article provides step-by-step guidelines on how to package and manage a Rich Client Platform (RCP) application as a product with your own branding by using Eclipse's Production Configuration and PDE. Besides common concepts such as splash screen and an icon file's color and size, this article also introduces advanced branding aspects of production configuration: the RCP executable file and its configuration file, progress bar and message, RCP window image, About dialog and welcome page (i.e., introduction). With this article, you can grasp the main skills on encapsulating your RCP application as a distributable product, independent of Eclipse platform. Before Production Configuration was introduced in Eclipse V3.1, RCP developers confronted the problem of how to effectively and efficiently package, and deliver their RCP projects with the required plug-ins. This problem, in fact, is a consumption issue because it essentially determines the distribution and usability of their software. Thanks to Eclipse V3.1's new Production Configuration feature, you can now wrap their applications with dependencies and branding elements easily. This article details how to leverage Eclipse Product Configuration with a sample RCP application: a game called Frog Across River. To get the most out of this article, you need an Eclipse development environment and the sample code. If you don't have Eclipse already, download the following:
Prerequisite: An RCP application The prerequisite of Eclipse Product Configuration is an existing RCP application. You will need it as the bootstrap entry of your product. In this section, you will develop a game of Frog Across River as an RCP application using the following instructions. This RCP application is a plug-in project that will extend the First, we generate a plug-in project following these steps. Launch Eclipse, shift to the plug-in development perspective by selecting Window > Open Perspective > Other... > Plug-in Development.
Import the RCP game source code Copy all Java source files (.java files) from
This RCP project will create the Frog Across River game in a GUI view that enables mouse and keyboard input on the menu bar and canvas. Its design architecture is shown in Figure 1. Figure 1. Class diagram of RCP application ![]() Among them, Listing 1. Application.java
Listing 2. ApplicationActionBarAdvisor.java
Double-buffer technology is applied to avert screen flicker and flash during animation. Why? When you instruct JVM to display an animation, JVM will clear the screen, show the window, paint the screen, and show it again. That degrades your application's appearance. Double-buffering boosts performance by painting an off-screen image, then dumping it to the display. Listing 3. GameView.java
Copy the code list below into Listing 4. plugin.xml
Launch the RCP game in Eclipse To execute the RCP game application in Eclipse, switch to the Overview tab of Figure 2. Execution of the sample RCP application ![]()
Create your product configuration You will create a Product Configuration file ( To generate a Product Configuration file, select File > New > Other > Plug-in Development > Product Configuration, then click Next. When the Product Configuration wizard page appears, select Figure 3. Wizard to create new Product Configuration ![]()
In this section, we introduce how to define and customize the product published with your RCP application after you create your .product file. You need to import some files and folders into your plug-in project from Figure 4. Imported resources ![]() The following table provides the description of these resources. Table 1. Resource description
First, click the Overview tab (see Figure 5). You will set up the Product Definition here. The product definition consists of Product Name, Product ID, and an Application associate with the Product ID. What's more, it is specified whether the product configuration unit is based on plug-in or feature. Figure 5. Overview tab ![]() Product Name defines the name of the product, which will be shown in the title bar. Input You can see the product name in the title bar when you launch the product, as shown below. Figure 6. Product name in title bar of my product ![]() Click the Configuration tab. You will define the elements in you product and the configuration file. The "Plug-ins and Fragments section" lists all plug-ins and fragments that will be packaged in your product. Figure 7. Configuration tab ![]() Click Add... to the right of the Plug-ins and Fragments list, then select the com.example.zyx plug-in, and click OK. Click the Add Required Plug-ins button, then all required plug-ins and fragments are added. The "Configuration File" section is used to set up the product runtime information. This file must be named config.ini. You can accept its default setting, which will generate a default config.ini file in configuration folder when the product is exported. The following gives a sample of the file's content. Listing 5. Content of config.ini
The first line determines the location of splash screen, which will be displayed when product launches. The second line defines the product name. In the last two lines, Click the Launcher tab, where you will set the Program Launcher and Launching Arguments. Figure 8. Launcher tab ![]() Program Launcher is used to specify launcher name and launcher icons, in the form of an .exe file for Windows® to launch your product after you have exported it. Input FrogAcrossRiver in the Launcher Name text field. Click the radio button Use a single ICO file containing 7 images as specified above, then click Browse... and navigate to select the 7Images.ico file in the icons folder. You can generate and use your own icon file or just leverage BMP images by clicking Specify separate BMP images. An .ico file is a container that includes required image files with different size and color modes for its host application. Windows selects the image it needs to use, based on the user's display settings. If the icon does not contain the appropriate size or color mode, Windows will take the closest size and resolution, and render the icon to suit. Table 2. Icon properties
Launching arguments provides the product with the default program arguments and VM arguments. In its way, an .ini file with the same name as the launcher mame will be generated in the root of the exported folder to record these arguments. Input -console in the Program Arguments text field, which will open a console window when your product is launched. After you export the product, go to the exported folder, you can find the .exe and .ini files as shown below. Figure 9. Executable file and config file ![]() A splash screen will appear when the product launches. This file must be located in the root folder and be named splash.bmp. Otherwise, the product will not find it at runtime. Figure 10. Splash screen configuration in Branding tab ![]() Click Browse... on the right of Plug-in test field and select the plug-in project where the splash file resides. Progress bar and Progress message are used to indicate the process status on the splash screen. Add the following value into the plugin_customization.ini file.
Next, add the following property to the product extension section of the plugin.xml file.
Then select Add a progress bar. Input Figure 11. Progress bar and progress message at the product's start up ![]() Images for your application window are configured in this section (see Figure 12). These images must be in GIF format. An image with a size of 16x16 appears in the upper-left corner of the window and task bar. A 32x32 image appears in the Alt+Tab application switcher. Figure 12. Window image configuration in Branding tab ![]() With the Browse... button, define the 16x16 and 32x32 images you want from your project's icon folder. Then go to the plugin.xml file to verify your configuration with following declaration:
After you launch the product, you will see the images is displayed in Figure 13. Figure 13. 32x32 image in Alt+Tab application switcher ![]() The About dialog consists of the about image rendered on the left and the about text briefly introducing your product. You will manage these two items in this section. Figure 14. About dialog configuration in Branding tab ![]() Click Browse... to the right of Image text field and select a GIF file from the icon folder. There are two ways to define the about text. One is to directly input the text in the Text field; the other is to define a key and value pair in the plugin.properties file and refer to the key in the Text field. As you will leverage the second one, just input Listing 6. plugin.properties
You need to add an action so that the menu item for the About dialog will appear in the menu bar of your product, such as Help > About. Open the ApplicationActionBarAdvisor.java file and remove the comment tags to activate the following code. Listing 7. ApplicationActionBarAdvisor.java
After you launch your product and select Help > About, the About dialog will appear. Figure 15. About dialog sample ![]() A welcome page is used to introduce the product information, which is especially helpful for new users. You can depict all features, usage, and tips of your product via the welcome page. Figure 16. Welcome page configuration in Branding tab ![]() To enable a welcome page in your product, you will extend two extensions: Listing 8. Intro configuration in plugin.xml
Next, add an action in menu bar by selecting Help > Welcome. Open the Listing 9. ApplicationActionBarAdvisor.java
You will see the following welcome page when you launch your product. Figure 17. Welcome page sample ![]()
Go back to the Overview tab and find the Testing section. When you have changed the product name, window images, about image and about text, etc., click Synchronize link to reflect your changes to plugin.xml to ensure that the plug-in manifest is up to date. Click Launch the product to test your product before it's exported. There is an example of how the Synchronize link works. Change the product name from Go to the find Exporting section of the Overview tab, where there is a link to export your product. Click the Eclipse Product export wizard. In the export dialog that pops up, specify MyProduct as the Root directory and C:\export as the destination directory. After clicking Finish, verify the export result by navigating to the C:\export\MyProduct directory. You will find the FrogAcrossRiver.exe and FrogAcrossRiver.ini files in which your launching arguments are recorded. You will also verify that the icon of the FrogAcrossRiver.exe file is what you desire. Figure 18. Exported RCP product in file system ![]() If you have installed JRE, double-click the Congratulations! You configured and published your RCP application as a product successfully. This tip can help you publish your product on a non-JRE OS: Just find a platform with JRE installed, copy its JRE directory into the root folder of your exported product, as shown below. Figure 19. JRE added to exported RCP product ![]() Double-click FrogAcrossRiver.exe and it launches your RCP product successfully.
This article has shown how to create and pack your branded Eclipse product by leveraging Eclipse's Product Configuration and PDE. Although you can do this using a script, we have demonstrated a more effective and efficient way to produce the product where you can configure and manage all branding information and elements. Most importantly, this article has shown the possibilities of an RCP world with the aid of the Eclipse Production Configuration feature.
Learn
Get products and technologies
Discuss
|