Here's what I need to do:
Make a grid where I can drag and drop elements. (already done)
My problem is I need to give the option to enable magnetic grid, such as the Windows desktop when you allign icons.
What type of item should I use with Swing ? (Jpanel, GridLayout)
Is there an easy way to make a magnetic grid without coding everything?
*I need to be able to place items wherever I want when the magnetic option is not checked.
Thank you guys
Consider using a JLayeredPane, and adding as one layer a JPanel holding a grid of JPanels. When you want the grid functioning, then when a component is released over the GUI, the JPanel cell that contains your mouse pointer can accept the component and can perhaps center it using a GridBagLayout. When you want to place items in a free-hand way, then add them to a JPanel layer of the JLayeredPane that uses a null layout.
Related
I'm relatively new to developing GUI's within java so this may well be a stupid question or quite simply not possible to achieve but here we go.
I've created 1 single JPanel with no border layout set up or anything like that and I intended to paint a GUI on top of it using the graphics class. The JPanel is just plain black and then I've drawn a huge box over it leaving the black just as a border, and painted the whole GUI within this white box.
I want to add buttons within that white box GUI as well but I've no idea how. In fact they don't even have to be traditional buttons JButtons, if I could just draw a shape and have that act as a button then add an event handler to just that shape that would work also but I don't know how I'd do that either.
I have so much code for my whole program (it's a school coursework project) that I'm not sure which parts would even be worth sharing to assist with this question since there's so many GUI aspects I've already drawn so I've tried to just explain my issue in words.
Honestly I have no clue what I'm doing so any help would be appreciated.
EDIT: Here's a screenshot of my current GUI with a 'sketch' of how and where I'd like to be able to add buttons.
GUI Image
As with any suitably complex UI, you need to start by breaking it down into manageable chunks, focusing on areas of mutual interaction and functionality.
For example...
Says to me that you have two primary UI elements, the left and the right.
This could easily be established with a GridLayout, but, if the two sides are not equal in width, a GridBagLayout might be more appropriate
The right side to me says simply, JTable. You could place this within a container using a BorderLayout, allowing the table to occupy the CENTER position.
The key information would then a component laid out with either a GridLayout (top and bottom) or a GridBagLayout if the requirements are more complex. This component would then be added to the SOUTH position of the BorderLayout.
Again, this is pretty simple. The primary layout would probably be a BoderLayout, with the title in the NORTH position, the graph in the CENTER and the buttons wrapped in a component in the SOUTH.
You could use either a FlowLayout or GridBagLayout to layout the buttons depending on your how you want them to appear
Recommendations
Have a look at:
Laying Out Components Within a Container
How to Use Tables
And for the "border", I'd recommend you have a look at LineBorder. Take a look at How to use Borders more details
I have two JPanel instances in a JLayeredPane, on different z-orders. I want both of my child JPanels to always fill the space of the LayeredPane.
The idea is for me to toggle the display of a 2nd panel over top of the first to display a modal-like dialog. Yes, I could just use a JDialog, but I thought it would be fun to try and create some transparancy overtop of the covered JPanel for a nice effect.
I find that using a layout manager on the JLayeredPane, like BorderLayout, and trying to set both children to CENTER conflicts since both panels can't be in the Center.
Is there a trick that I'm not seeing?
The idea is for me to toggle the display of a 2nd panel over top of the first
The easiest way to do this is to use a Glass Pane.
Check out the Disabled Glass Pane for an example of this approach.
There are two ways to create some "Glass Panel like" overlay for JPanels with JLayeredPane:
Add a ComponentListener to the JLayeredPane and update the sizes of all child components whenever the size of the JLayeredPane changes
Create a simple FillLayout, which expands the size of its child Components to the size of the Layout Container (In our case the JLayeredPane). You need to keep a list of children Components. During layoutContainer you copy the dimensions of the Container to these child Components. I wrote this and its really simple, but unfortunately I can't post it, since it's corporate. But if anyone is interested just ask in the comments. The implementation basically consists of one-liners.
For both solutions you need to make sure, that the panels on top are transparent, by setting setOpaque to false. This ensures that underlying panels render their content.
I have a JPanel that uses a horizontal Box layout and contains a JLabel that I would like to keep in the exact same position as other components within the JPanel are setVisible(false). Currently, the JLabel moves to the left as other components become invisible.
What's the easiest way to go about this?
EDIT: Pics added
So this is what the JPanel look like with all components visible
When I set the three JTextFields on the right to invisible, the JLabel set to text X moves to the left like this:
But I would like it to stay where it was like this:
EDIT2: I'm actually using Netbeans GUI editor's Free Design for this particular JLabel. I'm sorry for the mistake - I've been using a lot of BoxLayouts recently and I got confused!
Currently, the JLabel moves to the left as other components become invisible.
Yes, layout managers are designed to only work with visible components. I'm not sure if any of the default layout manager will work, but I would look into using the GridBagLayout, since this layout is based on a grid structure so as long as you have components in that grid on another row the label should not shift.
Otherwise, you could dislay the "other components" in a panel using a CardLayout. Then instead of making the components invisible, you swap the panel with an empty panel.
Read the section from the Swing tutorial on How to Use CardLayout for more information and working examples.
Edit:
Based on your picture the easiest solution is to use "glue":
panel.add(Box.createHorizontalGlue);
panel.add(xLabel);
Now the label will always be displayed at the far right of the panel. Read the tutorial on How to Use BoxLayout for more information about "glue".
I'm used to working with Swing to create GUIs but for a recent project I've chosen to switch to JavaFX. I'm having some trouble with recreating a certain layout I used to make using a GridLayout.
I desire the following behavior:
2 columns that scale proportionally with the size of their parent that center their contents.
Using Swing, I would make JPanel with a GridLayout (1 row, 2 columns) and add 2 JPanels with a BorderLayout, adding the actual content to those panels with the centered constraint.
Then I could add the first panel to any container that has a layout that stretches with the frame and all would be well.
I seem to be unable to recreate this behavior in JavaFX in a simple way. I can think of ways to do it using bindings and combining several panes but I was hoping there is a layout that does this automatically. I've tried using TilePane, HBox, GridPane, AnchorPane, SplitPane and even BorderPane but none of them seem to do what I want them to.
Is there a recommended way to accomplish this? I would much prefer not to embed Swing into the application. Basically what I want is to be able to split the content into two columns that automatically stretch with the Stage/Scene (JFrame).
GridPane? Some references here
http://docs.oracle.com/javafx/2/layout/builtin_layouts.htm#CHDGHCDG
http://docs.oracle.com/javafx/2/api/javafx/scene/layout/GridPane.html
Using Eclipse Juno for Java & WindowBuilder
I have three panels of the same size that lay on top of each other - they have different widgets. During coding, they all display and clutter up what I'm doing.
I can show and hide them in runtime as needed but, I want to display only the one I'm working on while doing drag and drop of widgets. I've tried using different panels and pane types (tabbed, layered...) and selecting opaque but, nothing hides them.
How do I hide the other (panes, panels...etc) during coding?
I have the same issue. Among other reasons, my solution was to create separate classes per view. So my frame would be its own class, it would maybe have a TabbedPanel (or whatever it's called), and then I would have a new class for each tab on that tabbed panel. Each class would extend JPanel so I could plop it right in there. That way not only is your gui design not cluttered up, but your code logic is separated into separate files, where it might belong anyway.
[SOLVED] Answering my own question.
It may not be perfect or the best/correct way, but it works!
WindowBuilder wants to Surround other panels/widgets that are within it's bounds so, you have to trick it by using opaque, Order>forward/backward then setting the desired bounds (all panel sizes and bounds can be equal and will overlay nicely both during widget drag&drop and runtime).
Here's how to do it with a 3-Panel example (NOTE: WindowBuilder is buggy/in-consistent and often I needed to select the items from the gui, not in the Components tree).
Create your first panel. Add your widgets and border to it.
Create your second panel (the one you want to overlay on top of the first one). This second panel MUST not be completely inside the first panel - it MUST extend beyond the edges of the first panel (parts of it can be inside the first panel). This takes a bit of trial because of the 'surround', mentioned above. Use the shift-key to stop the snapping.
Select the top panel in the gui, NOT from the Components tree, and toggle the Opaque property. The top panel (first or second) in the tree is the one you set to opaque and work on.
Add another panel and repeat the process.
Once you get your widgets/etc as you want them, use the property Bounds to set them all the same or as desired. After that, as long as you don't move a panel by dragging it, it will remain un-surrounded by the other panels. If you move by dragging, it may get set to surround...
I've done this a dozen times now and it works consistently.
Below is a shot of 3 panels overlayed, un-surrounded and not opaque, thus showing widget clutter
Below is a shot after the bounds are set (and not surounded). Opaque and order not yet set:
Below is a shot with bounds set and panel 3 moved forward and opaque set:
Below is a shot with bounds set and panel 2 moved forward and opaque set:
... etc, etc... Now you can work on a panel that's ordered to the front and, naturally, use the setVisible in your code...