Question

我已按照这篇文章的说明进行操作 ImageButton in gwt 创建我自己的圆形按钮，它在视觉上看起来很好。我现在要做的是为这个新类添加点击处理程序。我怎么能这样做？我需要两个图像和标签的点击处理程序吗？那么我该怎么做才能使用CSS配置这个组件？

到目前为止，这是我的代码。

    public class RoundButton extends Composite
    {
        protected final Label textHolder = new Label("helasdfasdf");
        protected final Image leftSide = new Image( "/icons/left.ico" );
        protected final Image rightSide = new Image( "/icons/right.ico" );
        protected final HorizontalPanel contentTable;

        public RoundButton()
        {
            contentTable = new HorizontalPanel();
            initWidget( contentTable );
            contentTable.add(leftSide);
            contentTable.add(textHolder);
            contentTable.add(rightSide);
        }

        public void setText( String text )
        {
            textHolder.setText(text);
        }   
    }

Answer 1

为了使你的RoundButton更加标准化，我将实现com.google.gwt.event.dom.client.HasClickHandlers接口并将click事件添加到整个组件（即包装器小部件）：

public class RoundButton extends Composite implemens HasClickHandlers
{
    protected final Label textHolder = new Label("helasdfasdf");
    protected final Image leftSide = new Image( "/icons/left.ico" );
    protected final Image rightSide = new Image( "/icons/right.ico" );
    protected final HorizontalPanel contentTable;

    public RoundButton()
    {
        contentTable = new HorizontalPanel();
        initWidget( contentTable );
        contentTable.add(leftSide);
        contentTable.add(textHolder);
        contentTable.add(rightSide);
    }

    public void setText( String text )
    {
        textHolder.setText(text);
    }   


    public HandlerRegistration addClickHandler(ClickHandler handler)
    {
        return addDomHandler(handler, ClickEvent.getType());         
    }  

}

Answer 2

您可以像这样抓住复合材料的点击次数：

public RoundButton()
{
    ...
    sinkEvents(Event.ONCLICK);
}

@Override
public void onBrowserEvent(Event event)
{
    super.onBrowserEvent(event);
    if (DOM.eventGetType(event) == Event.ONCLICK)
    {
        ...
    }
}

使用GWT创建圆角按钮

2 个答案: