SafeArea QML Type (Uncreatable)

アイテムまたはウィンドウのセーフエリアのプロパティへのアクセスを提供します。詳細...

注：これは生成不可能な型です。QML ではインスタンス化できません。

• 継承されたメンバーを含む、すべてのメンバーの一覧

プロパティ

• additionalMargins
  • additionalMargins.bottom : real
  • additionalMargins.left : real
  • additionalMargins.right : real
  • additionalMargins.top : real
• margins
  • margins.bottom : real
  • margins.left : real
  • margins.right : real
  • margins.top : real

詳細説明

SafeArea アタッチメント型は、アイテムやウィンドウのうち、システムのタイトルバーやステータスバーなどの他の UI 要素とコンテンツが重なってしまうリスクがある領域に関する情報を提供します。

この情報を使用することで、アイテムの背景色や効果をアイテム全体に適用しつつ、その子要素をアイテムのセーフエリア内に配置することができます。

Rectangle { id: parentItem gradient: Gradient.SunnyMorning anchors.fill: parent Rectangle { id: childItem gradient: Gradient.DustyGrass anchors { fill: parent topMargin: parent.SafeArea.margins.top leftMargin: parent.SafeArea.margins.left rightMargin: parent.SafeArea.margins.right bottomMargin: parent.SafeArea.margins.bottom } } }

SafeArea のマージンは、それがアタッチされているアイテムを基準としています。親アイテムが子要素をセーフエリアのマージン内に配置している場合、additional margins が追加されていない限り、独自の SafeArea がアタッチされている子孫アイテムは、マージンを 0 として報告します。

追加のマージン

アイテムのレイアウトによっては、子アイテム同士が重なり合う場合があります。たとえば、半透明のヘッダーを持つウィンドウで、ウィンドウの残りのコンテンツがヘッダーの下に流れる場合などです。

このシナリオでは、アイテムは `additionalMargins ` プロパティを介して、ヘッダーの位置とサイズを子アイテムに反映させることができます。

この追加のマージンは、アイテムが親階層からすでに取得しているマージン（タイトルバーやステータスバーなどのシステムマージンを含む）に加算され、子アイテムはそれに応じて合計されたマージンを反映します。

Rectangle { id: parentItem gradient: Gradient.SunnyMorning anchors.fill: parent Rectangle { id: headerItem width: parent.width height: 80 gradient: Gradient.WinterNeva z: 1 } Item { id: contentItem anchors.fill: parent z: 0 SafeArea.additionalMargins.top: headerItem.height - parent.SafeArea.margins.top Rectangle { id: childItem gradient: Gradient.DustyGrass anchors { fill: parent topMargin: parent.SafeArea.margins.top leftMargin: parent.SafeArea.margins.left rightMargin: parent.SafeArea.margins.right bottomMargin: parent.SafeArea.margins.bottom } } } }

上記の例では、ヘッダー項目はウィンドウの上部に配置されており、ウィンドウから生じる既存のセーフエリアのマージンと重なる可能性があります。これを考慮して、ウィンドウのセーフエリアのマージンを超えて伸びているヘッダーの部分に対してのみ、追加のマージンを加えます。

コントロール

Control には、コントロールのコンテンツ項目にパディングを追加するプロパティがすでに用意されているため、Control にセーフエリアのマージンを適用するのは簡単です。

Control {
    anchors.fill: parent

    background: Rectangle {
        gradient: Gradient.SunnyMorning
    }

    topPadding: SafeArea.margins.top
    leftPadding: SafeArea.margins.left
    rightPadding: SafeArea.margins.right
    bottomPadding: SafeArea.margins.bottom

    contentItem: Rectangle {
        gradient: Gradient.DustyGrass
    }
}

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

additionalMargins group

このプロパティには、アイテムの追加のセーフエリアマージンが格納されます。

追加のセーフエリアの余白は負の値にすることはできず、自動的に 0 に制限されます。

アイテムの最終的なセーフエリアのマージンは、継承されたマージン（たとえば、タイトルバーやステータスバーからのもの）と、そのアイテムに適用された追加のマージンの合計となります。

「margins」も参照してください 。

margins group

このプロパティは、アタッチされたアイテムを基準としたセーフエリアのマージンを保持します。

「additionalMargins」も参照してください 。