MouseArea QML Type

簡単なマウス操作を可能にする。もっと見る...

Import Statement: import QtQuick
Inherits:

Item

プロパティ

信号

詳しい説明

MouseArea は不可視のアイテムで、通常、そのアイテムのマウス操作を提供するために可視のアイテムと組み合わせて使用されます。効果的にプロキシとして動作することで、マウス操作のロジックを MouseArea アイテム内に含めることができます。

enabled プロパティは、プロキシされたアイテムのマウス操作を有効または無効にするために使用されます。無効にすると、マウス・エリアはマウス・イベントに対して透明になります。

MouseAreaは不可視アイテムですが、visibleプロパティを持っています。falseに設定すると、マウス領域はマウスイベントに対して透明になる。

pressed read-onlyプロパティは、ユーザがマウス・エリア上でマウス・ボタンを押したままにしているかどうかを示す。このプロパティは、ユーザインタフェース内のプロパティ間のバインディングでよく使用されます。containsMouse read-onlyプロパティは、マウス領域上のマウスカーソルの存在を示しますが、デフォルトでは、マウスボタンが押されたままの場合のみです。詳細はcontainsMouse のドキュメントを参照してください。

マウスの位置とボタンのクリックに関する情報は、イベントハンドラプロパティが定義されているシグナルを介して提供されます。onClicked、onDoubleClicked、onPressed、onReleased、onPressAndHoldです。onWheelシグナルでマウスホイールのイベントを処理することも可能です。

MouseAreaが他のMouseAreaアイテムの領域と重なっている場合、propagateComposedEvents をtrueに設定し、伝播されるべきイベントを拒否することで、clickeddoubleClickedpressAndHold イベントをこれらの他のアイテムに伝播するかどうかを選択できます。詳細はpropagateComposedEvents のドキュメントを参照してください。

デフォルトでは、MouseAreaアイテムはマウス・クリックのみを報告し、マウス・カーソルの位置の変更は報告しません。hoverEnabled プロパティを設定することで、onPositionChanged、onEntered、onExited に定義されたハンドラが使用され、マウスボタンが押されていなくてもcontainsMouse プロパティが更新されるようになります。

使用例

次の例では、クリックされるとRectangle の色が赤に変わるRectangle の MouseArea を使用しています:

import QtQuick

Rectangle {
    width: 100; height: 100
    color: "green"

    MouseArea {
        anchors.fill: parent
        onClicked: { parent.color = 'red' }
    }
}

多くのMouseAreaシグナルは、位置、ボタン、キー修飾子など、マウス・イベントに関する追加情報を含むmouse パラメータを渡します。

ここでは、領域が右クリックされたときに異なる色を生成する、前の例の拡張を示します:

Rectangle {
    width: 100; height: 100
    color: "green"

    MouseArea {
        anchors.fill: parent
        acceptedButtons: Qt.LeftButton | Qt.RightButton
        onClicked: (mouse)=> {
            if (mouse.button == Qt.RightButton)
                parent.color = 'blue';
            else
                parent.color = 'red';
        }
    }
}

MouseEventMouseAreaの例、および Qt Quick の重要な概念 - ユーザー入力も参照してください

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

mouseX : real [read-only]

mouseY : real [read-only]

これらのプロパティはマウスカーソルの座標を保持します。

hoverEnabled プロパティがfalseの場合、これらのプロパティはボタンが押されている間のみ有効で、マウスが領域外に移動してもボタンが押されている間は有効です。

デフォルトでは、このプロパティはfalseです。

hoverEnabled が true の場合、これらのプロパティは以下の場合に有効になります:

  • ボタンが押されていないが、マウスがMouseAreacontainsMouse が真)内にある。
  • ボタンが押され、保持されている。

座標はMouseArea からの相対座標である。


acceptedButtons : Qt::MouseButtons

このプロパティは、マウス領域が反応するマウスボタンを保持します。

MouseArea が複数のボタンに反応することを指定するには、Qt::MouseButtons フラグの値を "|" (or) 演算子を使用して組み合わせます:

MouseArea { acceptedButtons: Qt.LeftButton | Qt.RightButton }

すべての可能なマウスボタンを受け付けることを示すには、特別な値 'Qt.AllButtons' を使用することができます:

MouseArea { acceptedButtons: Qt.AllButtons }

