← Back to team overview

ubuntu-phone team mailing list archive

Re: Add image for toolbar buttons?

 

The icons do show up in 13.10 with the mobile icons installed.
We use this bit of code:

*in our main.qml*

  function getIcon(name, type) {
        if (type === undefined)
            type = "actions"

return "/usr/share/icons/ubuntu-mobile/" + type + "/scalable/" + name + ".svg"
    }

*in our page that uses the toolbar*

ToolbarButton {
            id: goToButton
            iconSource: getIcon("location")
            text: i18n.tr("Go To")
            onTriggered: {
PopupUtils.open(Qt.resolvedUrl("GoToDialog.qml"), goToButton)
            }
        }

I assume this will also work on the phone, as the filesystem is supposed to be the same. Correct me if I am wrong, though.. It does seem that using your method will future-proof moving icons, though.... Does it work with the icons installed though. Since these apps are to be cross platform (cross device?), I think this would be needed, in order for these apps to be truly device independant

On 11/02/2013 01:41 AM, Matt Austin wrote:
On 31 October 2013 21:24, Sam Bull <sam.hacking@xxxxxxxx> wrote:
OK, so how do I actually use this in a toolbar button? The documentation
says it only has an iconSource attribute, which doesn't support an Icon
component, and all the examples use Qt.resolvedUrl("foo.png").
Hi Sam,

I had the same problem - I don't think the docs are very clear on how
to use the theme icons with toolbar buttons.

After some experimentation, I got the following to work:

     tools: ToolbarItems {
         ToolbarButton {
             action: Action {
                 text: 'Refresh'
                 iconSource: Qt.resolvedUrl('image://theme/reload')
                 onTriggered: {}
             }
         }
     }

I can replace 'reload' with any of the standard ubuntu mobile icons
(located at: /usr/share/icons/ubuntu-mobile ) - just remember to leave
off the the file extension.

Also be aware that it won't work on your desktop machine, as the
ubuntu mobile theme isn't in use - the icons only displayed on the
device itself when I was testing.




--
Regards


Follow ups

References