グローバルにグラデーションカラーを定義する方法は？

Question

QMLにGradientがあります（下の例を参照）。 QMLで「＃1AD6FD」または「＃1D62F0」という色をグローバルに定義することはできますか？

gradient: Gradient { 
    GradientStop { position: 0.00; color: "#1AD6FD" } 
    GradientStop { position: 1.00; color: "#1D62F0" } 
} 

Answer 1

カスタムプロパティは、このような任意のQMLオブジェクトで定義できます。

Rectangle { 
    id: root 

    // you can define your on custom properties like this 
    property color gradientColor1: "#1AD6FD" 
    property color gradientColor2: "#1D62F0" 
} 

次に、idで定義されているオブジェクトにアクセスできる他のアイテムで使用します。

Item { 
    gradient: Gradient { 
     GradientStop { position: 0.00; color: root.gradientColor1 } 
     GradientStop { position: 1.00; color: root.gradientColor1 } 
    } 
} 

再利用したい場合は、グラデーション全体をグローバルに定義することもできます。

他のQMLファイルのプロパティにアクセスするには、それを行う方法が複数あります。 QMLルートオブジェクトにアクセスできる場合は、他のファイルからそのプロパティにアクセスすることもできます。また、QMLオブジェクト全体ではなく色値の定数を使用してグローバルJavaScriptライブラリを定義することもできます。

もう1つの簡単な方法は、プロジェクトのいくつかのグローバルプロパティで独立したQMLオブジェクトを定義し、他のQMLファイルにそれを参照するIDだけを含む、最も簡単な解決策です。

ただ、上記の長方形の例のようないくつかのプロパティを持つ空のQML-項目を定義し、それはあなただけのグローバルプロパティとして定義することができ、この

Rectangle { 
    id: root 

    // include your custom QML global item (GlobalProperties.qml) 
    GlobalProperties { 
     id: globalProperties 
    } 

    // then you can use it like before, i.e. 
    color: globalProperties.gradientColor1 // color prop from your GlobalProperties.qml 
}