Czy są jakieś standardowe ikony do tworzenia aplikacji qml?

11

Tworzę aplikację qml i chcę umieścić ikony na przyciskach. Chciałbym użyć standardowych ikon ubuntu, aby uzyskać prawdziwy wygląd ubuntu mojej aplikacji. Jak mogę to zrobić?

application-development ubuntu-touch Oliver Heidbüchel
źródło
Chcesz użyć ikon od kogoś innego? Pamiętaj o prawach autorskich! Ikona jest dziełem kreatywnym. Jest chroniony prawem autorskim. Dlatego najpierw sprawdź licencję na prawa autorskie dołączoną do tej ikony. Miałem tę stronę w moich zakładkach. Chodzi o Canonical - firmę stojącą za Ubuntu - zatrudniającą faceta „Faenza” do tworzenia nowych ikon.
iloveubuntu.net/…
Daniel Holm
Z pewnością interfejs API musi umożliwiać uzyskanie ikony z motywu systemowego. Dlaczego to było zamknięte?
andrewsomething

Odpowiedzi:

8

Oficjalny motyw ikony Ubuntu Touch nazywa się Ubuntu Mobile i można go zainstalować w ubuntu-mobile-iconspakiecie. Oto przykładowe ikony:

Ikony Ubuntu Mobile Action

Aby użyć ikon w kodzie, wystarczy użyć ścieżki do ikony. Na przykład, aby ustawić ikonę na przycisku paska narzędzi, wykonaj coś podobnego do tego:

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

Aby uniknąć konieczności powtarzania ścieżki katalogu głównego, zwykle używam małej funkcji o nazwie, getIconktóra zwraca rzeczywistą ścieżkę do ikony:

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

Poprzedni przykład to:

ToolbarButton {
    text: i18n.tr("Refresh")
    iconSource: getIcon("reload")
}
wierzę
źródło
3
Ta odpowiedź musi zostać zaktualizowana. Prawidłowy i oficjalny sposób używania ikon to: iconName: „reload” lub iconSource: „image: // theme / reload”
nik90
4

Dopiero zacząłem zagłębiać się w QML, ale wygląda na to, że Ubuntu SDK zapewnia sposób na dostęp do ikon z motywu, komponentu Icon. Oto przykład 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
        }

        }
    }
}

To daje ci:

qml-icons-hello-world

AFAICT, to nie wydaje się w rzeczywistości obsługiwać pełnego zestawu ikon dostarczonych przez specyfikację motywu ikony Freedesktop .....

andrews coś
źródło
0

Domyślnym motywem dla Ubuntu Mobile jest Suru, a ikony znajdują się w /usr/share/icons/suru

Dowolną z ikon można użyć według nazwy. Nawet ikony poza zestawem ikon Suru.

Jeśli plik jest /usr/share/icons/suru/actions/scalable/like.svg

Kod może być:

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

Co daje ci przycisk akcji z ikoną serca.

Tłuszcz z żółwi
źródło