Image Button without browser compatibility issue : Image Button « GWT « Java






Image Button without browser compatibility issue

package com.java2s.gwt.client;

import com.google.gwt.user.client.*;
import com.google.gwt.user.client.ui.*;
import com.google.gwt.core.client.*;

public class GWTClient implements EntryPoint{
  public void onModuleLoad() {
    RootPanel.get().add(new ImageButton("images/close.png",16,16));
  }
}
/*
 * Copyright 2006 Robert Hanson <iamroberthanson AT gmail.com>
 * 
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 * 
 *    http://www.apache.org/licenses/LICENSE-2.0
 * 
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

/**
 * Use an image as a button.  Allows for setting of on/off 
 * background color, border color, border width, and border 
 * style.  The "on" colors are used on mouse over.
 * 
 * @author rhanson
 */
class ImageButton extends PNGImage
{

    protected final static int ON_STATE = 1;
    protected final static int OFF_STATE = -1;
    private int state = OFF_STATE;
    
    private String onStyle = "gwl-ImageButton-On";
    private String offStyle = "gwl-ImageButton-Off";

    private Color backgroundOnColor = Color.NONE;
    private Color backgroundOffColor = Color.NONE;

    private Color borderOnColor = Color.BLACK;
    private Color borderOffColor = Color.NONE;
    
    private int borderOnWidth = 1;
    private int borderOffWidth = 0;
    
    private int paddingLeft = 0;
    private int paddingRight = 0;
    private int paddingTop = 0;
    private int paddingBottom = 0;
    
    private BorderStyleConstant borderOnStyle = BorderStyle.BORDER_STYLE_SOLID;
    private BorderStyleConstant borderOffStyle = BorderStyle.BORDER_STYLE_NONE;


    public ImageButton (String url, int width, int height)
    {
        super(url, width, height);
        setStyleName("gwl-image-button");
        setColors();
        init();
    }

    
    protected void init ()
    {
        addMouseListener(new MouseListenerAdapter(){

            public void onMouseEnter (Widget sender)
            {
                state = ON_STATE;
                setColors();
            }

            public void onMouseLeave (Widget sender)
            {
                state = OFF_STATE;
                setColors();
            }
        });
    }
    
    
    public boolean isOn ()
    {
        return state == ON_STATE;
    }
    
    /**
     * Updates the colors of the widget based on the state
     * and color settings. This is usually only used after 
     * setting one or more of the colors.
     */
    public void setColors ()
    {
        DOM.setStyleAttribute(getElement(), "paddingTop", getPaddingTopWidth() + "px");
        DOM.setStyleAttribute(getElement(), "paddingRight", getPaddingRightWidth() + "px");
        DOM.setStyleAttribute(getElement(), "paddingBottom", getPaddingBottomWidth() + "px");
        DOM.setStyleAttribute(getElement(), "paddingLeft", getPaddingLeftWidth() + "px");
        DOM.setStyleAttribute(getElement(), "borderWidth", getBorderWidth() + "px");
        DOM.setStyleAttribute(getElement(), "borderColor", getBorderColor().getHexValue());
        DOM.setStyleAttribute(getElement(), "borderStyle", getBorderStyle().getBorderStyleName());
        DOM.setStyleAttribute(getElement(), "backgroundColor", getBackgroundColor().getHexValue());
        setStyleName(getCssStyleName());
    }

    private String getCssStyleName ()
    {
        if (state == ON_STATE)
            return onStyle;
        else
            return offStyle;
    }


    private Color getBackgroundColor ()
    {
        if (state == ON_STATE)
            return backgroundOnColor;
        else
            return backgroundOffColor;
    }

    private BorderStyleConstant getBorderStyle ()
    {
        if (state == ON_STATE)
            return borderOnStyle;
        else
            return borderOffStyle;
    }

    private Color getBorderColor ()
    {
        if (state == ON_STATE)
            return borderOnColor;
        else
            return borderOffColor;
    }

    private int getBorderWidth ()
    {
        if (state == ON_STATE)
            return borderOnWidth;
        else
            return borderOffWidth;
    }

