001/* 002 * #%L 003 * GwtMaterial 004 * %% 005 * Copyright (C) 2015 - 2017 GwtMaterialDesign 006 * %% 007 * Licensed under the Apache License, Version 2.0 (the "License"); 008 * you may not use this file except in compliance with the License. 009 * You may obtain a copy of the License at 010 * 011 * http://www.apache.org/licenses/LICENSE-2.0 012 * 013 * Unless required by applicable law or agreed to in writing, software 014 * distributed under the License is distributed on an "AS IS" BASIS, 015 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 016 * See the License for the specific language governing permissions and 017 * limitations under the License. 018 * #L% 019 */ 020package gwt.material.design.client.ui; 021 022import com.google.gwt.dom.client.Document; 023import com.google.gwt.dom.client.Element; 024import com.google.gwt.dom.client.Style; 025import gwt.material.design.client.base.AbstractButton; 026import gwt.material.design.client.base.HasIcon; 027import gwt.material.design.client.base.HasSeparator; 028import gwt.material.design.client.base.mixin.ColorsMixin; 029import gwt.material.design.client.base.mixin.CssNameMixin; 030import gwt.material.design.client.base.mixin.ToggleStyleMixin; 031import gwt.material.design.client.constants.*; 032 033//@formatter:off 034 035/** 036 * We have included 740 Material Design Icons courtesy of Google. 037 * You can download them directly from the Material Design specs. 038 * <p> 039 * <h3>UiBinder Usage:</h3> 040 * <pre> 041 * {@code <m:MaterialIcon waves="LIGHT" iconType="POLYMER"/> 042 * <m:MaterialIcon waves="LIGHT" iconType="POLYMER" textColor="BLUE" type="CIRCLE"/> 043 * <m:MaterialIcon waves="LIGHT" iconType="POLYMER" backgroundColor="BLUE" textColor="WHITE" type="CIRCLE" tooltip="Tooltip" tooltipLocation="BOTTOM"/>} 044 * </pre> 045 * 046 * @author kevzlou7979 047 * @author Ben Dol 048 * @see <a href="http://www.google.com/design/icons/">Search Google Icons</a> 049 * @see <a href="http://gwtmaterialdesign.github.io/gwt-material-demo/#icons">Material Icons Documentation</a> 050 * @see <a href="https://material.io/icons/">Material Design Specification</a> 051 */ 052//@formatter:on 053public class MaterialIcon extends AbstractButton implements HasSeparator, HasIcon { 054 055 private CssNameMixin<MaterialIcon, IconPosition> positionMixin; 056 private CssNameMixin<MaterialIcon, IconSize> sizeMixin; 057 private ToggleStyleMixin<MaterialIcon> prefixMixin; 058 private ColorsMixin<MaterialIcon> iconColorMixin; 059 060 /** 061 * Creates an empty icon. 062 */ 063 public MaterialIcon() { 064 super(CssName.MATERIAL_ICONS); 065 } 066 067 /** 068 * Sets a simple icon with a given type. 069 */ 070 public MaterialIcon(IconType iconType) { 071 this(); 072 setIconType(iconType); 073 } 074 075 /** 076 * Sets an icon with backgroundColor. 077 */ 078 public MaterialIcon(IconType iconType, Color bgColor) { 079 this(); 080 setIconType(iconType); 081 setBackgroundColor(bgColor); 082 } 083 084 /** 085 * Sets an icon with textColor and backgroundColor. 086 */ 087 public MaterialIcon(IconType iconType, Color textColor, Color bgColor) { 088 this(); 089 setIconType(iconType); 090 setTextColor(textColor); 091 setBackgroundColor(bgColor); 092 } 093 094 public void setInnerText(String innerText) { 095 getElement().setInnerText(innerText); 096 } 097 098 @Override 099 protected Element createElement() { 100 return Document.get().createElement("i"); 101 } 102 103 @Override 104 public MaterialIcon getIcon() { 105 return this; 106 } 107 108 public IconType getIconType() { 109 return IconType.fromStyleName(getElement().getInnerText()); 110 } 111 112 @Override 113 public void setIconType(IconType icon) { 114 getElement().setInnerText(icon.getCssName()); 115 } 116 117 @Override 118 public void setIconPosition(IconPosition position) { 119 getPositionMixin().setCssName(position); 120 } 121 122 @Override 123 public void setIconSize(IconSize size) { 124 getSizeMixin().setCssName(size); 125 } 126 127 public IconSize getIconSize() { 128 return getSizeMixin().getCssName(); 129 } 130 131 @Override 132 public void setIconColor(Color iconColor) { 133 getIconColorMixin().setTextColor(iconColor); 134 } 135 136 @Override 137 public Color getIconColor() { 138 return getIconColorMixin().getTextColor(); 139 } 140 141 @Override 142 public void setIconFontSize(double size, Style.Unit unit) { 143 getElement().getStyle().setFontSize(size, unit); 144 } 145 146 @Override 147 public void setIconPrefix(boolean prefix) { 148 getPrefixMixin().setOn(prefix); 149 } 150 151 @Override 152 public boolean isIconPrefix() { 153 return getPrefixMixin().isOn(); 154 } 155 156 protected CssNameMixin<MaterialIcon, IconPosition> getPositionMixin() { 157 if (positionMixin == null) { 158 positionMixin = new CssNameMixin<>(this); 159 } 160 return positionMixin; 161 } 162 163 protected CssNameMixin<MaterialIcon, IconSize> getSizeMixin() { 164 if (sizeMixin == null) { 165 sizeMixin = new CssNameMixin<>(this); 166 } 167 return sizeMixin; 168 } 169 170 protected ToggleStyleMixin<MaterialIcon> getPrefixMixin() { 171 if (prefixMixin == null) { 172 prefixMixin = new ToggleStyleMixin<>(this, CssName.PREFIX); 173 } 174 return prefixMixin; 175 } 176 177 protected ColorsMixin<MaterialIcon> getIconColorMixin() { 178 if (iconColorMixin == null) { 179 iconColorMixin = new ColorsMixin<>(this); 180 } 181 return iconColorMixin; 182 } 183}