This brief tutorial is designed to introduce the basics of building an IDE extension. In it, you'll learn a bit about the pieces of an IDE extension, including the extension.xml file and Java classes that make up a frame view extension. You'll also learn how to set up a Java project for building and debugging extensions.
The extension you build with this tutorial is very simple, so it's not surprising that a proportionately large amount of the tutorial is about getting set up -- creating the project, setting debugging properties, and so on. Needless to say, these are things that will come fairly easily after the first time around.
The tasks in this step are:
BEA_HOME\weblogic81\samples\workshop\ExtensionDevKit\IdeDevKit\IdeDevKit.work
WebLogic Workshop will display the FrameViewHello project in the IdeDevKit application. Now you will create folders for source files.
Next you'll tell the IDE to use this folder for Java sources. By default, the source path is set to the project's root. But if you leave it that way, you'll be unable to use the IDE to create a META-INF folder in the project to hold your extension.xml file ("META-INF" is illegal as a package name). You'll also add wlw-ide.jar to your classpath. It contains the classes and interfaces that make up the extension API. You're going to need those.
BEA_HOME\weblogic81\workshop\wlw-ide.jar
BEA_HOME\weblogic81\samples\workshop\ExtensionDevKit\IdeDevKit\FrameViewHello\src
Next you will create a META-INF folder for your extension.xml file.
When debugging an IDE extension, you set up your build properties so that the extension build output is copied the WebLogic Workshop extensions folder. You set debugging properties so that a new instance of the IDE starts. This new instance examines the contents of the extensions folder, finds your extension JAR, and loads it with other extensions. This works iteratively so that each new build generates a new extension JAR which is read by the newly started IDE instance. Breakpoints you've set in the original instance are of course honored as you try out your extension in the second.
To set this up, you need to create a build.xml file in your extension project. You also need to set debugging properties so that a new instance of the IDE is started. First you'll set those debugging properties.
Next, you'll create a build.xml file.
<zip destfile="${platformhome.local.directory}/workshop/extensions/${output.filename}" basedir="${dest.path}" includes="**/*.*" encoding="UTF8"> <!-- jar filenames are UTF8-encoded --> <zipfileset dir="${project.local.directory}" excludes="build.xml,**/CVS/**,**/*.java,${output.filename}" includes="**/*.*"/> </zip>
This zip task zips your extension output and copies it to the WORKSHOP_HOME/extensions folder, where WebLogic Workshop can find it when the IDE starts.
Now you're set up to build and debug an extension project. Next you'll create the source files that make up your extension.
To Create an extension.xml File
An extension.xml file connects your extension code with the IDE. You'll create an extension.xml file to tell the IDE a few simple things about your frame view, such as how the view should be listed on a menu command. But your extension.xml will also point the IDE to the Java code that it should execute for your extension's logic and user interface. You'll write that code in a moment.
<extension-definition> <extension-xml id="urn:com-bea-ide:frame"> <frame-view-set> <frame-view id="sayhello" class="myframeview.HelloWorldFrame" label="Say Hello" /> </frame-view-set> <application-layout id="main"> <frame-layout id="main"> <frame-container orientation="east" proportion="20%"> <frame-container orientation="tabbed"> <frame-view-ref class="myframeview.HelloWorldFrame" /> </frame-container> </frame-container> </frame-layout> </application-layout> </extension-xml> </extension-definition
The <extension-definition> element is always the root of an extension.xml file. A file can define many extensions, each specified by a separate <extension-xml> stanza. Here, the definition contains two main chunks of information. The <frame-view-set> stanza simply tells the IDE that this frame view exists, what's its menu and tab label should be, what class to use, and so on. The <application-layout> stanza tells the IDE where to display the frame view on startup. Of course, if you (or your extension's user) has been using the IDE, then preferences for the position of frames has already been stored locally. In that case, this frame will need to be selected from the View menu.
Now it's time to write the Java code.
To Write the Extension's Java Code
Your extension's user interface and logic are defined in Java classes. In the extension.xml snippet you created, you specified the class myframeview.HelloWorldFrame, so that's the class you're going to create here.
A frame view class implements the IFrameView interface, which provides a method the IDE can use to get your frame UI. It also provides a method the IDE can use to ask whether your frame should be available for display. Start by creating a new package folder and Java class.
package myframeview; import com.bea.ide.ui.frame.IFrameView; import com.bea.ide.util.swing.DialogUtil; import java.awt.Component; import javax.swing.JPanel; public class HelloWorldFrame extends JPanel implements IFrameView { private javax.swing.JButton btnSayHello; /** * Construct this frame by calling the method that assembles its UI. */ public HelloWorldFrame() { initComponents(); } /** * The IDE calls this to get the UI. */ public Component getView(String id) { return this; } /** * The IDE calls this to find out if it should make this * frame's UI available for display. */ public boolean isAvailable() { return true; } // Put together the user interface. private void initComponents() { // A simple button whose label is "Say Hello" btnSayHello = new javax.swing.JButton(); btnSayHello.setText("Say Hello"); // Connect event handling by adding an action listener. btnSayHello.addActionListener(new java.awt.event.ActionListener() { // If something happens, show a dialog with a friendly message. public void actionPerformed(java.awt.event.ActionEvent event) { DialogUtil.showInfoDialog(null, "Hello World!"); } }); // Add the new button to this panel. add(btnSayHello); } }
That's it. Now to try it out. If you got set up for debugging as described earlier in this topic, you should be able to click the Start button to run the project. When the new IDE instance has started, if the Say Hello frame isn't visible, you can select it from the View -> Windows menu. Click the Say Hello button, and you should see the friendly dialog. With the frame docked, it might look something like this:
When you've tried out the extension, close the second IDE instance (you can also switch to the first instance and click the Stop button). If you want to try out debugging, set a breakpoint at the first line of the initComponents method, then run the extension again.
The extension you built with this tutorial is one of several types you can build — and it's one of the simplest. In addition, the extension API includes support for a great deal of functionality that can be used within multiple extension types.
For more information on setting up for building and debugging an extension, see Debugging Extensions. For more on frame view extensions, see Adding Dockable Frames.