Чи є стандартні піктограми для розробки qml-додатків?


11

Я розробляю додаток qml і хочу покласти піктограми на кнопки. Я хотів би використовувати стандартні піктограми ubuntu, щоб отримати реальний вигляд ubuntu свого додатка. Як я можу це зробити?


Ви хочете використовувати піктограми від когось іншого? Пам’ятайте про авторські права! Ікона - це творча робота. Це захищено авторським правом. Тому спочатку слід перевірити авторські ліцензії, які постачаються із цією піктограмою. Цю веб-сторінку я мав у своїх закладках. Йдеться про Canonical - бізнес, що стоїть за Ubuntu - наймає хлопця «Фаенза» для створення нових ікон.


Безумовно, api повинен забезпечити спосіб отримання значка з теми, що стосується системи. Чому це було закрито?
andrewsomething

Відповіді:


8

Офіційна тема значка Ubuntu Touch називається Ubuntu Mobile і доступна для встановлення в ubuntu-mobile-iconsпакеті. Ось зразок наданих піктограм:

Піктограми Ubuntu Mobile Action

Щоб використовувати піктограми у своєму коді, просто використовуйте шлях до ікони. Наприклад, щоб встановити значок на кнопці панелі інструментів, зробіть щось подібне до цього:

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")
}

3
Цю відповідь потрібно оновити. Правильний та офіційний спосіб використання значків - iconName: "reload" або iconSource: "image: // тема / reload"
nik90

4

Я тільки що почав робити дабл у QML, але схоже, що SDK Ubuntu надає спосіб доступу до піктограм із теми, компонента Icon. Ось приклад 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
        }

        }
    }
}

Це дає вам:

qml-іконки-привіт-світ

AFAICT, здається, це насправді не підтримує повний набір іконок, передбачених специфікацією теми Freedesktop Icon Theme, хоча .....


0

Темою для мобільних пристроїв Ubuntu за замовчуванням є Suru, і значки знаходяться в /usr/share/icons/suru

Будь-яка з піктограм може використовуватися на ім'я. Навіть іконки поза набором значків Суру.

Якщо файл є /usr/share/icons/suru/actions/scalable/like.svg

Код може бути:

Action {
    id: likeAction
    iconName: "like"    // the files name without file ending
    text: "I like this"
}

Що дає вам кнопку дії з піктограмою серця.

Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.