Thursday Nov 02, 2006

Using JDK 5 language features in Creator

As you're probably well aware of, there were several important releases this week. First, NetBeans 5.5 was released. This has been covered extensively by other Sun bloggers so I won't repeat the highlights here - just check it out if you haven't already.

Second, a number of add-on packs for NetBeans 5.5 were released. A pack is a cluster of plugins. One of these is the Visual Web Pack, which basically bundles all the visual web page design functionality from Creator into NetBeans. With this, you can create pages Creator style alongside other NetBeans features, such as the profiler, or the UML tool, or the enterprise XML support.

There's another big reason why even Creator users should try the visual web pack (which is in technology preview state, not a final release like NetBeans 5.5.). It offers new support for Java 5 language features, as well as Java EE 5 support. I took it for a quick testspin and thought I would show it in action here.

If you download NetBeans 5.5, and then the Visual Web Pack installer, you can create Visual Web Projects. Unfortunately, out of the box, it will only offer to create J2EE 3 and J2EE 4 projects. The reason for this is that NetBeans is only bundled with the Tomcat web container, and Tomcat is not adequate for Java EE 5 projects. Thus, the trick is to also download a Java EE 5 capable app server such as Glassfish or its cousin, the Sun Application Server. Once you've done that, and you select it as the target in the new project dialog, you are able to create a Java EE 5 project. Hopefully we'll have everything ready as a single bundle so that out of the box, you're defaulting to Java EE 5 projects and Java 5 source. Here's the configuration portion of the New Project wizard (click Manage to register additional web servers).

Let's create a simple web app which utilizes Java 5 features. It will be a simple page which lets you provide the name of a Java class, and then the methods (possibly generic) of the class are displayed. Here's what the web app looks like in the designer:

Here's the button click event handler:

Note that we simply use the error method to log messages for the page; these are all displayed in the group message component. This is a very simple way to log messages for ourself during debugging. You should always have a Message Group component, on every single page of your application, during development. This will make it immediately obvious if you have validation errors or other problems that might otherwise silently occur and leave you scratching your head.

When we run and try it with some sample data, here's the result which shows Java 5 language features in action:

The next step is to play with Java EE 5 features mixed with JSF. That will have to wait for another day; I've gotta get back to my day job, which I'll blog about soon.

Friday Aug 25, 2006

Creator On Speed, Serious Speed

Hotfix 2 has been released for Creator. The focus of this patch release has been performance, and there are some significant gains. Here's one testimonial from the Creator forum after the bits were released this morning:

This is awesome. I have experienced orders of magnitude improvement in performance - specially building and deploying the apps. It used to take 3 mins., now it takes less than 10 secs.
The main performance fixes were in the source modeller, so project open and editing is where the speedups are to be found. Sakhti Gopal in Creator QA has done a lot of analysis of the performance improvements and provides further details on the improvements. Opening pages, switching from source to design view etc. is at least twice as fast, and in many cases several times faster.

The Tutorial Divas on the Creator team also provide coverage; they've measured various tasks on a moderate project, and as you can see the performance improvements are dramatic. They are using percentages rather than speedup factors. What is a 97% improvement? Some people think of "100%" improvement as doubling something (or when appropriate, halving something). But here it means that it was reduced by 97% of the original amount; thus it is the same as a 32x speedup!! Adding a table to the first page for example used to take 16 seconds, it now takes 4 seconds - a 4x speedup.

If you've been using Creator 2 and have been dissatisfied with the performance (you were not alone), hopefully this will make you much happier. If the earlier performance turned you off from Creator 2, give it another chance. This is not the end of the performance work for Creator; a larger rearchitecting of the Java source model in our tools is being performed as a foundataion for NetBeans 6.0 (to also accomodate a lot of new cool Java source editing features). In the next Creator generation, this will allow Creator to be a lot more efficient both in CPU and memory usage. Today, Creator does not use NetBeans' source model; it has its own, which means there are two source models that need to be kept in sync. What Hotfix 2 did was ensure that this syncs are only done when necessary. And what a difference it makes!

How do you get it? Use the Update Center in Creator. If you don't have direct internet access from your Creator installation, you should be able to download the update by following links from the Creator site.

Wednesday Aug 23, 2006

Writing internationalized web applications with Creator

This is just quick a pointer to a great blog entry I came across written by Gregory Murphy (from the Creator team) which tells you how to work with resource bundles in Creator. Until now, writing a web application with proper resource bundle lookups has meant giving up some WYSIWYG aspects, because the <f:loadBundle> tag is not interpreted at designtime. But with Gregory's solution, we finally have a simple way to get designtime display of the localized text.