    private int getPaddingLeftWidth ()
    {
        int max = (borderOnWidth > borderOffWidth) ? borderOnWidth : borderOffWidth;
        
        if (state == ON_STATE) {
            return (max - borderOnWidth + paddingLeft);
        }
        else {
            return (max - borderOffWidth + paddingLeft);
        }
    }

    private int getPaddingRightWidth ()
    {
        int max = (borderOnWidth > borderOffWidth) ? borderOnWidth : borderOffWidth;
        
        if (state == ON_STATE) {
            return (max - borderOnWidth + paddingRight);
        }
        else {
            return (max - borderOffWidth + paddingRight);
        }
    }

    private int getPaddingTopWidth ()
    {
        int max = (borderOnWidth > borderOffWidth) ? borderOnWidth : borderOffWidth;
        
        if (state == ON_STATE) {
            return (max - borderOnWidth + paddingTop);
        }
        else {
            return (max - borderOffWidth + paddingTop);
        }
    }
    
    private int getPaddingBottomWidth ()
    {
        int max = (borderOnWidth > borderOffWidth) ? borderOnWidth : borderOffWidth;
        
        if (state == ON_STATE) {
            return (max - borderOnWidth + paddingBottom);
        }
        else {
            return (max - borderOffWidth + paddingBottom);
        }
    }
    
    /**
     * This method is under consideration for removal,
     * if you have an opion please comment on http://gwtwidgets.blogspot.com.
     */
    public void setMargin (int px)
    {
        DOM.setStyleAttribute(getElement(), "margin", px + "px");
    }
    
    /**
     * This method is under consideration for removal,
     * if you have an opion please comment on http://gwtwidgets.blogspot.com.
     */
    public void setHorizontalMargin (int px)
    {
        DOM.setStyleAttribute(getElement(), "marginLeft", px + "px");
        DOM.setStyleAttribute(getElement(), "marginRight", px + "px");
    }

    /**
     * This method is under consideration for removal,
     * if you have an opion please comment on http://gwtwidgets.blogspot.com.
     */
    public void setVerticleMargin (int px)
    {
        DOM.setStyleAttribute(getElement(), "marginTop", px + "px");
        DOM.setStyleAttribute(getElement(), "marginBotom", px + "px");
    }

    /**
     * This method is under consideration for removal,
     * if you have an opion please comment on http://gwtwidgets.blogspot.com.
     */
    public Color getBackgroundOffColor ()
    {
        return backgroundOffColor;
    }

    /**
     * This method is under consideration for removal,
     * if you have an opion please comment on http://gwtwidgets.blogspot.com.
     */
    public void setBackgroundOffColor (Color backgroundOffColor)
    {
        this.backgroundOffColor = backgroundOffColor;
    }

    /**
     * This method is under consideration for removal,
     * if you have an opion please comment on http://gwtwidgets.blogspot.com.
     */
    public Color getBackgroundOnColor ()
    {
        return backgroundOnColor;
    }

    /**
     * This method is under consideration for removal,
     * if you have an opion please comment on http://gwtwidgets.blogspot.com.
     */
    public void setBackgroundOnColor (Color backgroundOnColor)
    {
        this.backgroundOnColor = backgroundOnColor;
    }

    /**
     * This method is under consideration for removal,
     * if you have an opion please comment on http://gwtwidgets.blogspot.com.
     */
    public Color getBorderOffColor ()
    {
        return borderOffColor;
    }

    /**
     * This method is under consideration for removal,
     * if you have an opion please comment on http://gwtwidgets.blogspot.com.
     */
    public void setBorderOffColor (Color borderOffColor)
    {
        this.borderOffColor = borderOffColor;
    }

    /**
     * This method is under consideration for removal,
     * if you have an opion please comment on http://gwtwidgets.blogspot.com.
     */
    public BorderStyleConstant getBorderOffStyle ()
    {
        return borderOffStyle;
    }

    /**
     * This method is under consideration for removal,
     * if you have an opion please comment on http://gwtwidgets.blogspot.com.
     */
    public void setBorderOffStyle (BorderStyleConstant borderOffStyle)
    {
        this.borderOffStyle = borderOffStyle;
    }

    /**
     * This method is under consideration for removal,
     * if you have an opion please comment on http://gwtwidgets.blogspot.com.
     */
    public int getBorderOffWidth ()
    {
        return borderOffWidth;
    }

