Important Notice - Forums is archived
To simplify things and help our users to be more productive, we have archived the current forum and focus our efforts on helping developers on Stack Overflow. You can post new questions on Stack Overflow or join our Discord channel.
Vaadin lets you build secure, UX-first PWAs entirely in Java.
Free ebook & tutorial.
PopupButton component
Henri Kerola:
Blagovest Biserov Bashev: Hi,
First of all - great add-on! :) It works very good. I have a problem with it though. My case is the following: I'm implementing a button bar which is basically a CssLayout, where I put my buttons. The thing is that I want to have a button count threshold, so if I have more than 5 buttons, the rest shall be hidden into the PopupButton. So far so good. When the buttons become too many I try to remove the button from the CssLayout and add it into the PopupButton container. The problem occures when I try to hide some button, that has already been added to the CssLayout and I just want to move it to the popup, then the button is not visualized. If the button that I try to add is let's say "new", I mean it has not been added anywhere before that, it is properly shown in the popup. Also I made an experiment If I "open" (popup.setPopupVisible(true)) the popup right after I add the button, it is also properly shown. Any ideas ?Regards! :)
Would be great if you can prepare a small test application that demonstrates the problem.
Hi Henri,
I prepared a demo app, I tried to simplify as much as possible and in the same time preserve the approach that I use, because that might be the problem.
Here is the application:
package com.example.popupbuttonproblem;
import com.vaadin.Application;
import com.vaadin.ui.Button;
import com.vaadin.ui.Window;
import com.vaadin.ui.Button.ClickEvent;
public class PopupbuttonproblemApplication
extends Application
implements Button.ClickListener
{
private Button hideInPopup;
private Button unhide;
private Button button1;
private Button button2;
private Button button3;
private Button button4;
private Button button5;
private Segment segment;
@Override
public void init()
{
Window mainWindow = new Window("Popupbuttonproblem Application");
setMainWindow(mainWindow);
button1 = new Button("Button 1");
button2 = new Button("Button 2");
button3 = new Button("Button 3");
button4 = new Button("Button 4");
button5 = new Button("Button 5");
disableSomeButtons();
segment = new Segment();
segment.setButtonsThreshold(2);
segment.addButton(button1);
segment.addButton(button2);
segment.addButton(button3);
segment.addButton(button4);
segment.addButton(button5);
hideInPopup = new Button("Enable More Buttons", this);
unhide = new Button("Disable buttons", this);
mainWindow.addComponent(segment);
mainWindow.addComponent(hideInPopup);
mainWindow.addComponent(unhide);
segment.recalculateLayout();
}
private void disableSomeButtons()
{
button1.setVisible(false);
button2.setVisible(false);
button5.setVisible(false);
}
private void enableSomeButtons()
{
button1.setVisible(true);
button2.setVisible(true);
button5.setVisible(true);
}
@Override
public void buttonClick(ClickEvent event)
{
if (event.getButton().equals(hideInPopup))
{
enableSomeButtons();
}
else if (event.getButton().equals(unhide))
{
disableSomeButtons();
}
segment.recalculateLayout();
}
}
What it does is basically create a new "Segment" which is my button bar and add some buttons in the button bar. Then I have two buttons "Enable More Buttons" and "Disable Buttons" that in a nutshell enable and disable some of the buttons and call Segment.recalculateLayout(), so when enabled the buttons become too many and some of them are hidden into the popup.
Here is the code of the Segment class:
package com.example.popupbuttonproblem;
import java.util.ArrayList;
import java.util.Iterator;
import java.util.LinkedHashSet;
import org.apache.commons.collections.IteratorUtils;
import org.vaadin.hene.popupbutton.PopupButton;
import com.vaadin.ui.AbstractComponent;
import com.vaadin.ui.Button;
import com.vaadin.ui.Component;
import com.vaadin.ui.CssLayout;
import com.vaadin.ui.VerticalLayout;
import com.vaadin.ui.Button.ClickEvent;
import com.vaadin.ui.Button.ClickListener;
public class Segment
extends CssLayout
{
private static final long serialVersionUID = -3927863829208310646L;
private static int DEFAULT_BUTTONS_THRESHOLD = 5;
private int buttonsThreshold;
private PopupButton popup;
private VerticalLayout popupLayout;
private LinkedHashSet<AbstractComponent> buttonsSet;
public Segment()
{
setImmediate(true);
buttonsSet = new LinkedHashSet<AbstractComponent>();
}
public void addButton(Button button)
{
if (!(button instanceof PopupButton))
{
buttonsSet.add(button);
}
}
private ArrayList<AbstractComponent> getVisibleButtons()
{
Component c = null;
ArrayList<AbstractComponent> visibleButtons = new ArrayList<AbstractComponent>();
for (Iterator<AbstractComponent> iterator = buttonsSet.iterator(); iterator.hasNext();)
{
c = iterator.next();
if (c.isVisible())
{
visibleButtons.add((AbstractComponent)c);
}
}
return visibleButtons;
}
public void setButtonsThreshold(int threshold)
{
buttonsThreshold = threshold;
}
private int getButtonsThreshold()
{
if (buttonsThreshold > 0)
{
return buttonsThreshold;
}
return DEFAULT_BUTTONS_THRESHOLD;
}
public void recalculateLayout()
{
removeAllComponents();
if (popupLayout != null)
{
popupLayout.removeAllComponents();
}
ArrayList<AbstractComponent> visibleButtons = getVisibleButtons();
if (visibleButtons.size() > getButtonsThreshold())
{
popup = null;
for (int j = 0; j < getButtonsThreshold(); j++)
{
addComponent((Button)IteratorUtils.toArray(visibleButtons.iterator())[j]);
}
for (int j = getButtonsThreshold(); j < visibleButtons.size(); j++)
{
hideInPopup((Button)IteratorUtils.toArray(visibleButtons.iterator())[j]);
}
}
else
{
for (int j = 0; j < visibleButtons.size(); j++)
{
addComponent((Button)IteratorUtils.toArray(visibleButtons.iterator())[j]);
}
}
}
private void hideInPopup(Button button)
{
if (popup == null || !popup.isVisible())
{
popup = addPopupButton("More");
}
addButton(button, popup);
}
public void addButton(Button b, final PopupButton popupButton)
{
if (popupLayout != null)
{
popupLayout.addComponent(b);
}
b.addListener(new ClickListener()
{
private static final long serialVersionUID = 4170589828529711781L;
@Override
public void buttonClick(ClickEvent event)
{
popupButton.setPopupVisible(false);
}
});
popupButton.requestRepaintRequests();
}
public PopupButton addPopupButton(String caption)
{
popup = new PopupButton(caption);
popup.setImmediate(true);
popupLayout = new VerticalLayout();
popupLayout.setWidth("80px");
popup.setComponent(popupLayout);
addComponent(popup);
return popup;
}
}
In a nutshell here I keep a set of all buttons that could be available for the button bar. From that set I get the buttons that are visible for the moment and if their count is more than the threshold I create a PopupButton and hide them into it. That logic is in method recalculateLayout().
So what happens when the app is started. Fist only "Button 3" and "Button 4" are visible. After clicking button "Enable More Buttons" "Button 1", "Button 2" and "Button 5" are enabled, so the visible buttons become more than the treshold so the popup appears and it should contain "Button 3", "Button 4" and "Button 5". The problem is that "Button 3" and "Button 4" are not displayed properly, because they have been added to the CssLayot and then moved to the popup. And "Button 5" is displayed properly, because it has never been added before.
I'm sorry for the long post, I know it sounds a little bit confusing. I attach the war, so you could run it and take a closer look.
Thaks for the help, I appreciate it ! :)
I was able to solve the problem by adding a PopupVisibilityListener and within it I call event.getPopupButton().requestRepaintAll();
popup.addPopupVisibilityListener(new PopupVisibilityListener()
{
public void popupVisibilityChange(PopupVisibilityEvent event)
{
if(event.isPopupVisible())
{
event.getPopupButton().requestRepaintAll();
}
}
});
Regards,
Blagovest