Thursday Mar 16, 2006

Creator Hotfix 3: Improved nested positioning

A new hotfix for Creator 2 is available today. One of the fixes it contains is handling of absolute positioning inside tab panels. With this fix, you can now properly lay out your tab set panels in absolute mode, and these positions are all computed and maintained relative to the tab set position. Thus, you can move the tabset and all components properly move along.

The following screenshot shows how this works. The designer is in a special debug mode (which you can enable from the designer DOM inspector) which shows lines and pixel distances for components relative to their viewports. Note that unlike the interactive display in Matisse, the display is always showing the final computed left and top distances, even for components contrained to the bottom or right parent edges.

(Click for full size)

Monday Mar 13, 2006

Applets in your webapps

A question that has come up a number of times is how to use Applets in Creator web apps. Since we don't ship an Applet component (which renders an applet tag) out of the box, what can you do? Obviously, you can switch to the JSP view and manually enter an <applet> tag. But what if you need to provide dynamically computed parameters to the applet?

There's an extremely powerful technique you can use that I've written it up before, but it's useful enough that it bears repeating. And perhaps it helps to apply it to our specific scenario -- applets.

Briefly stated, the technique is to use the Output Text component to emit arbitrary HTML into the page. The Output Text can be value bound to a property in your page bean (in other words, you get a write a Java method that returns a String which is output by the output text), and you can turn off the Escape property on the Output Text to get the HTML to pass straight through, thus letting you emit HTML instead of just normal text.

First try this: Drop an output text. Find its Escape property and turn it off. Then go edit the Text property and set it to <applet />. Hit Return. Voila! You should see the Output Text immediately replaced by a large box (300 by 150 pixels, the same as the default applet size in Mozilla) as well as a Java icon. This is how the designer shows the applet tag at designtime. It does not execute applets at designtime.

Then go and put an actual applet .class file in your web directory, and set the code= property to point to the applet, e.g. code="ArcTest.class" and width="200" and height="200", where ArcTest is the sample applet found on

If you now run, you'll see the applet successfully deployed and running. Here's a side-by-side view:

