QWebEngineView 触摸滚动

Question

我有一个从旧 Qt 4.7.4 移植到 Qt5 的应用程序，据我所知，QWebView 变成了 QWebEngineView，并且对于 QWebView，我使用了 FlickCharm，在 Qt 示例中，它仍然可以与 QScrollArea 一起正常工作（例如 QListWidget，QTableWidget，...当然还有基本的 QScrollArea），但 QWebEngineView 不再使用，这里是激活 FlickCharm 的代码，它在 Qt4 上工作：

void FlickCharm::activateOn(QWidget *widget, QWidget* p_viewport)
{
    QAbstractScrollArea *scrollArea = qobject_cast<QAbstractScrollArea*>(widget);
    if (scrollArea) {
        // Widget is a scroll area

        QAbstractItemView *itemView = qobject_cast<QAbstractItemView*>(widget);
        if(itemView)
        {
            itemView->setHorizontalScrollMode(QAbstractItemView::ScrollPerPixel);
            itemView->setVerticalScrollMode(QAbstractItemView::ScrollPerPixel);
        }

        QWidget *viewport = scrollArea->viewport();
        if ( p_viewport )
        {
            viewport = p_viewport;
        }
        else
        {
            scrollArea->installEventFilter(this);
        }

        viewport->installEventFilter(this);

        QHash<QWidget*, FlickData*>::iterator oldViewport;
        if ( ( oldViewport = d->flickData.find(viewport) ) != d->flickData.end() )
        {
            delete oldViewport.value();
        }

        d->flickData.remove(viewport);
        d->flickData[viewport] = new FlickData;
        d->flickData[viewport]->widget = widget;
        d->flickData[viewport]->state = FlickData::Steady;
        d->flickData[viewport]->customViewPort = (viewport != scrollArea->viewport());

        return;
    }

    QWebView *webView = qobject_cast<QWebView*>(widget);
    if (webView) {
        // Widget is a web view
        webView->installEventFilter(this);

        QHash<QWidget*, FlickData*>::iterator oldViewport;
        if ( ( oldViewport = d->flickData.find(webView) ) != d->flickData.end() )
        {
            delete oldViewport.value();
        }

        d->flickData.remove(webView);
        d->flickData[webView] = new FlickData;
        d->flickData[webView]->widget = webView;
        d->flickData[webView]->state = FlickData::Steady;

        return;
    }

    qWarning() << "FlickCharm only works on QAbstractScrollArea (and derived classes)";
    qWarning() << "or QWebView (and derived classes)";
}

并且在 FlickData class 中有以下函数可以进行滚动：

bool scrollWidget(const int dx, const int dy)
    {
        {
            QAbstractScrollArea *scrollArea = qobject_cast<QAbstractScrollArea*>(widget);
            if (scrollArea) {
                const int x = scrollArea->horizontalScrollBar()->value();
                const int y = scrollArea->verticalScrollBar()->value();
                scrollArea->horizontalScrollBar()->setValue(x - dx);
                scrollArea->verticalScrollBar()->setValue(y - dy);
                return (scrollArea->horizontalScrollBar()->value() != x
                        || scrollArea->verticalScrollBar()->value() != y);
            }
        }

        {
            QWebEngineView *webEngineView = qobject_cast<QWebEngineView*>(widget);
            if (webEngineView) {
                const QPointF position = webEngineView->page()->scrollPosition();
                const QPointF newPosition = position - QPointF(dx, dy);
                webEngineView->page()->runJavaScript(QString("window.scrollTo(%1, %2);").arg(newPosition.x()).arg(newPosition.y()));
                return webEngineView->page()->scrollPosition() != position;
            }
        }
        return false;
    }

在 Qt5 中，我尝试像上面那样直接应用到 QWebEngineView：

    QWebEngineView *webEngineView = qobject_cast<QWebEngineView*>(widget);
    if (webEngineView) {
        webEngineView->installEventFilter(this);

        QHash<QWidget*, FlickData*>::iterator oldViewport;
        if ( ( oldViewport = d->flickData.find(webEngineView) ) != d->flickData.end() )
        {
            delete oldViewport.value();
        }

        d->flickData.remove(webEngineView);
        d->flickData[webEngineView] = new FlickData;
        d->flickData[webEngineView]->widget = webEngineView;
        d->flickData[webEngineView]->state = FlickData::Steady;

        return;
    }

并且还尝试了我认为是视口的页面视图：

    QWebEngineView *webEngineView = qobject_cast<QWebEngineView*>(widget);
    if (webEngineView) {
        QWidget *viewport = webEngineView->page()->view();

        webEngineView->installEventFilter(this);
        viewport->installEventFilter(this);

        QHash<QWidget*, FlickData*>::iterator oldViewport;
        if ( ( oldViewport = d->flickData.find(viewport) ) != d->flickData.end() )
        {
            delete oldViewport.value();
        }

        d->flickData.remove(viewport);
        d->flickData[viewport] = new FlickData;
        d->flickData[viewport]->widget = webEngineView;
        d->flickData[viewport]->state = FlickData::Steady;

        return;
    }

在QWebEngineView::page()（即QWebEnginePage）中，有一个scrollPosition()函数，但这是来自Q_PROPERTY但没有写入访问器函数，但我找到了代码和平使用 javascript 滚动我尝试使用：

    QWebEngineView *webEngineView = qobject_cast<QWebEngineView*>(widget);
    if (webEngineView) {
        const QPointF position = webEngineView->page()->scrollPosition();
        const QPointF newPosition = position - QPointF(dx, dy);
        webEngineView->page()->runJavaScript(QString("window.scrollTo(%1, %2);").arg(newPosition.x()).arg(newPosition.y()));
        return webEngineView->page()->scrollPosition() != position;
    }