デフォルト値はQt.LeftButton です。


containsMouse : bool [read-only]

このプロパティは、マウスが現在マウス領域内にあるかどうかを保持します。

警告: hoverEnabledfalse の場合、マウスカーソルがMouseArea の内側にあるときにマウスが押されると、containsMousetrue になります。しかし、onPressed ハンドラでmouse.accepted = false を設定すると、押下が拒否されたため、containsMousefalse のままになります。


containsPress : bool [read-only]

これはpressed && containsMouse と同等の便利なプロパティです。つまり、acceptedButtons のいずれかが現在押されていて、マウスが現在MouseArea の中にあるかどうかを保持します。

このプロパティは、マウスがその境界内で押されている間、項目をハイライトするために特に有用である。

pressed およびcontainsMouseも参照のこと


cursorShape : Qt::CursorShape

このプロパティは、このマウス領域のカーソル形状を保持する。マウスカーソルが表示されないプラットフォームでは、このプロパティは何の効果も持たないことに注意してください。

利用可能なカーソル形状は以下の通りです:

  • Qt.ArrowCursor
  • Qt.UpArrowCursor
  • Qt.CrossCursor
  • Qt.WaitCursor
  • Qt.IBeamCursor
  • Qt.SizeVerCursor
  • Qt.SizeHorCursor
  • Qt.SizeBDiagCursor
  • Qt.SizeFDiagCursor
  • Qt.SizeAllCursor
  • Qt.BlankCursor
  • Qt.SplitVCursor
  • Qt.SplitHCursor
  • Qt.PointingHandCursor
  • Qt.ForbiddenCursor
  • Qt.WhatsThisCursor
  • Qt.BusyCursor
  • Qt.OpenHandCursor
  • Qt.ClosedHandCursor
  • Qt.DragCopyCursor
  • Qt.DragMoveCursor
  • Qt.DragLinkCursor

マウスイベントに反応せずに、マウスカーソルの形状のみを領域に設定するには、acceptedButtons を none に設定します:

MouseArea { cursorShape: Qt.IBeamCursor; acceptedButtons: Qt.NoButton }

デフォルト値はQt.ArrowCursor です。

注意: cursorShape プロパティがundefined に設定されている場合、MouseArea に入力しても既存の形状は変更されません。

Qt::CursorShapeも参照してください


drag group

drag.active : bool [read-only]

drag.axis : enumeration

drag.filterChildren : bool

drag.maximumX : real

drag.maximumY : real

drag.minimumX : real

drag.minimumY : real

drag.smoothed : bool

drag.target : Item

drag.threshold : real

drag は、アイテムをドラッグ可能にする便利な方法を提供します。

  • drag.target ドラッグするアイテムの ID を指定します。
  • drag.active 対象のアイテムが現在ドラッグ中かどうかを指定します。
  • drag.axis ドラッグが水平方向( )、垂直方向( )、またはその両方( )のいずれかを指定します。Drag.XAxisDrag.YAxisDrag.XAndYAxis
  • drag.minimum と は、対応する軸に沿ってドラッグできる範囲を制限します。drag.maximum

次の例は、X 軸に沿ってドラッグできるRectangle を表示します。矩形が右にドラッグされると、矩形の不透明度が減少します。

Rectangle {
    id: container
    width: 600; height: 200

    Rectangle {
        id: rect
        width: 50; height: 50
        color: "red"
        opacity: (600.0 - rect.x) / 600

        MouseArea {
            anchors.fill: parent
            drag.target: rect
            drag.axis: Drag.XAxis
            drag.minimumX: 0
            drag.maximumX: container.width - rect.width
        }
    }
}

注意: アイテムが要求されたdrag.axis に対して固定されている場合は、ドラッグできません。例えば、上記の例でrectanchors.left またはanchors.right が設定されている場合、X 軸に沿ってドラッグすることはできません。これは、onPressed ハンドラでアンカー値をundefined に設定することで回避できます。

drag.filterChildren が true に設定されている場合、ドラッグは子孫の MouseAreas をオーバーライドすることができます。これにより、例えば親マウス領域MouseArea はドラッグを処理し、子マウス領域はクリックを処理することができます:

import QtQuick

