![qml-app-development 有任何标准图标吗?](https://linux22.com/image/967032/qml-app-development%20%E6%9C%89%E4%BB%BB%E4%BD%95%E6%A0%87%E5%87%86%E5%9B%BE%E6%A0%87%E5%90%97%EF%BC%9F.png)
我正在开发一个 qml 应用程序,我想在按钮上放置图标。我想使用 ubuntu 标准图标来让我的应用程序获得真正的 ubuntu 外观。我该怎么做?
答案1
Ubuntu Touch 的官方图标主题名为 Ubuntu Mobile,可在ubuntu-mobile-icons
软件包中安装。以下是所提供图标的示例:
要在代码中使用图标,只需使用图标的路径即可。例如,要在工具栏按钮中设置图标,请执行类似以下操作:
ToolbarButton {
text: i18n.tr("Refresh")
iconSource: Qt.resolvedUrl("/usr/share/icons/ubuntu-mobile/actions/scalable/reload.svg")
}
为了避免一遍又一遍地重复根路径,我通常使用一个小函数来getIcon
返回图标的实际路径:
function getIcon(name) {
return Qt.resolvedUrl("/usr/share/icons/ubuntu-mobile/actions/scalable/" + name + ".svg")
}
那么前面的例子将是:
ToolbarButton {
text: i18n.tr("Refresh")
iconSource: getIcon("reload")
}
答案2
我刚刚开始涉足 QML,但看起来 Ubuntu SDK 提供了一种从主题访问图标的方法,图标组件。以下是一个 Hello 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
}
}
}
}
这将为您提供:
据我所知,这实际上似乎并不支持 Freedesktop 图标主题规范提供的全套图标.....
答案3
Ubuntu 移动版的默认主题是 Suru,图标位于/usr/share/icons/suru
任何图标都可以通过名称使用。即使是 Suru 图标集之外的图标。
如果文件是/usr/share/icons/suru/actions/scalable/like.svg
代码可能是:
Action {
id: likeAction
iconName: "like" // the files name without file ending
text: "I like this"
}
它会给你一个带有心形图标的操作按钮。