    /**
     * This method is under consideration for removal,
     * if you have an opion please comment on http://gwtwidgets.blogspot.com.
     */
    public void setBorderOffWidth (int borderOffWidth)
    {
        this.borderOffWidth = borderOffWidth;
    }

    /**
     * This method is under consideration for removal,
     * if you have an opion please comment on http://gwtwidgets.blogspot.com.
     */
    public Color getBorderOnColor ()
    {
        return borderOnColor;
    }

    /**
     * This method is under consideration for removal,
     * if you have an opion please comment on http://gwtwidgets.blogspot.com.
     */
    public void setBorderOnColor (Color borderOnColor)
    {
        this.borderOnColor = borderOnColor;
    }

    /**
     * This method is under consideration for removal,
     * if you have an opion please comment on http://gwtwidgets.blogspot.com.
     */
    public BorderStyleConstant getBorderOnStyle ()
    {
        return borderOnStyle;
    }

    /**
     * This method is under consideration for removal,
     * if you have an opion please comment on http://gwtwidgets.blogspot.com.
     */
    public void setBorderOnStyle (BorderStyleConstant borderOnStyle)
    {
        this.borderOnStyle = borderOnStyle;
    }

    /**
     * This method is under consideration for removal,
     * if you have an opion please comment on http://gwtwidgets.blogspot.com.
     */
    public int getBorderOnWidth ()
    {
        return borderOnWidth;
    }

    /**
     * This method is under consideration for removal,
     * if you have an opion please comment on http://gwtwidgets.blogspot.com.
     */
    public void setBorderOnWidth (int borderOnWidth)
    {
        this.borderOnWidth = borderOnWidth;
    }

    protected int getState ()
    {
        return state;
    }

    protected void setState (int state)
    {
        this.state = state;
    }


    public String getOffStyle ()
    {
        return offStyle;
    }


    public void setOffStyle (String offStyle)
    {
        this.offStyle = offStyle;
    }


    public String getOnStyle ()
    {
        return onStyle;
    }


    public void setOnStyle (String onStyle)
    {
        this.onStyle = onStyle;
    }


}

/*
 * Copyright 2006 Robert Hanson <iamroberthanson AT gmail.com>
 * 
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 * 
 *    http://www.apache.org/licenses/LICENSE-2.0
 * 
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */


/**
 * Image widget that overcomes PNG browser incompatabilities.
 * Although meant for PNG images, it will work with any image
 * format supported by the browser.  If the image file ends
 * with ".png" or ".PNG" it will use the PNG specific routines,
 * otherwise will use generic non-PNG specific routines.
 * 
 * The URL, width, and height are required at the creation of the
 * widget, and may not be updated via the widget methogs.  Calling
 * setUrl() will throw a RuntimeException.  This is in part due to
 * the workarounds required for IE 5.5 and IE6.
 * 
 * @author rhanson
 */
 class PNGImage extends Image
{
    private PNGImageImpl impl;


    public PNGImage (String url, int width, int height)
    {
        impl = (PNGImageImpl) GWT.create(PNGImageImpl.class);
        
        setElement(impl.createElement(url, width, height));
        sinkEvents(Event.ONCLICK | Event.MOUSEEVENTS | Event.ONLOAD | Event.ONERROR);
    }

    
    public String getUrl ()
    {
        return impl.getUrl(this);
    }
   
    /**
     * Should not be used. Throws RuntimeException
     */
    public void setUrl (String url)
    {
        throw new RuntimeException("Not allowed to set url for a PNG image");
    }
}

