Je développe une application qml et je veux mettre des icônes sur les boutons. Je voudrais utiliser les icônes standard ubuntu pour obtenir le vrai look ubuntu pour mon application. Comment puis-je faire ceci?
Je développe une application qml et je veux mettre des icônes sur les boutons. Je voudrais utiliser les icônes standard ubuntu pour obtenir le vrai look ubuntu pour mon application. Comment puis-je faire ceci?
Réponses:
Le thème d'icônes Ubuntu Touch officiel s'appelle Ubuntu Mobile et est disponible pour l'installation dans le ubuntu-mobile-icons
package. Voici un exemple des icônes fournies:
Pour utiliser les icônes de votre code, utilisez simplement le chemin d'accès à l'icône. Par exemple, pour définir l'icône dans un bouton de barre d'outils, procédez comme suit:
ToolbarButton {
text: i18n.tr("Refresh")
iconSource: Qt.resolvedUrl("/usr/share/icons/ubuntu-mobile/actions/scalable/reload.svg")
}
Pour éviter d'avoir à répéter le chemin racine encore et encore, j'utilise généralement une petite fonction appelée getIcon
qui renvoie le chemin réel à une icône:
function getIcon(name) {
return Qt.resolvedUrl("/usr/share/icons/ubuntu-mobile/actions/scalable/" + name + ".svg")
}
L'exemple précédent serait alors:
ToolbarButton {
text: i18n.tr("Refresh")
iconSource: getIcon("reload")
}
Je viens juste de commencer barboter dans QML, mais il semble que le SDK Ubuntu fournit un moyen d'icônes d'accès du thème, le composant Icône. Voici un exemple Bonjour Worldish:
import QtQuick 2.0
import Ubuntu.Components 0.1
MainView {
id: root
objectName: "mainView"
width: units.gu(50)
height: units.gu(75)
property real margins: units.gu(2)
property real buttonWidth: units.gu(9)
Page {
title: i18n.tr("Icons!")
Column {
anchors {
fill: parent
margins: root.margins
}
spacing: units.gu(1)
Icon {
name: "call-start"
width: 48
height: 48
}
Icon {
name: "call-stop"
width: 48
height: 48
}
Icon {
name: "find"
width: 48
height: 48
}
}
}
}
Cela vous donne:
AFAICT, cela ne semble pas vraiment à soutenir l'ensemble des icônes fournies par l'icône Thème Freedesktop Spécification bien .....
Le thème par défaut pour Ubuntu mobile est Suru et les icônes sont situées dans /usr/share/icons/suru
Chacune des icônes peut être utilisée par son nom. Même des icônes en dehors du jeu d'icônes Suru.
Si le fichier est /usr/share/icons/suru/actions/scalable/like.svg
Le code pourrait être:
Action {
id: likeAction
iconName: "like" // the files name without file ending
text: "I like this"
}
Ce qui vous donne un bouton d'action avec une icône en forme de cœur.