Develop Reference

Swing layering - transparent component ignores underlying AWT element

First, to get it out of the way, I absolutely NEED to use heavyweight AWT component with a swing application. I need features from both of them.
The task is simple - render a heavyweight AWT Canvas (or any other element), render OpenGL scene directly onto it, then display Swing buttons above it for the UI.
My problem is that it works half-way.
I don't seem to have problems with Z-ordering. I am using jLayeredPanes for it, and I can move Canvas between layers and it actually works, popping on top or below other elements.
The problems are with transparency.
The thing is, Swing elements have Opaque parameter, and when it's set to false (non-opaque) - it should basically be transparent and you should see the next element below it. In my case, however, the AWT Canvas gets ignored, and you instead only see the next underlying SWING element.
Here are a couple of screenshots. They are taken from a standalone test project of mine. The canvas is stretched to the size of the frame, and in the upper left there is a JLayeredPane dummy element that is a simplified version of the menu.
On the first screenshot, the JLayeredPane's Opaque setting is set to true, and you can see that it's background property is set to Blue color.
On the second screenshot, everything is exactly the same but Opaque is set to false. Instead of displaying whatever is on the Canvas - what gets drawn in empty grey jFrame background.
Lastly, on the third screenshot I have put Canvas into a jPanel instead of leaving it on its own. As you can see, the Panel's orange color is seen through the transparent jLayeredPane, but the Canvas is yet again hidden.
Here's the code for the Frame layout. I would not post my rendering/context code right now
frame = new JFrame("AWT test");
frame.setDefaultCloseOperation(JFrame.DISPOSE_ON_CLOSE);
frame.setLayout(new BorderLayout());
frame.setPreferredSize(new Dimension(width, height));
canvas = new Canvas();
canvas.setSize(width,height);
//this part exists only in the third example
JPanel p = new JPanel();
p.setSize(width,height);
p.setBackground(Color.orange);
p.add(canvas);
// third example end
JLayeredPane pane = new JLayeredPane();
JLayeredPane paneMenu = new JLayeredPane();
JButton button = new JButton();
button.setSize(20,20);
paneMenu.setSize(200,200);
paneMenu.add(button, new Integer(1));
paneMenu.setBackground(Color.BLUE);
paneMenu.setOpaque(false); //True for the first example
pane.add(p, new Integer(1)); // canvas for the first two examples
pane.add(paneMenu, new Integer(2));
pane.setOpaque(false);
frame.add(pane);
frame.pack();
frame.setVisible(true);
frame.transferFocus();
Could anyone please explain me what is going on and how to do what I need to do.
I will repeat again - I have to use heavyweight component as render target. I am aware of solutions like JOGL's GLPanel which is a lightweight Swing-compatible component. But I tried that method and the performance is really slow, because instead of directly rendering onto it as a context target - it reads FrameBuffer from memory, flips it, and then paints it as BufferedImage. This path is not fitting for the limited resources of an embedded system that I'll be running on.
c0der said: Please post minimal reproducible example
Errrrm.... Didn't I?
Here, you can have it in complete java class form if you want, but I literally changed some variables for constants.
import javax.swing.*;
import java.awt.*;
public class Main
{
public static void main(String[] args)
{
JFrame frame = new JFrame("AWT test");
frame.setDefaultCloseOperation(JFrame.DISPOSE_ON_CLOSE);
frame.setLayout(new BorderLayout());
frame.setPreferredSize(new Dimension(500, 500));
Canvas canvas = new Canvas();
canvas.setSize(500,500);
canvas.setBackground(Color.RED);
//this part exists only in the third example
JPanel p = new JPanel();
p.setSize(500,500);
p.setBackground(Color.orange);
p.add(canvas);
// third example end
JLayeredPane pane = new JLayeredPane();
JLayeredPane paneMenu = new JLayeredPane();
JButton button = new JButton();
button.setSize(20,20);
paneMenu.setSize(200,200);
paneMenu.add(button, new Integer(1));
paneMenu.setBackground(Color.BLUE);
paneMenu.setOpaque(false); //True for the first example
pane.add(p, new Integer(1)); // canvas for the first two examples
pane.add(paneMenu, new Integer(2));
pane.setOpaque(false);
frame.add(pane);
frame.pack();
frame.setVisible(true);
frame.transferFocus();
}
}
A little update:
I initially suspected that because Swing elements delegate all their drawing to the underlying heavyweight element (In my case JFrame), then what happens is that the frame generates a single frameBuffer for itself and then displays on top of Canvas. Canvas itself is not handled in this generation and thus the frame "covers" over the canvas.
That doesn't seem to be the case. I tried making the JFrame undecorated, all panels non-opaque, and display the picture. The result - canvas is still "cut", and through the hole you can see the underlying IDE menu.
This makes me think that somewhere during Drawing, the Canvas itself detects that it is obscured by another element, and that it doesn't need to draw that area. So it "optimizes" itself and doesn't update these pixels.
Maybe I'm wrong. But here's another screenshot. This is the same example as before, but I took out 3d rendering and simply trying to display Canvas with background set to Red.