Now you just need to make the code dynamic instead. The code modeller won't always be able to evaluate the string at designtime, so you may not get the applet rendering you see above. In any case, go and change the Text property to something like #{} instead (where Page1 is the page you're editing). Switch to the Java file, and add something like this:

    public String getFoo() {
        return "<applet code=\\"ArcTest.class\\" width=\\"300\\" height=\\"300\\"/>";

P.S. You actually should put text inside the applet tag telling the user that they need to go and download the JRE for their browser. For more details on the applet tag, see for example this resource. Remember that your HTML needs to be XHTML -- lowercased and well formed.

Friday Mar 03, 2006

Hidden Creator Feature #5: Power Inline Editing

Creator 2 supports inline editing of lots of components. This includes "non-textual" components like buttons, text fields and text areas. There are a couple of secret flags you can set to change the behavior of inline editing.

Inline editing is normally disabled for components that have are bound to value binding expressions (e.g. the value contains #{...}). Normally, at designtime, these components display "dummy data" - 123 for numeric expressions and abc for textual expressions. We can of course let you enter inline editing (by pressing F2 when the component is selected, or simply clicking on it when it's already selected, or using the context menu "Edit propertyname"). But there was a concern that people, especially novice users, would inadvertently edit their value binding expressions and get in trouble. So, it's normally disallowed. But if you run Creator with

(or add this to your creator.conf file), you can edit value binding expressions to your heart's content. When you enter inline editing mode, the value binding expression is shown in the designer page, and as soon as you commit, the normal dummy data is displayed again.

Inline editing also works on some components that aren't textual in the normal HTML sense - such as buttons, textfields and text areas. By default, Creator will allow inline editing of button labels by showing a textfield in place of the button when you are inline editing it. Early on I implemented inline editing of buttons with a textfield below the edited component instead. For buttons, this is still a decent behavior I think - especially when you initially drop a button, since it's a bit disconcerting to drop a button and see a text field... If you prefer that behavior, you can have it that way by running with this flag:


Here's how this looks when you run with both flags and try to edit a value-bound button. Notice how the inline edited expression is a value binding expression, and notice how it's displayed in a textfield below the actual button:

(Text Fields and Text Areas are still inline edited in place. And note that to commit input in a text area, you press Shift+Enter since just Enter inserts a newline.)

Tuesday Feb 07, 2006

Web Page Image Blending

I recently saw a Creator application somebody had made. It used a lot of background images, with text right on top of the backgrounds. It looked nice, but it was hard to read the text. I suggested the user insert translucent masks between the text and the background. Then I realized that might make a good blog entry, since there are lots of little tricks to know about. So here goes.

Let's say you have a page which looks a little like this (click for full size):

screenshot - click to see full size

Notice how there is a text component at the bottom, for "Previous" and "Next" links. It's blending a bit with the background and is hard to read. What we want is to place a semi translucent rectangle behind this text, such that the background is still visible, but at the same time increasing the contrast between the white text and the photograph. Let's do that, by inserting a Graphic Image component that is simply a translucent gray block:

screenshot - click to see full size

Much better, right? (Yes, I inserted two more blocks showing 30% transluceny and 50% translucency, for comparison).

Doing this is pretty easy. The first thing you'll need is a translucent image. Here's a couple:

50% translucency 30% translucency
Just right click on one and choose save as. Don't forget that you can drag it right to the designer. If you don't want to use one of these images, you can generate your own translucent image. It has to be in the PNG format, since GIF does not support translucency, only 100% transparency (e.g. opacity is either 0 or 1, not anything in between). You can use the web site to generate a suitable image, choosing your own color, size and transparency values.

Next, you'll need to ensure that the translucent image is the right size. It should be positioned right behind the text, and be slightly larger (e.g. such that it's a "bounding box"). These tips might help you:

  • You probably want to temporarily disable the snap to grid feature when dragging, such that you can place the rectangle top left corner precisely outside of the text top left corner. To do that, hold the Shift key while dragging and until you've released the mouse button. With the shift key pressed all dragging is per-pixel rather than per-grid-cell.
  • When you resize the image, don't drag the corner handles! Corner handles will ensure that all image aspect ratios are preserved. However, in this case we simply want to tile/stretch the translucent image to our exact right size. Therefore you should use the resize handles in the middle of the horizontal or vertical edges, not the corner edges.

Next, you'll need to ensure that the translucent image is behind the text. You can do that by setting the z order CSS property on the image and on the text component. But a much easier way to do it is to simply ensure that the image component appears earlier in the markup than the text. Do that by simply looking in the application outline, and dragging the image component up such that it preceeds the text component. When you do that you should immediately see the translucent image dimming the background image, but not your text.

Finally, for completeness, perhaps I should mention how you use background images in your pages. First, add the desired image to your web app (remember you can drag it on the designer - if you do, just delete the resulting graphic image component, and the image file itself will still be in your resources folder). Then open your stylesheet.css and add this rule:

body {
   background-image: url(wallpaper1.png);

This should look fine in the browser too - here's how Safari renders it:

screenshot - click to see full size

Note however that you may not be as lucky with Internet Explorer! IE7 is reported to have great support for transparent PNGs. But earlier versions of IE were notoriously bad. There are however workarounds, and I -believe- our image component implements this workaround, by detecting when it's talking to IE and emitting various gross CSS (such as "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=...."). It would be nice to get confirmation from somebody whether this works since I don't have IE on this operating system. But I'm pretty sure it does, and this is why you want to use components - somebody else has debugged the various necessary browser workarounds, and browser specific markup is generated based on which client the server is talking to!

Thursday Feb 02, 2006

Tools Strategy Revealed!

I didn't know this stuff was public information. But I guess it is now... Bob Brewin was interviewed by Gregg Sporar with a series of specific questions about our strategy. Check it out!

For example, we will be open sourcing the Creator technology! (Q18) And, you'll get the Creator and Enterprise functionality as IDE plugins so you don't need to run multiple IDEs! (Q7, Q8) Bob also explains why we don't just roll over and yield the field to Eclipse (Q21).

Exciting times ahead!

Wednesday Feb 01, 2006

New Creator Bloggers

I used to mention new bloggers on the Creator team when they started up - but I've missed a whole bunch of recent(?) additions. Even my boss is blogging! Many of the Creator blogs are listed here. Take a look at Tutorial Divas for example for a wealth of Creator tips and howtos.

I was just talking to some customers yesterday about AJAX, and they were wondering about the performance impact of adding AJAX to your JSF application. Well, now it should be easy to measure it. In Marco's blog he shows how to use the profiler to profile your deployed application.

Finally, note that nearly all these blogs are on In a recent bile blog Sun is criticized for too much cheerleading on From reading the blog entry it sounds like that guy should spend a little less time porn surfing and a little more time trying out our software :) Seriously though, I post regularly about Creator and NetBeans because I like these tools, because I think the message of Sun's tools resurgence hasn't really gotten out there, and because people who read my blog generally appreciate tips and tricks for these tools. Particularly on you'll see lots of talk about Sun products. That shouldn't be a surprise - we "fly our own airplanes" here - we use our own software, and therefore we end up talking about it. Others are welcome to do the same with their own blogs. Just stop reading blogs where you find the signal-to-noise ratio too low. I don't see a problem here.

Friday Jan 27, 2006

Creator Flashback

Since Creator 2 launched on Wednesday, we had a special event on Thursday to celebrate. There were various presentations of cool web apps built with Creator 2.

I did a "walk down memory lane", by showing the original JavaOne 2003 demo bits for Creator - then called Project Rave. This was back when we only had a prototype; it took a year from that point to build a real product and release Creator 1.0 the following JavaOne conference.

The hardest part was actually finding the bits. This was before we were an official product, so we were flying under the radar - our source code didn't live in the release engineering infrastructure, but on a CVS server under a desk in the shared group room (the "Rave Room"). I ended up finding a snapshot build in a random directory on a server that was close enough to the JavaOne build. I fired it up, and ah, the memories!

Here are some screenshots... Most of the current Creator team has joined after the original demo, so this was news (or I guess "olds"?) to everybody.

Here's the splash screen. We had adopted a shark as our mascot, and because of that, subsequent releases have been named after types of shark - hammerhead, reef, thresher, mako, ... and let's not forget the multilingual release after hammerhead, named landshark (after SNL).

(We also featured an animated shark in the deployment progress bar!)

Once the IDE came up you got the original Welcome screen. Notice how the look and feel is different. We had a custom look and feel based on the Kunststoff L&F. (Click for full size)

Then we created a project, and designed the application in the designer. The application was Travel Center, a simple application involving travellers, trips, flights, and so on. This sample application lives on today - it's one of the sample applications available for Creator 2! (I believe we've modernized it though.)

