Java GUI, creating piano keys using JButton - java

I'm trying to create a simple piano application using Java, and I'm stuck at creating the keys.
So what I have is a bunch of (Black) JButtons on top of (White) JButtons, but whenever I click the white buttons, it covers the black buttons.
So my question is; how do I implement this so the black JButtons would stay on top of the white ones.

I'm not sure how you're laying out your buttons in the first place. I suggest you use JLayeredPane for the layout. With it, you specify z-index of each component - and it takes care of the rest. Have a look here: http://docs.oracle.com/javase/tutorial/uiswing/components/layeredpane.html#depth

Related

Java button within graphics panel

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

Java Swing: how to shade a game gui after the match has finished

In a board game we are developping in Java we would like the gui to be overshadowed when the game is finished. We have a Jframe in which there is JPanel with the board on which there are some colored pawns and boxes (JButtons) and we would like that everything becomes a sort of black and white and grey. Is there an authomatic method in Java to do this in Java Components?
There are several different kinds of panes to look at that could achieve this, or something similar, if you are using Swing (which I assume from the tag, that you are).
You could use a Glass Pane. http://docs.oracle.com/javase/tutorial/uiswing/components/rootpane.html#glasspane
glass panes could be thought of as like a CSS overlay. They dis-allow interaction with components behind them.
Also, take a look at JXLayers and JLayers, they allow you to modify the way components are actually painted.
Good Luck!
Override paintComponent() (Or if you have some components added to the container it's better to override paintComponents() method).
Call
super.paintComponent(g);
Color semiColor=new Color(0,0,0,128);//the last param represents alpha
g.fillRect(semiColor);

How to make this GUI layout in Swing

For a project I have an almost working code, but I do not have the GUI. I want to make a screen that consists of clickable labels and has the following design:
I was thinking about first making the middle GridBagLayout with with a dimension of 6 by 2. Then 'wrapping' that up and adding the two buttons to the side, and then 'wrapping' that and adding the two buttons below.
I am inexperienced with Swing, and I have no idea how to start. I hope someone can give me some hints in the right direction.
Several approaches to a very similar layout using GridBagLayout and/or nesting are shown here. Consider using JButton for each clickable area, rather than JLabel. If you go with a nested layout,
Use BorderLayout for the enclosing panel.
Add buttons to EAST and WEST for the leftmost and rightmost areas.
Add a GridLayout(1, 2) of buttons to SOUTH for the bottom row.
Add a GridLayout(2, 6) of buttons to CENTER for the central twelve areas.
Addendum: A critical issue will be what you want the resize behavior to be.
as said in the comments above you could (should ?) use the WYSIWYG Window Builder plugin available for Eclipse; it's simple to use.
However, that doesn't answer your question, so to do so, here is how I would structure the UI if I were to make one like that :
http://www.hostingpics.net/viewer.php?id=902716gZHkK26.jpg
I basically use BoxLayout because that's the one I'm most familiar with. Every Rectangle is a JPanel. I think the image is pretty self eplanatory.

How can I use the Java Trident library to animate panels in CardLayout?

I would like to use the Java Trident library to animate screen transitions.
I have a series of panels arranged in a CardLayout. When a JButton is clicked on one panel, a new panel is shown. I would like to implement some sort of fade-in animation instead of having it just appear instantly.
I have read that slide-in animations are possible just by moving panels off-screen and changing the x-coordinates when I want to transition.
I've tried setting something up, but I know I'm not doing it correctly. I need to call cl.show() to actually show the panel I want:
CardLayout cl = (CardLayout)(GameContainer.getLayout());
screenChangeTimeline = new Timeline(cl);
screenChangeTimeline.addPropertyToInterpolate("layout", "MainMenuPanel", "TwoPlayerPanel");
screenChangeTimeline.setDuration(1500);
GameContainer is the panel that has the CardLayout and all other panels are located inside it.
It maybe easier to create animation effect using images, not the actual sliding of panels. Capture images of the panel you're hiding and the panel you are about to show. Animate these images using a sliding effect. Once the animation if finished, swap the actual panels. Here is a sample that demonstrates similar idea. It uses an auxiliary card to scroll an image combined from two panels.
You may be interested in the ready solution - Animatingcardlayout. It provides an extension to CardLayout and a set of various animations.
Also, check out a series of articles by Kirill Grouchnikov (creator of Trident) - Animating layouts.
The sliding effect example
http://java-sl.com/tip_slider.html

Position of JComponents using Netbeans GUI Swing Builder

I'm developing a graphic interface using Java and Swing, and I'm having a hard time getting the JButtons to stay in their position while changing from one panel to another.
There are three buttons in a row aligned in the left bottom of each panel, all the panels the same size, but somehow they manage to change their position a little when I run the application (on the design preview they show up in the right place). It's getting a bit annoying. I'd appreciate any help
Are you trying to do tabs? If you are, a JTabbedPane will do this much better than a button.
Since you are using the Netbeans GUI Builder, look at the options in the Component panel on the left. It has Swing tabbed panes and AWT panes if you really want.

Categories

Resources