Once again, going to reply to my own question.
It turned out that I need to do
setComponentMixingCutoutShape(paneMenu, new Rectangle());
for the menu pane that lies underneath the button. That essentially tells java not to cut out the element from the heavyweight underlying component.

How to automatically resize JFrame if elements are too large?

I have been researching for 30 minutes on how to automatically resize a JFrame when the elements are too large. I am trying to fit line segments inside the JFrame but it always exceeds the space but does not automatically generate more space.
What should I do?
DrivePanel panel = new DrivePanel(aCar, coordinates);
JFrame application = new JFrame();
application.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
application.add(panel);
application.setSize(600,600);
application.setVisible(true);
Example of output:

Some things to consider :
if you are doing custom painting on your panel, remember that the panel's size it's not changed by what you are drawing.
For example, if the "last" point (i mean the point with the biggest values of x and y) is drawn at (1000,1000) coordinates, you should set the preferred size of your panel in order to contain it.
To let your application using the preferred size of your components, you should call application.pack() (where application is your JFrame object) instead of setting size manually.
If your panel is too big to be displayed enterily on your screen, you might add it to a JScrollPane, and then add the scrollpane to your jframe (not the panel itself).
The scrollpane will automatically use scroll bars if your panel can't be fully displayed on your screen.
So consider this small example, based on your code :
DrivePanel panel = new DrivePanel(aCar, coordinates);
JFrame application = new JFrame();
application.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
panel.setPreferredSize(new Dimension(1000,1000)); // change 1000,1000 with the coordinates you need ...
JScrollPane scrollPane = new JScrollPane(panel);
application.add(scrollPane);
application.pack();
application.setVisible(true);
Hope this helps :)

JFrame Layout: Header and 2 Text Areas

I have been trying to code a basic IDE for my programming language but I have not had much experience with JFrames. I am trying to set it up so that the window has a main header and then two text areas below it. I can get the header all sorted out; it's just 3 labels centered in the window. But I cannot get the two text areas to work. I have only tried one so far and I am already seeing loads of stuff wrong. Whenever I resize the window, it doesn't stay beneath the header (which is a Box Layout), but it goes beside it. I also want to make it so that the text areas increase in size when the window changes size. Here is the code that I have so far (this only has one text area).
JFrame frame = new JFrame("DotDotIO");
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
frame.setLayout(new FlowLayout());
frame.setPreferredSize(new Dimension(800,600));
frame.setMinimumSize(new Dimension(600,450));
Box titleText = Box.createHorizontalBox();
JLabel title = new JLabel("<html><span style='color: teal;'>DotDotIO</span></html>");
title.setFont (title.getFont().deriveFont(64.0f));
JLabel version = new JLabel("<html> Version 1.0<br>Created by Luke Carr</html>");
JLabel slogan = new JLabel("<html>Full Potential<br>Minimal Knowledge</html>");
titleText.add(version);
titleText.add(title);
titleText.add(slogan);
titleText.setAlignmentX(frame.getWidth() / 2);
Box inputContent = Box.createHorizontalBox();
JTextArea code = new JTextArea(35,65);
code.setEditable(true);
code.setBorder(null);
inputContent.add(code);
frame.add(titleText);
frame.add(inputContent);
frame.pack();
frame.setLocationRelativeTo(null);
frame.setVisible(true);
I currently have it setup so that the text area has a fixed size, but I would like it setup so that the left text area has a width of 65% of the screen, and the right text area takes up 15% of the screen, with 5% margin either side and 5% margin in between both. One final note is that the way my language currently interprets the code is through a file, and then it loops through each line. How would I be able to do this with all of the code typed in the text area on the left?
Currently what I have:
Sorry for asking so many questions. Although I have been doing Java for quite a long time, JFrames have never really come up and I am very new to them.

A box layout doesn't offer much flexibility when it comes to re-sizing the components. This is a link to a similar question. You might want to try a different layout manager.
BoxLayout stretches component to fit parent panel

