Question

这是一个简单的基于Qt / QML的网络浏览器“MeeBro”（Qt 4.7＆amp; QtWebKit 1.0），包含一些qml文件和一个javascript文件：

github.com/anssiko/webbrowser/blob/master/qml/content/WebBrowser.qml

它有一个元素Rectangle，其中设置了URL：

property string urlString: "http://anssiko.github.com/"

你能说出如何添加一个可以被joystik移动的游标（◀，▲，▼，▶< / kbd>）并点击joystik中心按钮点击链接？

MeeBro基于Qt / QML演示：doc.qt.io/qt–4.8/qt–demos–declarative–webbrowser–example.html

此外，我认为此链接可能会有所帮助：doc.qt.io/qt-4.8/qml-webview.html

Answer 1

你可以实现一个假的游标，如下所示：

#include <QTest>
#include <QGuiApplication>

    class FakeCursor : public QObject {
      Q_OBJECT
      Q_PROPERTY(QPoint pos READ pos WRITE setPos NOTIFY posChanged)
      Q_PROPERTY(bool visible READ visible NOTIFY visibleChanged)
      enum Direction { Up = 0, Down, Left, Right };
      QPoint _pos;
      qreal step;
      bool _visible;
    signals:
      void posChanged();
      void visibleChanged();
    public:
      FakeCursor() : step(1), _visible(true) {}

      void setPos(QPoint p) {
        if (p != _pos) {
            _pos = p;
            emit posChanged();
          }
      }
      bool visible() const { return _visible; }
      QPoint pos() const { return _pos; }

    public slots:
      void move(int d) {
        switch (d) {
          case Up: _pos.ry() -= step; break;
          case Down: _pos.ry() += step; break;
          case Left: _pos.rx() -= step; break;
          case Right: _pos.rx() += step; break;
          }
        emit posChanged();
      }
      void setStep(qreal s) { if (s) step = s; }
      void toggleVisible() { _visible = !_visible; emit visibleChanged(); }
      void click() {
        QWindow * w = QGuiApplication::allWindows()[0];
        QTest::touchEvent(w, 0).press(0, _pos, w).release(0, _pos, w);
        // try this instead if the touchevent doesn't work
        // QTest::mouseClick(QGuiApplication::allWindows()[0], Qt::LeftButton, Qt::NoModifier, _pos);
      }
    };

然后在main()中实例化并将其注册到QML：

  FakeCursor cur;
  engine.rootContext()->setContextProperty("Cursor", &cur);

然后你可以在QML的所有内容上创建一个游标元素：

Rectangle {
    width: 4
    height: 4
    radius: 2
    color: "red"
    x: Cursor.pos.x
    y: Cursor.pos.y
    visible: Cursor.visible
}

您可以使用Keys附加属性进行控制。在下面的示例中，它设置为使用键盘箭头和空格键，您可以将其更改为手机的控件：

Item {
    focus: true
    Keys.onPressed: {
        switch (event.key) {
        case Qt.Key_Up: Cursor.move(0); break;
        case Qt.Key_Down : Cursor.move(1); break;
        case Qt.Key_Left: Cursor.move(2); break;
        case Qt.Key_Right: Cursor.move(3); break;
        case Qt.Key_Space : Cursor.click(); break;
        }
    }
    Component.onCompleted: {
        Cursor.setStep(2) // to set the speed
        // Cursor.toggleVisible() // to show/hide it
        // Cursor.pos = Qt.point(50,50) // to move it quickly to a needed position
    }
}

您还需要将QT += testlib添加到项目文件中。如果模拟触摸事件不起作用，请尝试将其注释掉并使用注释的鼠标单击事件。你可能还需要更改一些QtQuick类，因为这个例子是Qt5，我没有Qt4。

如何为非触摸手机的QML应用添加鼠标/光标？

1 个答案: