Esistono icone standard per lo sviluppo di app qml?

11

Sto sviluppando un'app qml e voglio mettere icone sui pulsanti. Vorrei usare le icone standard di Ubuntu per ottenere il vero look di Ubuntu per la mia app. Come posso fare questo?

application-development ubuntu-touch

— Oliver Heidbüchel
fonte

Vuoi usare le icone di qualcun altro? Attenzione al copyright! Un'icona è un'opera creativa. È protetto da copyright. Quindi dovresti prima controllare la licenza di copyright fornita con quell'icona. Ho avuto questa pagina web tra i miei segnalibri. Si tratta di Canonical - il business dietro Ubuntu - assumere il ragazzo "Faenza" per creare nuove icone.

iloveubuntu.net/…

— Daniel Holm l'

Sicuramente, l'API deve fornire un modo per ottenere un'icona dal tema del sistema. Perché è stato chiuso?

— Andrewsomething

8

Il tema ufficiale dell'icona di Ubuntu Touch si chiama Ubuntu Mobile ed è disponibile per l'installazione nel ubuntu-mobile-iconspacchetto. Ecco un esempio delle icone fornite:

Icone di Ubuntu Mobile Action

Per utilizzare le icone nel codice, basta usare il percorso dell'icona. Ad esempio, per impostare l'icona in un pulsante della barra degli strumenti, fare qualcosa di simile a questo:

ToolbarButton {
    text: i18n.tr("Refresh")
    iconSource: Qt.resolvedUrl("/usr/share/icons/ubuntu-mobile/actions/scalable/reload.svg")
}

Per evitare di dover ripetere ripetutamente il percorso di root, di solito uso una piccola funzione chiamata getIconche restituisce il percorso effettivo a un'icona:

function getIcon(name) {
    return Qt.resolvedUrl("/usr/share/icons/ubuntu-mobile/actions/scalable/" + name + ".svg")
}

L'esempio precedente sarebbe quindi:

ToolbarButton {
    text: i18n.tr("Refresh")
    iconSource: getIcon("reload")
}

— Credo
fonte

3

Questa risposta deve essere aggiornata. Il modo corretto e ufficiale di usare le icone è, iconName: "ricaricare" o icon Fonte: "immagine: // tema / ricaricare"

— nik90

4

Ho appena iniziato a dilettarmi in QML, ma sembra che Ubuntu SDK offra un modo per accedere alle icone dal tema, il componente Icona. Ecco un esempio 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
        }

        }
    }
}

Questo ti dà:

QML-icons-ciao-mondo

AFAICT, questo in realtà non sembra supportare l'intero set di icone fornito dalla specifica del tema dell'icona di Freedesktop però .....

— andrewsomething
fonte

0

Il tema predefinito per Ubuntu mobile è Suru e le icone si trovano in /usr/share/icons/suru

Qualsiasi icona può essere utilizzata per nome. Anche icone al di fuori del set di icone Suru.

Se il file è /usr/share/icons/suru/actions/scalable/like.svg

Il codice potrebbe essere:

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

Che ti dà un pulsante di azione con un'icona a forma di cuore.

— Horselover Fat
fonte