Rectangle {
    width: 480
    height: 320
    Rectangle {
        x: 30; y: 30
        width: 300; height: 240
        color: "lightsteelblue"

        MouseArea {
            anchors.fill: parent
            drag.target: parent;
            drag.axis: "XAxis"
            drag.minimumX: 30
            drag.maximumX: 150
            drag.filterChildren: true

            Rectangle {
                color: "yellow"
                x: 50; y : 50
                width: 100; height: 100
                MouseArea {
                    anchors.fill: parent
                    onClicked: console.log("Clicked")
                }
            }
        }
    }
}

drag.threshold は、ドラッグ操作を開始するタイミングをピクセル単位で指定します。デフォルトでは、これはプラットフォーム依存の値にバインドされています。このプロパティは 2.2で追加されました。Qt Quick

drag.smoothedtrue の場合、ターゲットはドラッグ操作が開始された後にのみ移動されます。false に設定すると、ターゲットは現在のマウス位置に直接移動します。デフォルトでは、このプロパティはtrue です。このプロパティはQt Quick 2.4 で追加されました。

ドロップを行いたい場合は、Drag 添付プロパティおよびDropArea を参照してください。


enabled : bool

このプロパティは、アイテムがマウスイベントを受け入れるかどうかを保持する。

注意: 歴史的な理由により、このプロパティはItem.enabledと同等ではありません。マウスイベントにのみ影響し、その効果は子アイテムには伝搬しません。

デフォルトでは、このプロパティはtrueである。


hoverEnabled : bool

このプロパティは、ホバーイベントを処理するかどうかを保持します。

デフォルトでは、マウスイベントはボタンイベントへの応答、またはボタンが押された時のみ処理されます。Hoverは、マウス・ボタンが押されていなくても、すべてのマウス・イベントの処理を可能にします。

このプロパティは、containsMouse プロパティおよび onEntered、onExited、onPositionChanged シグナルに影響します。


pressAndHoldInterval : int

このプロパティは、pressAndHold が発信されるまでの経過時間をミリ秒単位でオーバーライドします。

明示的に設定されていない場合、またはリセットされた場合、値はQStyleHints::mousePressAndHoldInterval に従います。

通常、このプロパティはアプリケーション・スタイル・ヒントを使用してグローバルに設定すれば十分です。このプロパティは、特定のMouseAreaに対して様々な間隔が必要な場合に使用する必要があります。

pressAndHoldも参照してください


pressed : bool [read-only]

このプロパティは、acceptedButtons のいずれかが現在押されているかどうかを保持します。


pressedButtons : MouseButtons [read-only]

このプロパティは、現在押されているマウスボタンを保持します。

このプロパティには

  • Qt.LeftButton
  • Qt.RightButton
  • Qt.MiddleButton

以下のコードでは、マウスの右ボタンが押されたときに "right "と表示します:

Text {
    text: mouseArea.pressedButtons & Qt.RightButton ? "right" : ""
    horizontalAlignment: Text.AlignHCenter
    verticalAlignment: Text.AlignVCenter

    MouseArea {
        id: mouseArea
        anchors.fill: parent
        acceptedButtons: Qt.LeftButton | Qt.RightButton
    }
}

注意: このプロパティは、acceptedButtons で指定されたボタンのみを扱います。

acceptedButtonsも参照してください


preventStealing : bool

このプロパティは、このMouseArea からマウス・イベントを盗用できるかどうかを保持します。

MouseArea が Flickable のような子マウスイベントをフィルタリングするアイテム内に配置されている場合、親アイテムによってジェスチャが認識されると、マウスイベントがMouseArea から盗まれる可能性があります。preventStealing を true に設定すると、どのアイテムもマウスイベントを盗みません。

アイテムがイベントを盗み始めたら、preventStealing を true に設定しても、次のプレスイベントまで効果がないことに注意してください。

デフォルトでは、このプロパティは false です。


propagateComposedEvents : bool

このプロパティは、構成されたマウスイベントが、このMouseArea と重なっているが、視覚的な積み重ね順では下位にある他の MouseArea に自動的に伝播するかどうかを保持します。デフォルトでは、このプロパティはfalseです。

MouseArea にはいくつかの合成イベントが含まれます: と 。これらは、 のような基本的なマウス・イベントから構成され、基本的なイベントとは異なる方法で伝播されます。clicked doubleClicked pressAndHold pressed