The JavaOne demo was more involved - for example, we hooked up individual flights in the flight table to a web service to get itinerary results. And the key thing was that we could build these things in just 5 minutes!

Amazingly, a lot of stuff in the IDE was real - this was no "flash" prototype. The user actually built a real web application, that was using JSF, that got deployed to JWSDP, etc. Of course, the whole "component" model was messy - the designer had special knowledge of the components and how to paint them, etc. And the two way editing was just starting to get working and was disabled in the JavaOne builds to prevent booth disasters :)

As I was looking for the JavaOne bits I came across a couple of other possibly interesting artifacts - two temporary splash screens. The first splash screen is the splash screen we had in the Rave builds early on, before we got the Shark one right before JavaOne:

The second one was a splash screen some of us used in our builds during the 1.0 cycle just because we thought it looked cool. (I think it was Marco who found the shark image)

Tuesday Jan 24, 2006

Creator 2 is OUT!

Stop the presses - Creator 2 has been launched! Having spent an enormous number of hours on it (and blood, sweat and tears - tears of joy that is), it feels great to finally draw the line in the sand and declare it done. Yes, we have more features to do. Yes, we have more performance work to do. But the product has made a huge leap forwards from Creator 1, and can really make web application development trivial, even for developers completely unfamiliar with J2EE and web programming in general.

I could mention the new stuff in Creator 2 here - but the Creator web site has been redesigned for the launch of Creator 2 and is a great resource to take a look at. Be sure to view the flash demo of the product, and read the feature list. I mentioned some awards last week.

Most importantly, download the bits and try the product! It's free!!! Once you do, make sure you look at the Learning part of the web site - there are tons of tutorials and tips that tell you how to do all kinds of things - from navigation to validation to database CRUD to portlets to webservices to AJAX and on and on!

Here's a toast to all who contributed to Creator 2, not just the Creator team and management but all our users, beta testers, reviewers and others who have provided feedback. Cheers! Skål! On to Creator 3!

Available Free!
Sun Java Studio Creator 2 makes visual web application and portlet development easy. » Learn More

Wednesday Jan 11, 2006

More Awards

Creator has recently picked up two nice awards. Creator is the "Java Tool or Add-in of the Year" at (Full Article).

Also, eWEEK Labs has picked Java Studio Creator 2 as the most attractive developer tool for 2005!

The Early Access version gave me the kind of drag-and-drop convenience that developers expect after years of experience with Microsoft's Visual Basic or Borland's JBuilder and Delphi. It not only worked well when used as intended but also resisted my attempts to confuse its cooperating tools.
(Full Article).

Tuesday Jan 10, 2006

Creating downloadable files

My brother has been visiting me this last couple of weeks. It's been really nice and fun - see the picture on the right for my recycling bin a couple of days ago...

