qml-app-developmentの標準アイコンはありますか?


11

私はqml-appを開発していますが、ボタンにアイコンを配置したいと思います。ubuntuの標準アイコンを使用して、アプリの実際のUbuntuの外観を取得したいと思います。これどうやってするの?


他の人のアイコンを使用したいですか?著作権に注意してください!アイコンは創造的な作品です。それは著作権で保護されています。そのため、まずそのアイコンに付属している著作権ライセンスを確認する必要があります。私が持っていた、このWebページを自分のブックマークに。Ubuntuの背後にあるビジネスであるCanonicalについてです。「Faenza」を雇って新しいアイコンを作成します。


確かに、APIはシステム全体のテーマからアイコンを取得する方法を提供する必要があります。なぜこれは閉じられたのですか?
-andrewsomething

回答:


8

公式のUbuntu TouchアイコンテーマはUbuntu Mobileと呼ばれ、ubuntu-mobile-iconsパッケージにインストールできます。提供されるアイコンのサンプルは次のとおりです。

Ubuntuモバイルアクションアイコン

コードでアイコンを使用するには、アイコンへのパスを使用します。たとえば、ツールバーボタンにアイコンを設定するには、次のような操作を行います。

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:// theme / reload"
nik90 14

4

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
        }

        }
    }
}

これにより、次のことが可能になります。

qml-icons-hello-world

AFAICT、これは実際にはFreedesktop Icon Theme Specificationで提供されるアイコンの完全なセットをサポートしていないようです。


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

ハート型のアイコンが付いたアクションボタンが表示されます。

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.