/*
 * Copyright 2006 Robert Hanson <iamroberthanson AT gmail.com>
 * 
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 * 
 *    http://www.apache.org/licenses/LICENSE-2.0
 * 
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

 class PNGImageImpl
{
    
    public Element createElement (String url, int width, int height)
    {
        Element result = DOM.createImg();
        DOM.setAttribute(result, "src", url);
        DOM.setIntAttribute(result, "width", width);
        DOM.setIntAttribute(result, "height", height);
        return result;
    }

    public String getUrl (PNGImage image)
    {
        return DOM.getAttribute(image.getElement(), "src");
    }

}

/*
 * Copyright 2006 Robert Hanson <iamroberthanson AT gmail.com>
 * 
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 * 
 *    http://www.apache.org/licenses/LICENSE-2.0
 * 
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

class PNGImageImplIE6 extends PNGImageImpl
{
    private String url;
    private boolean isPng;

    
    public Element createElement (String url, int width, int height)
    {
        this.url = url;
    
        if (url.endsWith(".png") || url.endsWith(".PNG")) {
            isPng = true;
        }
        else {
            isPng = false;
        }
        
        if (isPng) {
            Element div = DOM.createDiv();
            DOM.setInnerHTML(div, "<span style=\"display:inline-block;width:" + width + "px;height:" + height + "px;filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + url + "', sizingMethod='scale')\"></span>");

            return DOM.getFirstChild(div);
        }
        else {
            return super.createElement(url, width, height);
        }
    }

    public String getUrl (PNGImage image)
    {
        if (isPng) {
            return url;
        }
        else {
            return super.getUrl(image);
        }
    }

    
}
public class BorderStyleConstant
{

        private String styleName;
        
        public BorderStyleConstant (String styleName)
        {
            this.styleName = styleName;
        }

        public String getBorderStyleName() {
            return styleName;
        }
        
}


 class BorderStyle
{
   
    
    final public static BorderStyleConstant BORDER_STYLE_NONE = new BorderStyleConstant("none");

    final public static BorderStyleConstant BORDER_STYLE_DOTTED = new BorderStyleConstant("dotted");

    final public static BorderStyleConstant BORDER_STYLE_DASHED = new BorderStyleConstant("dashed");

    final public static BorderStyleConstant BORDER_STYLE_SOLID = new BorderStyleConstant("solid");

    final public static BorderStyleConstant BORDER_STYLE_DOUBLE = new BorderStyleConstant("double");

    final public static BorderStyleConstant BORDER_STYLE_GROOVE = new BorderStyleConstant("groove");

    final public static BorderStyleConstant BORDER_STYLE_RIDGE = new BorderStyleConstant("ridge");

    final public static BorderStyleConstant BORDER_STYLE_INSET = new BorderStyleConstant("inset");

    final public static BorderStyleConstant BORDER_STYLE_OUTSET = new BorderStyleConstant("outset");

}

class Color
{
    public final static Color WHITE = new Color(255, 255, 255);
    public final static Color LIGHT_GRAY = new Color(192, 192, 192);
    public final static Color GRAY = new Color(128, 128, 128);
    public final static Color DARK_GRAY = new Color(64, 64, 64);
    public final static Color BLACK = new Color(0, 0, 0);
    public final static Color RED = new Color(255, 0, 0);
    public final static Color PINK = new Color(255, 175, 175);
    public final static Color ORANGE = new Color(255, 200, 0);
    public final static Color YELLOW = new Color(255, 255, 0);
    public final static Color GREEN = new Color(0, 255, 0);
    public final static Color MAGENTA = new Color(255, 0, 255);
    public final static Color CYAN = new Color(0, 255, 255);
    public final static Color BLUE = new Color(0, 0, 255);
    public static final Color NONE = new Color("");
    
    private int r, g, b;
    
    // only for special cases, like no color, or maybe named colors
    private String colorText = null;

    private Color (String colorText) {
        this.colorText = colorText;
    }

    public Color (int r, int g, int b)
    {
        this.r = r;
        this.g = g;
        this.b = b;
    }

    public int getRed ()
    {
        return r;
    }

    public int getGreen ()
    {
        return g;
    }

    public int getBlue ()
    {
        return b;
    }

    public String getHexValue ()
    {
        if (colorText != null) {
            return colorText;
        }

        return "#"
            + pad(Integer.toHexString(r))
            + pad(Integer.toHexString(g))
            + pad(Integer.toHexString(b));
    }

    private String pad (String in)
    {
        if (in.length() == 0) {
            return "00";
        }
        if (in.length() == 1) {
            return "0" + in;
        }
        return in;
    }

    public String toString ()
    {
        if (colorText != null) {
            return colorText;
        }
        return "red=" + r + ", green=" + g + ", blue=" + b;
    }
}



           
       








GWT-ImageButton.zip( 6 k)

Related examples in the same category