Icons are displayed using the VOnsIcon
component. In Onsen UI there are three families of icons available:
The icon is selected using the icon
prop. To use Material Icons the md-
prefix is used, ion-
for Ionicons and fa-
for Font Awesome.
<v-ons-icon icon="md-menu"></v-ons-icon>
The code above displays a Material Design menu icon.
For quick autostyling, one or more modifiers can be provided in the icon
prop with the corresponding icon name:
<v-ons-icon icon="ion-ios-menu, material:md-menu" size="12px, material: 18px"></v-ons-icon>
名前 | 型 / デフォルト値 | 概要 |
---|---|---|
fixed-width | Boolean | When used in a list, you want the icons to have the same width so that they align vertically by defining this attribute. (翻訳中) Optional. |
icon | String |
The icon name. |
rotate | Number | アイコンを回転して表示します。90, 180, 270から指定できます。 Optional. |
size | String |
The sizes of the icon. Valid values are lg, 2x, 3x, 4x, 5x, or in the size in pixels.
Icons can also be styled based on modifier presence. Add comma-separated icons with
will render as a |
spin | Boolean | アイコンを回転するかどうかを指定します。 Optional. |
Onsen UIに関する質問は、Stack Overflowにてonsen-uiタグを付与してください。Onsen UIチームはあなたの問題解決をお手伝いします。
バグ報告や機能要望については、GitHub Issuesに記載をお願いいたします。
あわせて、下記の情報も参考にしてください。