gwt小部件 - 互斥专用切换按钮

Question

我想要一个ToggleButton和RadioButton的混合。 我想要RadioButton的“互斥”部分，以及ToggleButton的gui外观和行为（向上和向下状态）。 是否已经存在？

Answer 1

我已经适应kirushik的解决方案，并创建了一个简单的“ToggleButtonPanel”小部件，该小部件可以接受任意数量的ToggleButtons（可能还有其他想要添加的小部件）以及您选择的面板（默认为VerticalPanel），并使按钮相互排斥。

这样做的好处在于，面板本身在单击按钮时触发ClickEvents。通过这种方式，您可以在一个clickHandler事件添加到ToggleGroupPanel，然后再确定使用event.getSource哪个按钮被点击（）

import java.util.ArrayList; 
import java.util.Iterator; 
import java.util.List; 

import com.google.gwt.event.dom.client.ClickEvent; 
import com.google.gwt.event.dom.client.ClickHandler; 
import com.google.gwt.event.dom.client.HasClickHandlers; 
import com.google.gwt.event.shared.HandlerRegistration; 
import com.google.gwt.user.client.ui.Composite; 
import com.google.gwt.user.client.ui.HasWidgets; 
import com.google.gwt.user.client.ui.Panel; 
import com.google.gwt.user.client.ui.ToggleButton; 
import com.google.gwt.user.client.ui.VerticalPanel; 
import com.google.gwt.user.client.ui.Widget; 

public class ToggleButtonPanel extends Composite implements HasWidgets, HasClickHandlers{ 

    public ToggleButtonPanel() { 
     this(new VerticalPanel()); 
    } 

    public ToggleButtonPanel(Panel panel){ 
     this.panel = panel; 
     initWidget(panel); 
    } 

    @Override 
    public void add(Widget w) { 
     if(w instanceof ToggleButton){ 
      ToggleButton button = (ToggleButton) w; 
      button.addClickHandler(handler); 
     } 
     panel.add(w); 
    } 

    @Override 
    public void clear() { 
     panel.clear(); 
    } 

    @Override 
    public Iterator<Widget> iterator() { 
     return panel.iterator(); 
    } 

    @Override 
    public boolean remove(Widget w) { 
     return panel.remove(w); 
    } 

    @Override 
    public void setWidth(String width) { 
     panel.setWidth(width); 
    }; 

    @Override 
    public void setHeight(String height) { 
     panel.setHeight(height); 
    } 

    private final Panel panel; 
    private ClickHandler handler = new ClickHandler(){ 
     @Override 
     public void onClick(ClickEvent event) { 
      Iterator<Widget> itr = panel.iterator(); 
      while(itr.hasNext()){ 
       Widget w = itr.next(); 
       if(w instanceof ToggleButton){ 
        ToggleButton button = (ToggleButton) w; 
        button.setDown(false); 
        if(event.getSource().equals(button)) { 
         button.setDown(true); 
        } 
       } 
      } 

      for(ClickHandler h : handlers){ 
       h.onClick(event); 
      } 
     } 
    }; 

    private List<ClickHandler> handlers = new ArrayList<ClickHandler>(); 
    @Override 
    public HandlerRegistration addClickHandler(final ClickHandler handler) { 
     handlers.add(handler); 
     return new HandlerRegistration() { 

      @Override 
      public void removeHandler() { 
       handlers.remove(handler); 
      } 
     }; 
    } 

} 

Answer 2

gwt-ext toggleButtons

“本实施例说明切换按钮，当点击时，这样的按钮切换它们的‘按下’状态。

的粗体，斜体和下划线切换按钮独立地相对于而其切换状态下操作文本对齐图标按钮属于同一个切换组，因此当其中一个点击时，先前按下的按钮将返回到其正常状态。“

Answer 3

这里是我的纯GWT的变体：

class ThreeStateMachine extends FlowPanel{ 
     // This is the main part - it will unset all the buttons in parent widget 
     // and then set only clicked one. 
     // One mutual handler works faster and is generally better for code reuse 
     private final ClickHandler toggleToThis = new ClickHandler() { 
       @Override 
       public void onClick(ClickEvent clickEvent) { 
        for(Widget b: ThreeStateMachine.this.getChildren()){ 
         ((ToggleButton)b).setDown(false); 
        } 
        ((ToggleButton)clickEvent.getSource()).setDown(true); 
       } 
      }; 