propagateComposedEventsがtrueに設定されている場合、composedイベントは、シーン内の同じ場所にある他のMouseAreaに自動的に伝搬されます。各イベントは、enabled MouseAreaMouseArea がイベントを受け入れるまで、このビジュアル階層を伝搬していきます。pressed イベントとは異なり、構成されたイベントはハンドラが存在しない場合、自動的 には受け付けられません。

例えば、以下は青いRectangle を含む黄色いRectangle である。青い四角形は、視覚的な積み重ね順序の階層における最上位のアイテムです。これは黄色い四角形の上に視覚的にレンダリングされます。青い四角形は propagateComposedEvents を true に設定し、受信したすべてのclicked イベントに対してMouseEvent::accepted を false に設定するので、受信したclicked イベントはその下の黄色い四角形のMouseArea に伝搬されます。

import QtQuick 2.0

Rectangle {
    color: "yellow"
    width: 100; height: 100

    MouseArea {
        anchors.fill: parent
        onClicked: console.log("clicked yellow")
    }

    Rectangle {
        color: "blue"
        width: 50; height: 50

        MouseArea {
            anchors.fill: parent
            propagateComposedEvents: true
            onClicked: (mouse)=> {
                console.log("clicked blue")
                mouse.accepted = false
            }
        }
    }
}

青い四角形をクリックすると、その子MouseAreaonClicked ハンドラが呼び出されます。その後、イベントは黄色い四角形のMouseArea に伝搬され、それ自身のonClicked ハンドラが呼び出されます。

このプロパティは、重なり合ったMouseAreaが一緒に合成されたイベントを処理したい場合の使用例を非常に単純化します。例えば、1つのMouseAreaclicked シグナルを処理し、もう1つがpressAndHold を処理したい場合、または、1つのMouseArea がほとんどの時間clicked を処理し、特定の条件が満たされたときにそれを通過させたい場合などです。


scrollGestureEnabled : bool

このプロパティは、このMouseArea が、トラックパッドの2本指フリックジェスチャなど、マウス以外のデバイスからのスクロールジェスチャに応答するかどうかを制御します。falseに設定すると、ホイールイベントがホイール付きの実際のマウスから来た場合にのみ、wheel シグナルが発行され、スクロールジェスチャイベントは、それらを処理する他のItemに渡されます。例えば、ユーザは、カーソルがMouseArea を含むアイテムの上にあるときに、その下にある Flickable と対話するために、フリック ジェスチャを実行するかもしれません。このプロパティを false に設定すると、PinchArea はマウス ホイールまたはピンチ ジェスチャを処理し、Flickable はフリック ジェスチャを処理します。

デフォルトでは、このプロパティはtrueです。


シグナルの説明

canceled()

このシグナルは、マウスイベントの処理が他のアイテムに奪われ、マウスイベントがキャンセルされたときに発せられます。

このシグナルは上級者向けです。入力を処理するMouseArea が複数ある場合や、Flickable の中にMouseArea がある場合に便利です。後者の場合、onPressed シグナルハンドラで何らかのロジックを実行してからドラッグを開始すると、FlickableMouseArea からマウス処理を奪います。このような場合、MouseAreaFlickable にマウス処理を奪われたときにロジックをリセットするには、released に加えてcanceled も処理する必要があります。

注: 対応するハンドラはonCanceled です。


clicked(MouseEvent mouse)

このシグナルはクリックがあったときに発せられる。クリックとは、押した後に離すことであり、両方ともMouseArea の内側で行われる(押した後にMouseArea の外側に移動し、再び内側に移動して離すこともクリックとみなされる)。

mouse パラメーターは、クリックを離したxとyの位置、クリックが保持されたかどうかなど、クリックに関する情報を提供する。

このシグナルを処理する際、propagateComposedEvents プロパティがtrue でない限り、mouse パラメータのaccepted プロパティを変更しても効果はありません。

注: 対応するハンドラはonClicked です。


doubleClicked(MouseEventマウス)

このシグナルは、ダブルクリック(押した後に離し、その後に押す)があったときに発せられる。mouse パラメータは、クリックのリリースの x と y の位置、クリックが保持されたかどうかなど、クリックに関する情報を提供する。

このシグナルを扱うとき、mouse パラメータのaccepted プロパティが false に設定されていると、2 回目のクリックに対して pressed/released/clicked シグナルが発せられます。それ以外の場合は抑制されます。accepted プロパティのデフォルトはtrueです。