Last night we took a look at an application he has developed using Creator 2 (EA2). It's a nice little web application for his company that lets customers download patches based on privileges, installed software, etc. It had some weird bugs. So I went looking in the forums, and sure enough, there's a real Gotcha! with implementing live file downloading. Several people had tried and the solution was not posted. So, a blog entry might be in order!

There are many use cases for live file downloading. (By "live file" I mean that you are not just providing a static hyperlink to a file you are just deploying with your web application - you instead want to provide the file to the browser when they click on something, but the contents of the file might be generated on the fly, or at least the actual file to be downloaded is determined at runtime).

For example, you may want to let users click to download and view a PDF report based on current data in the web application, or perhaps even use something like POI to generate Excel-formatted spreadsheet files.

The first thing you have to do is write an action handler. This is invoked when the user clicks the download link or button. Double click on the component to get a skeleton, then write something like this:

public String button1_action() {
  String filename = "foo.pdf"; // Filename suggested in browser Save As dialog
  String contentType = "application/pdf"; // For dialog, try application/x-download
  byte[] data = ; // File contents to be written. Sorry, YOU have to do this part!

  FacesContext fc = FacesContext.getCurrentInstance();
  HttpServletResponse response = (HttpServletResponse)fc.getExternalContext().getResponse();
  response.setHeader("Content-disposition", "attachment; filename=" + filename);
  ServletOutputStream out = response.getOutputStream();

  return null;

You may have been tempted to add the above code in the action handler for a hyperlink (or link action). That seems really natural - most "download links" on the web are just that - actual links. Indeed, that's what my brother had done.

And that's the gotcha. If you do that, the above code will work, but as soon as you've clicked the link to download, your web app starts to act funny - if you click on any other hyperlinks, the download will be initiated again! It's as if the above code "corrupts" the webapp.

The solution is really simple. Just use a download button instead of a link! If you hook the download code up to a button action handler, everything will work as expected. And having a button rather than a link does make some sense when what you're doing is asking for something to be generated (a live file) rather than simply referencing a static resource.

<speculation range="wild">
JSF jumps through some hoops to make HTML hyperlinks behave like proper "actions" - via tricks like using an input hidden field in the form etc. This might be what's causing the weird link anomaly. I will check with the JSF guys to see if this has been addressed in newer JSF releases.

Tuesday Dec 13, 2005

Spoona Sutra - another Java conference trip report

I'm spending this week in Europe. Yesterday I was in Antwerp for JavaPolis - an annual Java conference in Belgium hosted by the local (and very active) user group. I did a talk on Creator. I basically lost my voice the previous night through heated and interesting discussion... so talking for two hours the following afternoon was pretty tough. And not good for voice recovery - so I'm not sure I can do a remote podcast with the guys this week. Too bad, since I had dinner with Romain Guy last night and can finally pronounce his name correctly!

The conference was held in a really interesting venue: a modern movie theater (which perhaps explains the name - the movie theater is named Metropolis). That meant the seating was unbelievably comfortable - soft seats, tall backs (tall enough that you can rest your head), and best of all - a giant projection screen - the movie screen itself. It's pretty amazing to see your tool running on a giant movie screen! No need to worry about small fonts... The picture on the right shows Ludo in action.

To combat the jetlag I went and grabbed some coffee. I added sugar, but couldn't find spoons anywhere. So I had to stir with my finger. Then I noticed where all the spoons had gone - and what they're doing! (Yes, that's the official artwork used by the conference - on slide templates, on publicity posters, on T-shirts, etc!)

Unfortunately I could only stay in Antwerp one day. I'm spending the rest of the week in Prague, where we're having many important planning meetings. I'm sure I will miss many interesting presentations. During Ludo's presentation yesterday morning he demoed a new AJAX-ified version of PetStore. It looked fabulous. He also mentioned the high performant "Grizzly" engine in Glassfish, which uses java.nio to get extremely high performance. I'm going to find out more!

Wednesday Nov 30, 2005


A month ago or so I blogged about the fact that Creator was offered for free. Unfortunately the wording in the various announcements used phrases like "Sun is currently offering..." which mde it sound like a temporary promotion - get your copy now or miss your chance. A free license is nice, but not the same as knowing you can continue to get the tool for free, including other coworkers in the future and so on.

As today's announcement makes clear (be sure to listen to the podcast audiofile linked from Johnny L's blog), this is no temporary marketing strategy. Sun is strategically moving towards free software. This will help drive volume, and indirectly, revenue. Johnny, and Jonathan, talk about this in many places. Listen to the JavaPosse interview with Jonathan for example. John Clingan also chimed in on today's announcement.

Oh... the link - get the software here. I've only talked about Creator in this blog entry, but you now get all the Enterprise software for free too.


Tor Norbye


« February 2017