Drawer QML Type

スワイプジェスチャーで開閉できるサイドパネル。詳細...

• 継承されたメンバーを含む全メンバーのリスト

プロパティ

• dragMargin : real
• edge : enumeration
• interactive : bool (since QtQuick.Controls 2.2 (Qt 5.9))
• position : real

詳細説明

Drawer は、ナビゲーションの中心的な場所を提供するためにタッチインターフェースでよく使用されるものに似た、スワイプベースのサイドパネルを提供します。

Drawer は、コンテンツ アイテムの 4 つの端のいずれかに配置できます。上のドロワーはウィンドウの左端に配置されています。引き出しは、ウィンドウの左端から「ドラッグ」することで開かれます。

import QtQuick
import QtQuick.Controls

ApplicationWindow {
    id: window
    visible: true

    Drawer {
        id: drawer
        width: 0.66 * window.width
        height: window.height

        Label {
            text: "Content goes here!"
            anchors.centerIn: parent
        }
    }
}

ドロワーは特別なタイプのポップアップで、ウィンドウedges のひとつに存在します。デフォルトでは、ドロワーはウィンドウoverlay に再度ペアレントするため、ウィンドウ座標で動作します。手動でparent を他のものに設定して、ドロワーを特定の座標空間で動作させることも可能です。

Drawer はそのウィンドウ辺の一部だけを覆うように設定できる。次の例は、ウィンドウヘッダの下に現れるように Drawer を配置する方法を示しています：

import QtQuick
import QtQuick.Controls

ApplicationWindow {
    id: window
    visible: true

    header: ToolBar { }

    Drawer {
        y: header.height
        width: window.width * 0.6
        height: window.height - header.height
    }
}

position プロパティは、0.0 と1.0 の間の値として、ドロワーがどの程度見えるかを決定します。ウィンドウの左端や右端にドロワーの x 座標（または水平マージン）を設定したり、ウィンドウの上端や下端にドロワーの y 座標（または垂直マージン）を設定することはできません。

上の画像では、アプリケーションのコンテンツは画面全体に「押されて」います。これは、コンテンツに平行移動を適用することで実現しています：

import QtQuick
import QtQuick.Controls

ApplicationWindow {
    id: window
    width: 200
    height: 228
    visible: true

    Drawer {
        id: drawer
        width: 0.66 * window.width
        height: window.height
    }

    Label {
        id: content

        text: "Aa"
        font.pixelSize: 96
        anchors.fill: parent
        verticalAlignment: Label.AlignVCenter
        horizontalAlignment: Label.AlignHCenter

        transform: Translate {
            x: drawer.position * content.width * 0.33
        }
    }
}

もしアプリケーションの内容がドロワーを開いたときの位置に留まるようにしたい場合は、トランスレーションを適用しないでください。

Drawer は、Drawernon-modal とnon-interactive を作成することで、永続的なサイドパネルとして設定できます。詳細はGalleryの例を参照してください。

SwipeView 、Drawerのカスタマイズ、ナビゲーションコントロール、ポップアップコントロールも参照してください 。

プロパティ・ドキュメント

dragMargin : real

このプロパティは、ドラッグ操作でドロワーを開くことができる画面端からの距離を保持する。この値を0 以下に設定すると、ドラッグ操作でドロワーを開くことができなくなる。

デフォルト値はApplication.styleHints.startDragDistance です。

interactiveも参照してください 。

edge : enumeration

このプロパティは、引き出しが開くウィンドウの端を保持する。許容される値は

interactive : bool [since QtQuick.Controls 2.2 (Qt 5.9)]

このプロパティは、ドロワーがインタラクティブかどうかを保持する。非対話型ドロワーはスワイプに反応しない。

デフォルト値はtrue です。

このプロパティは QtQuick.Controls 2.2 (Qt 5.9) で導入されました。

dragMarginも参照してください 。

position : real

このプロパティは、最終目的地に対する引出しの相対位置を保持する。つまり、引出しが完全に閉じたときの位置は0.0 となり、完全に開いたときの位置は1.0 となる。