注: 対応するハンドラはonDoubleClicked です。


entered()

このシグナルは、マウスがマウス領域に入ったときに発せられます。

デフォルトでは、このシグナルはボタンが押されている場合にのみ発せられます。マウスボタンが押されていないときでもこのシグナルを出すには、hoverEnabled を true に設定します。

注意: 対応するハンドラはonEntered です。

hoverEnabledも参照してください


exited()

このシグナルはマウスがマウス領域から出たときに発せられます。

デフォルトでは、このシグナルはボタンが押されている場合にのみ発せられます。マウスボタンが押されていないときでもこのシグナルを出すには、hoverEnabled を true に設定します。

下の例は、2つのMouseAreaの間のかなり典型的な関係を示しており、mouseArea1 の上にmouseArea2 があります。mouseArea1 からmouseArea2 にマウスを移動させると、mouseArea1exited シグナルを発します。

Rectangle {
    width: 400; height: 400
    MouseArea {
        id: mouseArea1
        anchors.fill: parent
        hoverEnabled: true
    }
    MouseArea {
        id: mouseArea2
        width: 100; height: 100
        anchors.centerIn: parent
        hoverEnabled: true
    }
}

その代わりに2つのMouseAreaに親子関係を与えた場合、mouseArea1 からmouseArea2 にマウスを移動しても、mouseArea1exited発しません。代わりに、2つのMouseAreaは同時にホバーされたとみなされます。

注: 対応するハンドラはonExited です。

hoverEnabledも参照してください


positionChanged(MouseEvent mouse)

このシグナルはマウスの位置が変化したときに発せられます。

mouse パラメータには、xとyの位置、現在押されているボタンなど、マウスに関する情報が渡されます。

デフォルトでは、このシグナルはボタンが押されている場合にのみ発せられます。マウスボタンが押されていないときでもこのシグナルを出すには、hoverEnabled を true に設定します。

このシグナルを処理するとき、mouse パラメータのaccepted プロパティを変更しても効果はありません。

注意: 対応するハンドラはonPositionChanged です。


pressAndHold(MouseEvent mouse)

このシグナルは長押し(現在800ms)されたときに発せられます。mouse パラメータは、押された x と y の位置、どのボタンが押されたかを含む、押されたことに関する情報を提供します。

このシグナルを処理する際、propagateComposedEvents プロパティがtrue でない限り、mouse パラメータのaccepted プロパティを変更しても効果はありません。

注: 対応するハンドラはonPressAndHold です。


pressed(MouseEvent mouse)

このシグナルは、ボタンが押されたときに発せられます。mouse パラメータは、xとyの位置とどのボタンが押されたかを含む、押されたことに関する情報を提供します。

このシグナルを処理するとき、mouse パラメータのaccepted プロパティを使用して、このMouseArea が押されたときと、押された後リリースされるまでのすべてのマウスイベントを処理するかどうかを制御します。デフォルトでは、イベントを受け入れ、このMouseAreaの下にある他のMouseAreaがイベントを処理することを許可しません。acceptedをfalseに設定すると、次にボタンが押されるまで、それ以降のイベントはこのMouseArea

注意: 対応するハンドラはonPressed です。


released(MouseEvent mouse)

このシグナルはリリースがあったときに発せられます。mouse パラメータは、クリックが解除された x と y の位置、クリックが保持されたかどうかなど、クリックに関する情報を提供します。

このシグナルを処理する際、mouse パラメータのaccepted プロパティを変更しても効果はありません。

注: 対応するハンドラはonReleased

canceledも参照のこと


wheel(WheelEvent wheel)

このシグナルは、マウスホイールとトラックパッドの両方のスクロールジェスチャに応答して発せられます。

wheel パラメータは、x と y の位置、現在押されているボタン、angleDelta と pixelDelta を含むホイールの動きに関する情報など、イベントに関する情報を提供します。

注: 対応するハンドラはonWheel です。


© 2025 The Qt Company Ltd. Documentation contributions included herein are the copyrights of their respective owners. The documentation provided herein is licensed under the terms of the GNU Free Documentation License version 1.3 as published by the Free Software Foundation. Qt and respective logos are trademarks of The Qt Company Ltd. in Finland and/or other countries worldwide. All other trademarks are property of their respective owners.