All Downloads are FREE. Search and download functionalities are using the official Maven repository.

com.vaadin.polymer.iron.IronIconElement Maven / Gradle / Ivy

The newest version!
/*
 * This code was generated with Vaadin Web Component GWT API Generator, 
 * from iron-icon project by The Polymer Authors
 * that is licensed with http://polymer.github.io/LICENSE.txt license.
 */
package com.vaadin.polymer.iron;

import com.vaadin.polymer.elemental.*;
import com.google.gwt.core.client.JavaScriptObject;
import com.google.gwt.core.client.JsArray;
import jsinterop.annotations.JsOverlay;
import jsinterop.annotations.JsProperty;
import jsinterop.annotations.JsType;

/**
 * 

The iron-icon element displays an icon. By default an icon renders as a 24px square.

*

Example using src:

*
<iron-icon src="star.png"></iron-icon>
 * 
 * 
 * 

Example setting size to 32px x 32px:

*
<iron-icon class="big" src="big_star.png"></iron-icon>
 * 
 * <style is="custom-style">
 *   .big {
 *     --iron-icon-height: 32px;
 *     --iron-icon-width: 32px;
 *   }
 * </style>
 * 
 * 
 * 

The iron elements include several sets of icons.
To use the default set of icons, import iron-icons.html and use the icon attribute to specify an icon:

*
<link rel="import" href="/components/iron-icons/iron-icons.html">
 * 
 * <iron-icon icon="menu"></iron-icon>
 * 
 * 
 * 

To use a different built-in set of icons, import the specific iron-icons/<iconset>-icons.html, and
specify the icon as <iconset>:<icon>. For example, to use a communication icon, you would
use:

*
<link rel="import" href="/components/iron-icons/communication-icons.html">
 * 
 * <iron-icon icon="communication:email"></iron-icon>
 * 
 * 
 * 

You can also create custom icon sets of bitmap or SVG icons.

*

Example of using an icon named cherry from a custom iconset with the ID fruit:

*
<iron-icon icon="fruit:cherry"></iron-icon>
 * 
 * 
 * 

See iron-iconset and iron-iconset-svg for more information about
how to create a custom iconset.

*

See the iron-icons demo to see the icons available
in the various iconsets.

*

To load a subset of icons from one of the default iron-icons sets, you can
use the poly-icon tool. It allows you
to select individual icons, and creates an iconset from them that you can
use directly in your elements.

*

Styling

*

The following custom properties are available for styling:

* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
Custom propertyDescriptionDefault
--iron-iconMixin applied to the icon{}
--iron-icon-widthWidth of the icon24px
--iron-icon-heightHeight of the icon24px
--iron-icon-fill-colorFill color of the svg iconcurrentcolor
--iron-icon-stroke-colorStroke color of the svg iconnone
*/ @JsType(isNative=true) public interface IronIconElement extends HTMLElement { @JsOverlay public static final String TAG = "iron-icon"; @JsOverlay public static final String SRC = "iron-icon/iron-icon.html"; /** *

The name of the icon to use. The name should be of the form:
iconset_name:icon_name.

* * JavaScript Info: * @property icon * @type String * */ @JsProperty String getIcon(); /** *

The name of the icon to use. The name should be of the form:
iconset_name:icon_name.

* * JavaScript Info: * @property icon * @type String * */ @JsProperty void setIcon(String value); /** *

If using iron-icon without an iconset, you can set the src to be
the URL of an individual icon image file. Note that this will take
precedence over a given icon attribute.

* * JavaScript Info: * @property src * @type String * */ @JsProperty String getSrc(); /** *

If using iron-icon without an iconset, you can set the src to be
the URL of an individual icon image file. Note that this will take
precedence over a given icon attribute.

* * JavaScript Info: * @property src * @type String * */ @JsProperty void setSrc(String value); /** *

The name of the theme to used, if one is specified by the
iconset.

* * JavaScript Info: * @property theme * @type String * */ @JsProperty String getTheme(); /** *

The name of the theme to used, if one is specified by the
iconset.

* * JavaScript Info: * @property theme * @type String * */ @JsProperty void setTheme(String value); }




© 2015 - 2024 Weber Informatics LLC | Privacy Policy