QML ToolIcon Element

Button-like component showing icon More...

Inherits Item

Inherited by ToolItem.

This element was introduced in qt-components 4.7.

Detailed Description

This is an Button-like component composed by an icon and supposed to be used inside a ToolBar.

Next example shows how to use ToolIcons inside a Page component.

 ToolBarLayout {
     id: commonTools
     ToolIcon { iconId: "toolbar-back"; onClicked: { myMenu.close(); pageStack.pop(); } }
     ToolIcon { iconId: "toolbar-view-menu"; onClicked: (myMenu.status == DialogStatus.Closed) ? myMenu.open() : myMenu.close() }
 }

Icons naming convention

• icon-m-toolbar-settings-white (idle state on dark toolbars)
• icon-m-toolbar-settings-white-selected (selected state on dark toolbar)
• icon-m-toolbar-settings-dimmed-white (disabled state on dark toolbar)
• icon-m-toolbar-settings (idle state on bright toolbar)
• icon-m-toolbar-settings-selected (selected state on bright toolbar)
• icon-m-toolbar-settings-dimmed (disabled state on bright toolbar)

Default iconId's which are available for use (The list only contains the idle states for bright and dark toolbars)

• toolbar-add
• toolbar-addressbook
• toolbar-alarm
• toolbar-all-content
• toolbar-application
• toolbar-attachment
• toolbar-back-landscape
• toolbar-back
• toolbar-backspace
• toolbar-bold
• toolbar-callhistory
• toolbar-cancle
• toolbar-captured
• toolbar-clock
• toolbar-close
• toolbar-column
• toolbar-contact
• toolbar-content-audio
• toolbar-content-ovi-music
• toolbar-cut-paste
• toolbar-delete
• toolbar-dialer
• toolbar-directory-move-to
• toolbar-directory
• toolbar-done
• toolbar-down
• toolbar-edit
• toolbar-favorite-mark
• toolbar-favorite-unmark
• toolbar-forward
• toolbar-gallery
• toolbar-grid
• toolbar-home
• toolbar-image-edit
• toolbar-jump-to
• toolbar-list
• toolbar-main-view
• toolbar-mediacontrol-backwards
• toolbar-mediacontrol-forward
• toolbar-mediacontrol-next
• toolbar-mediacontrol-pause
• toolbar-mediacontrol-play
• toolbar-mediacontrol-previous
• toolbar-mediacontrol-stop
• toolbar-new-chat
• toolbar-new-message
• toolbar-next
• toolbar-pages-all
• toolbar-people
• toolbar-previous
• toolbar-redo
• toolbar-refresh
• toolbar-repeat
• toolbar-reply-all
• toolbar-reply
• toolbar-rich-text-view-menu
• toolbar-rich-text
• toolbar-search
• toolbar-select-text
• toolbar-settings
• toolbar-share
• toolbar-shuffle
• toolbar-stop
• toolbar-tab-next
• toolbar-tab-previous
• toolbar-tag
• toolbar-tools
• toolbar-trim
• toolbar-underline
• toolbar-undo
• toolbar-up
• toolbar-update
• toolbar-view-menu
• toolbar-volume-off
• toolbar-volume

See also ToolBar and ToolBarLayout.