I would consider using a BorderLayout, and working with Insets of the inner panels. This would give you a full Frame, where you can specify a percentage or fixed pixel amount around the text areas, so no matter what size the window is, the layout adjusts itself to an appropriate distance.

You should probably first put everything into a JPanel and add that to the frame instead of directly adding everything to the frame.
JPanel mainPanel = new JPanel();
mainPanel.setLayout(new BoxLayout(mainPanel, BoxLayout.Y_AXIS))
...
frame.getContentPane().add(mainPanel);
I gave the BoxLayout an alignment of Y_AXIS so that the components will go from top to bottom. But then how do you display two headers side by side? Nest another JPanel inside mainPanel:
JPanel info = new JPanel();
info.setLayout(new FlowLayout(FlowLayout.RIGHT, 50, 10));
JLabel version = new JLabel("<html> Version 1.0<br>Created by Luke Carr</html>");
info.add(version);
JLabel slogan = new JLabel("<html>Full Potential<br>Minimal Knowledge</html>");
info.add(slogan);
mainPanel.add(info);
I set it to a FlowLayout in order to align the JLabels to the right, and so that if the width of the window is too small then Swing will automatically realign them vertically. There are many other ways of doing this, but this is the way I prefer. Aligning the components to the right gives the 65/15 proportions you wanted. If that's not what you wanted, you can change it to FlowLayout.CENTER, FlowLayout.LEFT, etc. The 50 and 10 in the FlowLayout's constructor are the vertical and horizontal spacings between components.
To create the 5% margin on either side of them, I just set the entire mainPanel's border to an empty border that extends for 10 pixels on each side
mainPanel.setBorder(BorderFactory.createEmptyBorder(10, 10, 10, 10));
If you just want a border around the version number and the slogan, set info's border the same way.
For your last question: to read the code line by line, use code.getText() and split it using String.split(), as mentioned here.
I rewrote the code and changed some settings:
import java.awt.FlowLayout;
import javax.swing.BorderFactory;
import javax.swing.Box;
import javax.swing.BoxLayout;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.JTextArea;
public class Main
{
public static void main(String[] args)
{
JFrame frame = new JFrame("DotDotIO");
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
JPanel mainPanel = new JPanel();
mainPanel.setLayout(new BoxLayout(mainPanel, BoxLayout.Y_AXIS));
mainPanel.setBorder(BorderFactory.createEmptyBorder(10, 10, 10, 10));
JPanel title = new JPanel();
JLabel header = new JLabel("<html><span style='color: teal;'>DotDotIO</span></html>");
header.setFont(header.getFont().deriveFont(64.0F));
title.add(header);
mainPanel.add(title);
mainPanel.add(Box.createVerticalStrut(10));
JPanel info = new JPanel();
info.setLayout(new FlowLayout(FlowLayout.RIGHT, 50, 10));
JLabel version = new JLabel("<html> Version 1.0<br>Created by Luke Carr</html>");
info.add(version);
JLabel slogan = new JLabel("<html>Full Potential<br>Minimal Knowledge</html>");
info.add(slogan);
mainPanel.add(info);
mainPanel.add(Box.createVerticalStrut(20));
JPanel codePanel = new JPanel();
JTextArea code = new JTextArea(25, 65);
codePanel.add(code);
mainPanel.add(codePanel);
frame.getContentPane().add(mainPanel);
frame.pack();
frame.setVisible(true);
}
}
If I misunderstood your question, please comment. I hope this helps.
--- EDIT ----------------
The way a FlowLayout works is that it places components in a particular direction until it reaches the edge of the window; then it "hits return" and the components are placed under the first row of components. That is how the two labels were aligned the way they were and are able to align vertically if the screen size is too small.

How to make this 3 column splitter in Java?