但是在添加了一些日志之后，我发现我从来没有为 QWebEngineView 传入 scrollWidget，而且，因为我有自己的 class 继承了实例化的 QApplication，所以我可以看到这不是直接的 QWebEngineView被点击但是一个 RenderWidgetHostViewQtDelegateWidget（以 QWebEngineView 作为父级）无法从任何地方访问，我看到这个是因为我重新实现了 MyApplication::notify 以记录进行了哪些小部件点击：

bool MyApplication::notify(QObject* p_object, QEvent* p_event)
{
    [...]
    if ( p_event->type() == QEvent::MouseButtonPress )
    {
        QWidget* widget = dynamic_cast<QWidget*>(p_object);
        if (widget != 0)
        {
            qDebug().nospace() << "Mouse pressed on [" << (widget->isEnabled() ? "enabled" :"disabled") << "] widget: "
                               << p_object
                               << ", parent: " << p_object->parent();
        }
        else
        {
            qDebug().nospace() << "Mouse pressed on object: " << p_object
                               << ", parent: " << p_object->parent();
        }
    }
    else if ( p_event->type() == QEvent::MouseButtonRelease )
    {
        QWidget* widget = dynamic_cast<QWidget*>(p_object);
        if (widget != 0)
        {
            qDebug().nospace() << "Mouse release on [" << (widget->isEnabled() ? "enabled" :"disabled") << "] widget: "
                               << p_object
                               << ", parent: " << p_object->parent();
        }
        else
        {
            qDebug().nospace() << "Mouse release on object: " << p_object
                               << ", parent: " << p_object->parent();
        }
    }
    [...]
}

此外，当我尝试在 QWebEngineView 上滚动时，选择的是文本。

这里是 flickcharm 的完整代码：https://doc.qt.io/archives/qt-4.8/qt-demos-embedded-anomaly-src-flickcharm-cpp.html

此外，我看到有一种解决方案可以使 WebEngineView 轻弹但仅适用于 QtQuick QML：

有人知道如何在 QWebEngineView 上进行触摸滚动吗？

谢谢

编辑：由于 RenderWidgetHostViewQtDelegateWidget 是 QWebEngineView 的子级，我试图从 webEngineView->children() 访问它（至少作为 QWidget，如果可能的话）但没有成功，因为它唯一的子级是它的 QVBoxLayout（那个为空）和 FlickCharm。

Answer 1

我终于做到了我想做的，在 FlickCharm::activateOn 中，我为 QWebEngineView 输入了：

        QWebEngineView *webEngineView = qobject_cast<QWebEngineView*>(widget);
        if (webEngineView) {
            QLayout* webEngineViewLayout = webEngineView->layout();
            QWidget* webEngineViewChildWidget = 0;
            for (int i = 0; i < webEngineViewLayout->count(); ++i)
            {
                webEngineViewChildWidget = qobject_cast<QWidget*>(webEngineViewLayout->itemAt(i)->widget());

                if (webEngineViewChildWidget != nullptr)
                {
                    // There should be only one QWidget under QWebEngineView, but break just in case
                    break;
                }
            }

            if (webEngineViewChildWidget != nullptr)
            {
               // Install event filter on widget found in QWebEngineView layout
                webEngineViewChildWidget->installEventFilter(this);

                QHash<QWidget*, FlickData*>::iterator oldViewport;
                if ( ( oldViewport = d->flickData.find(webEngineViewChildWidget) ) != d->flickData.end() )
                {
                    delete oldViewport.value();
                }

                d->flickData.remove(webEngineViewChildWidget);
                d->flickData[webEngineViewChildWidget] = new FlickData;
                d->flickData[webEngineViewChildWidget]->widget = webEngineView;
                d->flickData[webEngineViewChildWidget]->state = FlickData::Steady;
            }
            else
            {
                // Web engine view has not yet a page loaded, activate "again" when a page has been loaded
                connect(webEngineView, &QWebEngineView::loadFinished, this, &FlickCharm::ReactToWebEngineViewLoaded);
            }

            return;
        }

而FlickCharm::ReactToWebEngineViewLoaded()是：

void FlickCharm::ReactToWebEngineViewLoaded()
{
    QWebEngineView* webEngineView = qobject_cast<QWebEngineView*>(sender());

    if (webEngineView != nullptr)
    {
        // We need to pass only once there then we can disconnect now
        disconnect(webEngineView, &QWebEngineView::loadFinished, this, &FlickCharm::ReactToWebEngineViewLoaded);

        // Activate "again" so that view actually uses flick charm
        activateOn(webEngineView);
    }
    else
    {
        LOG_ERROR("Web engine view is NULL");
        assert(webEngineView != nullptr);
    }
}

当然 void ReactToWebEngineViewLoaded() 在 flickcharm.h 中声明为插槽。

并且在 FlickData::scrollWidget 中用于 QWebEngineView ~~（这很棘手，我不喜欢 qApp->processEvents 调用，但如果我们想要实际比较 [=函数的 28=]~~:


            QWebEngineView *webEngineView = qobject_cast<QWebEngineView*>(widget);
            if (webEngineView) {
                 webEngineView->page()->runJavaScript(QString("window.scrollBy(%1, %2);").arg(-dx).arg(-dy));
                return true;
            }

QWebEngineView 触摸滚动

QWebEngineView scroll with touch

qt

qt5

qwebengineview