There is a problem with my code where GWT event handlers are not fired after Panel is appended to a DIV
final FormPanel form = new FormPanel();
VerticalPanel panel = new VerticalPanel();
// Other code omitted for simplicity
DOM.getElementById("modal_panel").appendChild(panel.getElement());
// Submit button
panel.add(new Button("Submit", new ClickHandler() {
public void onClick(ClickEvent event) {
GWT.log("Submit clicked");
form.submit();
}
}));
When the submit button is clicked it should do the form submit action, but it even doesn't show the GWT log on the DevMode console. What could be the reason?
It is not a good idea to add a widget directly in the DOM. GWT does a lot of things, when adding a widget. Adding elements by hand to the DOM will cause some problems. One of the problem is, that the events are not sinked and handlers will not work.
Try something like this:
DOM.sinkEvent(panel.getElement(), Event.ONCLICK);
after adding the panel.
If you want to add your panel to an existing HTML page, try:
RootPanel.get("modal_panel").add(panel);
Related
I am currently working on a school project where we are creating a GWT web application which uses a GeoChart widget to display information about the servers we have crawled. Simply put, I would wish to create a text box on top of our GeoChart widget which shows an interactive world map that takes up the whole screen right now to input information. I have searched quite extensively but I have been unable to come up with an answer.
Here is the code as follows:
#Override
public void onModuleLoad() {
dataReader = (DataReaderAsync) GWT.create(DataReader.class);
RootLayoutPanel.get().add(getSimpleLayoutPanel());
// Create the API Loader
ChartLoader chartLoader = new ChartLoader(ChartPackage.CORECHART);
chartLoader.loadApi(new Runnable() {
#Override
public void run() {
getSimpleLayoutPanel().setWidget(getGeoChart());
drawGeoChart();
}
});
}
As GeoChart is a widget, it is wrapped under(i am not sure if this is the right word) a SimpleLayoutPanel right now which will display it into a full screen. As stated above, I would wish to include text above the geoChart. From my understanding, I would need to create another widget containing my text and add both the GeoChart widget and the text box widget into it. What would be the best way to go about doing this?
I believe DialogBox could solve your problem. People usually program the DialogBox in a way that it only pops up into display when certain event is triggered and disappears after user finishes some operation. In your particular case, you can simply make the DialogBox shows up from the beginning and never disappears. And the best part of it: you don't need to add the DialogBox widget to the geoChart widget. Calling dialogBox.center() or dialogBox.show() will do the magic for you.
Here is the sample code.
#Override
public void onModuleLoad() {
dataReader = (DataReaderAsync) GWT.create(DataReader.class);
RootLayoutPanel.get().add(getSimpleLayoutPanel());
// Create the API Loader
ChartLoader chartLoader = new ChartLoader(ChartPackage.CORECHART);
chartLoader.loadApi(new Runnable() {
#Override
public void run() {
getSimpleLayoutPanel().setWidget(getGeoChart());
drawGeoChart();
}
});
// NOTE: the first argument 'false' makes sure that this dialog box
// will not disappear when user clicks outside of it
// NOTE: the second argument 'false' makes sure that mouse and keyboard
// events outside of the dialog box will NOT be ignored
DialogBox dialogBox = new DialogBox(false, false);
DialogBox.setText("Demo");
HorizontalPanel panel = new HorizontalPanel();
panel.setSpacing(5);
InlineLabel labelOfTextBox = new InlineLabel("Label");
TextBox textBox = new TextBox();
panel.add(labelOfTextBox);
panel.add(textBox);
dialogBox.setWidget(panel);
// show up in the center
dialogBox.center();
}
Dear all thanks for answering my question. To rectify this problem, I have made use of the custom widget API within GWT(known as Composite). Here's the code as below:
private static class CombinedWidget extends Composite {
public CombinedWidget() {
// place the check above the text box using a vertical panel.
VerticalPanel panel = new VerticalPanel();
DockLayoutPanel dPanel = new DockLayoutPanel(Unit.EM);
panel.setSpacing(13);
panel.add(nameProject);
nameProject.setStyleName("gwt-Group-Label");
panel.add(className);
panel.add(nameKs);
panel.add(nameEsmond);
panel.add(nameBowen);
panel.add(nameAaron);
dPanel.addWest(panel, 13);
dPanel.add(getGeoChart());
// all composites must call initWidget() in their constructors.
initWidget(dPanel);
setWidth("100%");
}
Actually I sort of changed from the original idea. Instead of putting it on the very top, I attached the labels into a VerticalPanel and then created a CombinedWidget(custom widget) which adds both a VerticalPanel and DockLayoutPanel together. I then added the VerticalPanel(containing all the labels) and the GeoChart into the DockLayoutPanel.
This solved my problem of displaying both the labels and the GeoChart on the same page(as originally i added it into a VerticalPanel but it would not work as the app would not read the GeoChart due to the VerticalPanel being overlayed on top of the GeoChart).
If you guys want a picture of my app to visualise, please say so!
So I have this GUI
public ChangePokemonView(Controller c)
{
this.controller = c;
this.currentBattleEnvironment = currentBattleEnvironment.getInstance();
populateInactivePokemon(); //REMOVE LATER REMOVE LATER REMOVE LATER REMOVE LATER REMOVE LATER
this.pokemonList = new JList(inactivePlayerPokemon);
pokemonList.setSelectionMode(ListSelectionModel.SINGLE_SELECTION); //Only one thing can be selected at a time.
this.pokemonLabel = new JLabel("Choose your Pokemon!");
this.confirmSelection = new JButton("Confirm Selection");
this.confirmSelection.addActionListener(this);
setLayout(new BorderLayout());
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); //Closes GUI window when close, may need to change later
JPanel centerPanel = new JPanel(new GridLayout(3, 1));
centerPanel.add(pokemonLabel);
centerPanel.add(pokemonList);
centerPanel.add(confirmSelection);
add("Center", centerPanel);
pack();
setVisible(true);
}
That just creates a list of items and a button. When the button is clicked, it will get the selected item and return it to a controller to then process it (in that, for our project it changes the players pokemon).
*/
#Override
public void actionPerformed(ActionEvent event)
{
if (event.getSource() == confirmSelection)
{
this.pokemonSelected = (String) pokemonList.getSelectedValue();
this.controller.setCurrentPokemon(this.pokemonSelected);
//JOptionPane.showConfirmDialog(null, "You pressed: "+output); //USED FOR TESTING, THIS WILL OUPUT JUST THE NAME THAT WAS SELECTED
}
}
The setCurrentPokemon has nothing really in it with the controller. I am just trying to make sure it can get the selection right now. However I am having trouble with the rest of the code waiting till the selection is made.
I thought Swing and input in general with Java should pause and wait for the input before moving on with the rest of the code. However, right now it runs opens the selection menu but then sets the selected pokemon to null in the controller. I thought about adding a while loop to kind of wait and get around this, but I feel like there is an easier way to do this built into Swing.
Is there a way so I can have the rest of my code wait until the button is selected and the action is handled?
Thanks in advance.
Use a JOptionPane. It will build the modal dialog and buttons for you. A modal dialog stops execution until it is closed.
Read the section from the Swing tutorial on How to Make Dialogs for more information and working examples.
add("Center", centerPanel);
Don't use "magic" values. The API will define the values that should be used. That is also not the way to add components to a Container. Instead you should be using:
add(centerPanel, BorderLayout.CENTER);
I am trying to create a wizard in java swing programatically.
On the wizard pane I have a next button and it has to perform multiple actions according to which panel is displayed on the wizard.
Is it possible to use java command pattern? may I know how?
thanks in advance.
the code i used for the wizard is
this.mainPanel.add(fileSelectionPane,"SELECT FILE");
this.mainPanel.add(sqlConnectionPane,"SQL CONNECTION");
this.mainPanel.add(devicePane,"PARSER");
this.mainPanel.add(detailsPane,"DISPLAY");
thisLayout.show(this.mainPanel,"SELECT FILE");
this.finishButton.setEnabled(false);
this.backButton.setEnabled(false);
if(newValue==1) {
this.thisLayout.show(this.mainPanel, "SQL CONNECTION");
this.nextButton.setEnabled(true);
this.nextButton.setText("Connect..");
this.cancelButton.setEnabled(true);
this.backButton.setEnabled(true);
}
if(newValue==2) {
this.thisLayout.show(this.mainPanel, "PARSER");
this.nextButton.setEnabled(true);
this.nextButton.setText("Parse..");
this.cancelButton.setEnabled(true);
this.backButton.setEnabled(true);
}
i want the next button to perform specific actions on SELECT FILE and SQL CONNECTION.
is it possible to use command patterns?
Ok, so, You add action listeners to buttons. These action listeners do something when an event occurs.
You want to change the functionality of the button depending on which panel is being displayed? Why not set a instance variable which reflects the state of the Wizard?
For example (roughly),
int state = 0; // home panel
change panel to help page, event listener is fire, set 'state' to 1. You are now tracking which panel is being displayed.
Now, in your original problem, when the button (the one you want multiple functionality with) fires, you can choose the action it will take based on the 'state' var.
have look at CardLayout
those cards put to the JDialog (JDialog has preimplemented by default BorderLayout) to the CENTER area
create a new JPanel and place there JButtons
JPanel with JButtons put to the SOUTH area
search here, on this forum, there are a few excelent examples for wizard or image previue based on CardLayout
try the following code for button:
JButton btn1;
btn1= new javax.swing.JButton();
btn1.setToolTipText("Submit");
btn1.setContentAreaFilled(false);
btn1.setBorderPainted(false);
btn1.setMargin(new java.awt.Insets(2, 2, 2, 2));
btn1.addActionListener(this);
btn1.setIcon(this.getIcons()[21]);
add(btn1); // add to Jpanel
btn1.setBounds(250,10, 12, 12);
public void actionPerformed(java.awt.event.ActionEvent evt) {
Object obj = evt.getSource();
if (obj == btn1) {
// your function on on click of button
return;
}
I am creating a GUI in which my home page has a button labelled "Welcome to the Panel"
The point is that when you press on this button, it will navigate to a new page where I will have other functions. My only problem is that I dont know the syntax or how that when clicking a button, it will navigate to new page.
JButton btn = new JButton("Welcome to the Panel");
btn.setActionListener(new ActionListener()
{
#Override
public void actionPerformed(ActionEvent e)
{
// Here you open the other window. You can use JFrame, JOptionPane or JDialog
}
});
button.addActionListener(new ActionListner()
{
public void actionPerformed(ActionEvent ae)
{
//code to show pane
}
});
You need to register an ActionListener on your button and inside that action listener you make that panel (the page) visible.
How you do that depends on your layout, i.e. with a CardLayout you'd show the corresponding card (here's the doc). Using other layouts you might have to replace a component, e.g. if you use a BorderLayout and your content is placed in the center, replace the center component with the panel you want to show.
Note that if you're not familiar with layout managers yet, you should first have a look at those before doing dynamic changes to the ui (like navigation etc.).
Basically I have a page with a button and listbox on it. When the button is clicked, I use a ClickHandler to add another item to the listbox. However, the listbox is not refreshed unless I use the browser refresh button. Is there a way to do this programmatically without refreshing the entire Window?
Thank you
The following code works for me without any manual refresh (tested on Firefox 3.6.12 and Safari 5.0.2 with GWT 2.0.3):
public void onModuleLoad() {
final RootPanel rootPanel = RootPanel.get();
final ListBox listBox = new ListBox();
listBox.addItem("Alpha");
rootPanel.add(listBox);
final Button button = new Button("Button");
button.addClickHandler(new ClickHandler() {
#Override
public void onClick(final ClickEvent event) {
listBox.addItem("Beta");
}
});
rootPanel.add(button);
}
Please test, if my code works for you, too. Is there something special about your code (or maybe you're using a different browser that behaves differently?)