3

When creating a GUI in Java with Swing, how should more advanced "elements" be created? As an example, consider: enter image description here

This could be done using ~10 images depending on the current page or status. I'm also sure that it'd be possible to do this programmatically, however, considering my past experiences with Swing, I'm also sure it'd be a lot of code for something relatively simple. Especially considering this could be done in CSS with max ~40 lines of code.

In a situation like this, is there any alternative approach to create this "element"? If not; what's preferred: images or Swing?

Zar
  • 6,786
  • 8
  • 54
  • 76
  • 1
    firewalls can prevent many of us from seeing images. Can you better describe what you're trying to do? – Hovercraft Full Of Eels Nov 30 '12 at 23:01
  • @HovercraftFullOfEels I'm developing a Java application which will need elements which are not standard, similar to the image provided in the question. I'm unsure wether I should use Swing (or something else..), or just simply a lot of images. – Zar Nov 30 '12 at 23:13
  • Again, I can't see the image that you've provided due to a firewall. Best of luck with this. – Hovercraft Full Of Eels Nov 30 '12 at 23:15
  • @HovercraftFullOfEels Oh, I'm sorry - I misunderstood you. The image is a form-state/progress-tracker, think "Step one is active page, colored [check] - - - Step two not completed, greyed out - - Step three not completed, greyed out" Along with a label describing each step. It's only an example, though. – Zar Nov 30 '12 at 23:19
  • I think a good hybrid solution might be feeding vectorial graphics to Java code, but I don't know any library that does that. – djjeck Nov 30 '12 at 23:22

3 Answers3

4

  1. You can use a suitable Unicode glyph, e.g. ✓—CHECK MARK or any digit,

    • as a label's text, shown here.

    • as a GlyphVector, mentioned here.

    • as a rendered image, illustrated here.

  2. You can get a tinted, anti-aliased circle by implementing the Icon interface; ColorIcon is an example.

  3. You can get a variety of solid and dashed lines using BasciStroke, seen here.

  4. Among the stock layout managers, FlowLayout may be adequate.

Community
  • 1
  • 1
trashgod
  • 203,806
  • 29
  • 246
  • 1,045
  • More [Dingbats](http://www.unicode.org/charts/PDF/U2700.pdf), including circled digits. – trashgod Dec 01 '12 at 03:03
  • Perfect answer, thanks a lot! After not too long, I, with the assistance from your answer, created something that isn't too different: https://dl.dropbox.com/u/16088211/danke.png (with support-borders). Now I just have to figure out how to make the line overlap on longer texts (such as the last item). Many thanks once again! – Zar Dec 02 '12 at 20:34
  • You can [*Use HTML in Swing Components*](http://docs.oracle.com/javase/tutorial/uiswing/components/html.html) to add line breaks. – trashgod Dec 02 '12 at 20:51
  • Smart, didn't think of that! [https://dl.dropbox.com/u/16088211/height.PNG] It does now however push up the circle instead of the text. I've tried to use `cons.anchor = GridBagConstraints.SOUTH`, with no success. – Zar Dec 03 '12 at 11:23
  • You might see if [`Box.TOP_ALIGNMENT`](http://docs.oracle.com/javase/tutorial/uiswing/layout/box.html#alignment) works. – trashgod Dec 03 '12 at 16:55
  • I'll take a look. Thanks once again, truly appreciated! – Zar Dec 03 '12 at 22:21
3

This will come down to the requirements.

If you want it to be scalable, then Swing graphics is your best choice. If not, images should be fine. If you want it to be reusable (for n possible connections) then Swing graphics is a better choice. If you have a limited number of connections that will never change, the images will be fine.

You also need to consider how easy it would be to change the look and feel. Images will take time to create, but renderers provide more flexibility.

For me, I'd generally use a combination of the two. Rendering text is relatively simple, but things like the check mark would take more time to create.

You've also got to take into consider if you want to produce a single image and render it, it use separate components for each part.

I'd also consider things like navigation. Do you need it, if so, is it easier to use components with MouseListeners or convert the view to the model to determine what's going.

MadProgrammer
  • 343,457
  • 22
  • 230
  • 366
2

If you really have to use Java (as you said, with CSS it's much easier to implement something like that), I think it's better to use images.

Code that generates graphic elements can be implemented, but beside being harder to do, it's not maintainable: any arbitrarily simple change to the design might take long hours to be implemented.

Opposed to that, images can easily be replaced, sometimes without even recompiling the application (if they maintain the same size, format and so on).

Performance-wise, using swing or another library gives you a gain in application size of a few kilobytes, while using images might make your application more responsive in case of limited resources (mobile apps, old computers)

djjeck
  • 1,781
  • 17
  • 25
  • First of, thanks for your answer and thoughts! Sadly, I have to use Java, since it's going to be a desktop application. Luckily, the application's total size isn't too much of a problem since it'll only be deployed once (not ev. counting updates). – Zar Nov 30 '12 at 23:17