     private ThreeStateMachine() { // Create out widget and populat it with buttons 
      super(); 

      ToggleButton b = new ToggleButton("one"); 
      b.setDown(true); 
      b.addClickHandler(toggleToThis); 
      this.add(b); 

      b = new ToggleButton("two"); 
      b.addClickHandler(toggleToThis); 
      this.add(b); 

      b = new ToggleButton("three"); 
      b.addClickHandler(toggleToThis); 
      this.add(b); 
     } 
    } 

当然，one'll需要GWT-切换按钮的CSS样式的变体（-up悬停等）

Answer 4

我有东西是不是都在一个扩展库，而不是依赖于面板上像其他答案一样。定义这个管理按钮的类。我们正在为按钮添加一个新的点击监听器，这是除了您在“GUI Content”类中附加的任何点击处理程序以外。我不能复制和粘贴，所以希望它是合理的正确。

public class MutuallyExclusiveToggleButtonCollection { 

     List<ToggleButton> m_toggleButtons = new ArrayList<ToggleButton>(); 

     public void add(ToggleButton button) { 
      m_toggleButtons.add(button); 
      button.addClickListener(new ExclusiveButtonClickHandler()); 
    } 

    private class ExclusiveButtonClickHandler impelments ClickHandler { 
     public void onClick(ClickEvent event) { 
      for(ToggleButton button : m_toggleButtons) { 
      boolean isSource = event.getSource().equals(button); 
      button.setIsDown(isSource);  
     } 

    } 

    } 

Answer 5

在所有ToggleButton上注册一个额外的ClickHandler。 例如，ToggleButtons home，树，摘要，详细信息。

public class Abc extends Composite implements ClickHandler { 
     ToggleButton home, tree, summary, detail 
     public Abc() { 
      // all your UiBinder initializations... blah, blah.... 
      home.addClickHandler(this); 
      tree.addClickHandler(this); 
      summary.addClickHandler(this); 
      detail.addClickHandler(this); 
     } 
     @Override 
     public void onClick(ClickEvent p_event) { 
      Object v_source = p_event.getSource();   
      home.setDown(home==v_source); 
      tree.setDown(tree==v_source); 
      summary.setDown(summary==v_source); 
      detail.setDown(detail==v_source); 
     } 
} 

当然，你只需要添加其他所有的样板代码，并注册其他ClickHandlers每个切换按钮。

Answer 6

遇到了同样的需要，继承人另一种解决方案，与单独的处理器摒弃和UiBinder的与喜欢的声明很好地工作：

<my:RadioToggleButton buttonGroup="btnGroup" text="Button 1" /> 

这里的扩展类：

import java.util.HashMap; 

import com.google.gwt.event.dom.client.ClickEvent; 
import com.google.gwt.event.dom.client.ClickHandler; 
import com.google.gwt.uibinder.client.UiConstructor; 
import com.google.gwt.user.client.ui.ToggleButton; 

public class RadioToggleButton extends ToggleButton 
{ 
    private static HashMap<String,ButtonGroup> buttonGroups = new HashMap<>(); 
    private ButtonGroup buttonGroup; 

    public @UiConstructor RadioToggleButton(String buttonGroupName) 
    { 
     buttonGroup = buttonGroups.get(buttonGroupName); 
     if(buttonGroup == null){ 
      buttonGroups.put(buttonGroupName, buttonGroup = new ButtonGroup()); 
     } 
     buttonGroup.addButton(this); 
    } 

    @Override 
    public void setDown(boolean isDown) 
    { 
     if(isDown){ 
      RadioToggleButton btn = buttonGroup.pressedBtn; 
      if(btn != null){ 
       btn.setDown(false); 
      } 
      buttonGroup.pressedBtn = this; 
     } 
     super.setDown(isDown); 
    } 

    private class ButtonGroup implements ClickHandler 
    { 
     RadioToggleButton pressedBtn = null; 

     public void addButton(ToggleButton button) 
     { 
      button.addClickHandler(this); 
     } 

     @Override 
     public void onClick(ClickEvent event) 
     { 
      Object obj = event.getSource(); 
      if(pressedBtn != null){ 
       pressedBtn.setDown(false); 
      } 
      pressedBtn = (RadioToggleButton)obj; 
      pressedBtn.setDown(true); 
     } 
    } 
}