ユニバーサルスタイル

ユニバーサルスタイルは、Microsoftのユニバーサルデザインガイドラインに基づいています。詳細...

関連プロパティ

• accent: color
• background: color
• foreground: color
• テーマ: 列挙型

関連メソッド

• colorcolor(列挙型 predefined)

詳細な説明

「ユニバーサル」スタイルは、Microsoftのユニバーサルデザインガイドラインに基づいた、デバイスに依存しないスタイルです。このスタイルは、スマートフォンやタブレットからPCに至るまで、あらゆるデバイスで見栄えがよいように設計されています。

ユニバーサル スタイルでアプリケーションを実行するには、「 Qt Quick コントロールでのスタイルの使用」を参照してください。

カスタマイズ

ユニバーサルスタイルでは、テーマ、アクセント、前景色、背景色の4つの属性をカスタマイズできます。

これらの属性はいずれも、任意のウィンドウやアイテムに対して指定することができ、fonts と同様に、子要素へ自動的に継承されます。次の例では、ウィンドウと3つのラジオボタンすべてが、紫色のアクセント色を使用したダークテーマで表示されています：

import QtQuick
import QtQuick.Controls
import QtQuick.Controls.Universal

ApplicationWindow {
    visible: true

    Universal.theme: Universal.Dark
    Universal.accent: Universal.Violet

    Column {
        anchors.centerIn: parent

        RadioButton { text: qsTr("Small") }
        RadioButton { text: qsTr("Medium");  checked: true }
        RadioButton { text: qsTr("Large") }
    }
}

QMLで属性を指定するほか、環境変数や設定ファイルを介して指定することも可能です。QMLで指定された属性は、他のすべての指定方法よりも優先されます。

設定ファイル

設定ファイルの詳細については、「Qt Quick コントロール設定ファイル」を参照してください。

環境変数

サポートされている環境変数の完全なリストについては、『Qt Quick コントロール』の「サポートされている環境変数」を参照してください。

依存関係

Universal スタイル固有の属性を利用するには、Universal スタイルを別途インポートする必要があります。なお、Universal スタイルへの参照の有無にかかわらず、同じアプリケーションコードは他のどのスタイルでも実行されます。Universal スタイル固有の属性は、アプリケーションが Universal スタイルで実行された場合にのみ効果を発揮します。

常に読み込まれるQMLファイルにUniversalスタイルがインポートされている場合、アプリケーションがどのスタイルで実行されても問題なく動作させるためには、Universalスタイルをアプリケーションと一緒にデプロイする必要があります。ファイルセレクタを使用することで、スタイルへのハードな依存関係を作成することなく、スタイル固有の調整を適用することができます。

定義済みのユニバーサルカラー

利用可能な定義済みカラー：

「基本スタイル」、「マテリアルスタイル」も参照

関連するプロパティのドキュメント

このアタッチドプロパティは、テーマのアクセントカラーを保持します。このプロパティは、任意のウィンドウやアイテムにアタッチできます。値は子要素に伝播されます。

デフォルト値はUniversal.Cobalt です。

次の例では、ハイライトされたボタンのアクセントカラーがUniversal.Orange に変更されています：

Button {
    text: qsTr("Button")
    highlighted: true
    Universal.accent: Universal.Orange
}

このアタッチドプロパティは、テーマの背景色を保持します。このプロパティは、任意のウィンドウやアイテムにアタッチできます。値は子要素に伝播されます。

デフォルト値はテーマごとに異なります（ライトまたはダーク）。

次の例では、ペインの背景色をUniversal.Steel に変更しています：

Pane {
    Universal.background: Universal.Steel

    Button {
        text: qsTr("Button")
    }
}

このアタッチドプロパティは、テーマのフォアグラウンド色を保持します。このプロパティは、任意のウィンドウやアイテムにアタッチできます。値は子要素に伝播されます。

デフォルト値はテーマによって異なります（ライトまたはダーク）。

次の例では、ボタンの前景色がUniversal.Pink に設定されています：

Button {
    text: qsTr("Button")
    Universal.foreground: Universal.Pink
}

このアタッチドプロパティは、テーマがライトかダークかを保持します。このプロパティは、任意のウィンドウやアイテムにアタッチできます。値は子要素に伝播されます。

利用可能なテーマ：

テーマをSystem に設定すると、システムのテーマカラーに基づいてライトテーマまたはダークテーマのいずれかが選択されます。ただし、themeプロパティの値を読み取る場合、その値はSystem になることはなく、実際のテーマの値になります。

次の例では、ペインとボタンの両方のテーマが `Universal.Dark` に設定されています：

Pane {
    Universal.theme: Universal.Dark

    Button {
        text: qsTr("Button")
    }
}

添付のメソッドドキュメント

この添付メソッドは、指定された事前定義済みのユニバーサルカラーの有効な色値を返します。

Rectangle {
    color: Universal.color(Universal.Red)
}

関連情報

• Qt Quick コントロールのスタイル設定