I'm using Java and MiGLayout to try and re-create this layout:
http://www.methvin.com/splitter/3csplitter.html
So something like this:
Each column needs to be resizable
The size of the left and right columns stay the same size when resizing the main window
Middle column fills all available space and changes size when resizing
In other words, the left and right panel need to "stick" to the left and right side of the window, but also be resizable (and not change proportionally when being resized)
I've tried many things, but the resizing is always the problem. Here is the current code which is an attempt at doing this with a nested JSplitPane.
public class MainGUI extends JFrame {
private String app_name = "Layout Test";
private int window_x_min = 700;
private int window_y_min = 450;
public MainGUI() {
setTitle(app_name);
setSize(window_x_min + 200, window_y_min + 100);
setMinimumSize(new Dimension(window_x_min, window_y_min));
setLocationRelativeTo(null);
setDefaultCloseOperation(WindowConstants.DISPOSE_ON_CLOSE);
JPanel panel = new JPanel();
this.setContentPane(panel);
panel.setLayout(new MigLayout("","[]","[grow]"));
JSplitPane splitpane = new JSplitPane(JSplitPane.HORIZONTAL_SPLIT);
splitpane.setContinuousLayout(true);
splitpane.setTopComponent(new JButton("middle"));
splitpane.setBottomComponent(new JButton("right"));
JSplitPane splitpane2 = new JSplitPane(JSplitPane.HORIZONTAL_SPLIT);
splitpane2.setContinuousLayout(true);
splitpane.setDividerLocation(450);
splitpane2.setBottomComponent(splitpane);
splitpane2.setTopComponent(new JButton("left"));
panel.add(splitpane2, "push, grow");
this.pack();
this.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
this.setVisible(true);
}
}
I've managed to make it load up initially how I like, however with the following issues:
Resizing from the right side changes size of the the "right" panel, not the size of the middle panel
Resizing from the left side changes the size of the "right" panel as well
It appears that the left side of the app is working, I need the right side to function the same way. Hope that I'm making sense, thanks!

You need to manage how the space is allocated when the split panes are resized. This is done by using the setResizeWeight() method. By default the value is 0.0f which means the "left" component is fixed. So you need to manipulate this property on one of the split panes. Read the API for more information on how this property works.
I don't use MigLayout, but doing a simple test using a standard BorderLayout all you need to add is:
splitpane.setResizeWeight(1.0f);
Also, when you post a SSCCE don't forget to include the main() method so we can just copy/paste/execute the code. We should not need to do any extra work.

Java Swing component interaction (BoxLayout and Label)

OK, several questions about the test code below... I don't have the full working program to post, but I'm hoping people know Swing well enough to take a stab at it. This is a JLabel inside of a JPanel(BoxLayout), and I'm working on the sizing of the label in the lower right.
What I get with the code as shown is a status box 300 width by 30 height. I have fiddled with the preferred size and the label minimum size, and it does not seem to behave in any rational way.
Why does the JPanel Preferred Size affect the height but not the
width? If I change the x dimension in setPreferredSize() to 0 or
500, it still comes out 300 from the label.
Why does the JLabel Minimum Size affect the width but not the
height? If I comment the setPreferredSize() call and increase the
label height to 30, nothing happens.
I started out with JPanel setMinimumSize (commented), but it no longer has any
effect - why does the JPanel require setPreferredSize()?
If I change the label text from "" to " ", this increases the height
of the label. Since the label is not controlling the height here,
why does this have any effect at all?
By the way, the createRigidArea() call is to force the separator to the right, rather than sticking to the left hand side of the screen. If there are any less kludgy ideas for this, I'd be grateful.
private JComponent makeStatusBarTest() {
JPanel statusPanel = new JPanel();
statusPanel.setLayout(new BoxLayout(statusPanel, BoxLayout.LINE_AXIS));
statusPanel.setComponentOrientation(ComponentOrientation.RIGHT_TO_LEFT);
// statusPanel.setMinimumSize(new Dimension(0, 30));
statusPanel.setPreferredSize(new Dimension(500, 30));
JLabel statusLabel = new JLabel();
Border emptyBorder = BorderFactory.createEmptyBorder(5, 10, 5, 10);
statusLabel.setBorder(emptyBorder);
statusLabel.setText("");
statusLabel.setMinimumSize(new Dimension(300, 20));
statusPanel.add(statusLabel);
statusPanel.add(new JSeparator(SwingConstants.VERTICAL));
statusPanel.add(Box.createRigidArea(new Dimension(5000,0)));
return statusPanel;
}

I can explain #1 and #2:
From the BoxLayout javadocs: "BoxLayout attempts to arrange components at their preferred widths (for horizontal layout) or heights (for vertical layout)."
In other words, BoxLayout uses the internal components (in your case, statusLabel) to decide the widths, but the JPanel itself (within reason) to decide the heights.
You can usually use Glue instead of RigidArea to move stuff around, but I agree that it takes some getting used to.
#4 is Swing being too efficient - if the JLabel is empty the text rectangle is 0x0. Ultimately determined in SwingUtilities.layoutCompoundLabelImpl().
I think #3 is because BoxLayout is trying to respect the preferred size of the internal components. Since setMinimumSize, arguably, overrides their preferred sizes.