The Java platform provides support for creating a graphical user interface (GUI) for your desktop applications. Several layout managers help you specify the position and size of GUI components. You might already be familiar with some of the common layout managers, which include If you are a very skilled user interface (UI) developer who enjoys a challenge, you can write code manually to use a combination of layout managers to control precisely how components use their container space. Although the ability to lay out a GUI form by hand might win you the right to brag at the office, it is not always the best use of your time. In many situations, you can save time and effort by using a visual development environment to design and implement graphical forms. Unfortunately, many integrated development environments (IDEs) are little more than a thin wrapper around the various properties available from a layout manager. If you are a GUI guru who avoids that type of IDE, you'll be thrilled that NetBeans IDE 5.5 provides significantly more value. It is not just a tool that allows you to visually set the various properties of layout managers, although that certainly is possible. NetBeans IDE 5.5 has a feature called the NetBeans IDE GUI Builder. This GUI builder, introduced as "Matisse" as early as NetBeans IDE 5.0, provides you the power and freedom to spend more time designing your application UI instead of dealing with the low-level details of specific layout managers. Figure 1 shows a sample screen capture of NetBeans IDE 5.5. This and other images in this article show screen captures of the GUI builder interacting with a demonstration address panel.
Not only does NetBeans IDE GUI Builder simplify GUI creation by providing immediate visual updates to your GUI design, it also helps you create a better-looking GUI by solving some of the most important, difficult problems that UI designers face. Some of the benefits and features of using NetBeans IDE 5.5 with the NetBeans IDE GUI Builder include the following:
Free Design Mode
NetBeans IDE GUI Builder provides the Free Design mode of operation, which allows you to move UI components around a panel or frame without concern for the underlying layout manager. Layout managers are not gone. In fact, NetBeans IDE uses a new layout manager called
The Free Design concept is a combination of the new
In theory, NetBeans IDE 5.5 could use any combination of layout managers to position your components as you arrange them within the Design pane. In practice, however, it uses the
Platform Independence
Great UI designs work well regardless of the underlying platform. If you deliberately place form components with hard-coded position and size information, those UIs will not display correctly on all platforms. Each host platform -- whether Mac OS X, Open Solaris, or Microsoft Windows -- has its own suggested guidelines for position and placement of components. NetBeans IDE GUI Builder helps you create platform-independent UIs, with one layout definition that runs and looks good on all target platforms. If you follow the layout guidelines while placing components, your UI will look great in any platform. As you drag and drop UI components from the palette onto the visual design area, the GUI builder suggests alignment, position, anchors, and sizes that all adjust as necessary for specific platforms during runtime. The result is that you design your UI once, and it runs correctly everywhere. The GUI builder and The visual cues include dotted lines that suggest spacing and alignments. Because the layout manager determines preferred spacing and position hints at runtime, the exact gaps among components may change slightly when running on different hosts. Figure 4 shows an alignment hint for a postal code field in an address panel.
You can even create your own custom rules to control how the
Design Previews
As you design your UI, the GUI builder shows the form in the design area of the NetBeans IDE 5.5 window. This is an accurate but static representation of your UI form. You cannot interact with it as if it were actually running. Static and noninteractive views are fine while you are arranging components, but this view does not help you see how form components will grow or shrink as you resize the form, nor can you test the order of tabs. The NetBeans IDE 5.5 GUI Builder has a visual design preview feature that allows you to see how the form will display in your application. You can activate the design preview by clicking on the preview icon -- a small image of an eye -- above the Design pane. Figure 5 shows this icon.
When you click on the preview icon, the GUI builder will activate your form in Preview mode. Preview mode lets you type information into text fields, tab from field to field, and resize the form. The preview give you an indication of whether your component alignments and anchors are set the way you want them. Figure 6 shows a preview of a sample
Internationalization
Internationalization is the process of making your application localizable. A localized application uses the language and cultural expectations of its target locale to provide a more pleasant, usable UI. Although there are many requirements to correctly internationalize an application, you should avoid making at least the following mistakes in your UI design:
The NetBeans IDE GUI Builder can help you avoid these mistakes by helping you create one layout design that runs successfully everywhere, regardless of platform-specific rules about component position. The To make your Swing UI even better, you should internationalize it. That means you can translate strings, colors, and images for a specific locale without rebuilding the GUI. You have to avoid hard-coded strings and other localizable content by placing those items in
The internationalization wizard leads you through three easy steps:
Although you can use the wizard to extract localizable strings from a single source file, the wizard can save you a great deal of time when you use it on multiple files. You can choose one or more files in the wizard as shown in Figure 8.
After you have created a
The next step is to approve and edit the list of key-value pairs. A key is the name your application uses to find and use a localized resource. A value is the localized term, phrase, or other resource used in the application. Your code will use a key to load a localizable text value from the
Not only does the NetBeans IDE GUI Builder help you extract localizable text, it also helps you create translations. You can add translations by creating new
One unique feature of NetBeans IDE 5.5 is its localization editor. Once you have run the internationalization wizard, your localizable text will be in a
Custom Components
All GUI components show up in a dockable palette within NetBeans IDE. By default, the palette is on the right side of the NetBeans IDE UI, but you can move the palette around to suit your preferences. Using components is as simple as dragging and dropping them from the palette to your frame or panel. The palette comes preconfigured with all the core Swing and Abstract Window Toolkit (AWT) components. You can easily install your own custom components with the Palette Manager. You can package your components as a Java archive (JAR) file, as part of a larger library, or even as part of another NetBeans IDE project. You can even put components from your current project onto the palette for easy access. Once you have created a component, the class appears in your Project view window. You can right-click on the component's file and select the Tools > Add to Palette option. At that point, you can choose a category for your component and place it into the palette. Categories include
Generated Code
As you create your UI, NetBeans IDE GUI Builder generates layout code for you. The generated code is fenced, meaning that the IDE protects it from accidental, manual changes. The fenced code is well marked within the IDE, and most of the code is contained within an
You can write additional code outside the protected areas when you want to provide additional event handlers or customized initialization. Additionally, you can use the GUI builder to add pre- and post-creation and pre- and post-initialization code to any GUI component. The GUI builder will add your customized code to the Figure 15 shows the property sheet with entries for pre- and post-creation and pre- and post-initialization code that you can specify for any of your UI components. After selecting these properties, you can type your own code into the editor.
Integration With the Java SE 6 Platform
The Free Design layout has been available since NetBeans IDE 5.0. NetBeans IDE 5.0's GUI Builder provided support for this layout strategy by using a separate library called the Swing Layout Extensions. The IDE provided that library because the support for the underlying You can use NetBeans IDE 5.5 to develop applications and UIs for Java SE 6 or earlier Java platform versions. If you write applications for any platform version prior to Java SE 6, you must continue to use the Swing Layout Extensions. However, the new GUI builder can also generate your UI using the layout manager functionality supported in the Java SE 6 platform. In the latter case, you do not need to use or include the layout extensions in your final product. If you create a new project in NetBeans IDE 5.5 and your target platform is Java SE 6, the GUI builder will automatically generate your UI using the Java SE 6 platform's core libraries. However, if you import an old project into NetBeans IDE 5.5, you should manually update the project's layout to use the new Java SE 6 platform libraries. Of course, you can still use the layout extensions if you like, but doing so is not necessary with the Java SE 6 platform. You can change the
Summary
NetBeans IDE GUI Builder helps you create professional-looking UIs. It does this by guiding your choices for component placement and size using the Free Design layout mode. This mode lets you drag and drop GUI components onto a panel or frame. Although you can place components wherever you want, NetBeans IDE GUI Builder provides position hints that make your design look right regardless of the host platform. If you use the Free Design concept, the NetBeans IDE GUI Builder will implement your UI design using NetBeans IDE GUI Builder also helps you create internationalized applications that are easy to localize. Internationalization wizards will help you extract localizable text to create locale-specific resource files. To improve productivity and simplify how you use your own or third-party GUI components, NetBeans IDE lets you add those components to the component palette. To use a new graphical component, you just drag and drop it from the palette onto your form or panel. Finally, the NetBeans IDE 5.5 GUI Builder works well with the Java SE 6 platform. The GUI builder can produce layout implementations that use the new |
Create Great-Looking GUIs With NetBeans IDE 5.5
最新推荐文章于 2020-12-16 14:08:12 发布
Create Great-Looking GUIs With NetBeans IDE 5.5