如何将SwipeView的currentIndex设置为TabBar的currentIndex“通过引用"转到特定页面后? [英] How to set currentIndex of SwipeView to currentIndex of TabBar "by reference" after going to specific page?

查看:278
本文介绍了如何将SwipeView的currentIndex设置为TabBar的currentIndex“通过引用"转到特定页面后?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我开始使用QtQuick Controls 2.0.我有使用C ++的经验,也有少量使用Qt的经验,但是我以前从未使用过QML.

I'm getting started with QtQuick Controls 2.0. I have experience with C++ and a small amount of experience with Qt, but I have not worked with QML before.

我有一个相互链接的TabBarSwipeView.我的意思是,当您在TabBar上选择一个页面时,SwipeView会转到该页面.从SwipeView滑动到页面时,TabBar会自动更新以反映该情况.

I have a TabBar and a SwipeView that are linked to each other. What I mean by this is that when you select a page on the TabBar, the SwipeView goes to that page. When you swipe to a page from the SwipeView, the TabBar updates itself to reflect that.

作为一项学习练习,我决定创建一个按钮,该按钮会将用户带到第二页.问题是,在不弄乱TabBarSwipeView之间的链接的情况下,我似乎找不到找到解决方法的方法.

As a learning exercise, I decided to create a button that would send the user to the second page. The issue is that I can't seem to find a way to do so without messing up the link between the TabBar and the SwipeView.

以下代码是我想出的最好的代码.它可以正确地转到第二页,并且当我使用TabBar更改当前页面时,SwipeView仍会更新.但是,刷卡到新页面不再更新TabBar.似乎将tabBar.currentIndex设置为swipeView.currentIndex时,仅在使用冒号进行初始化时才具有通过引用进行设置的效果.用等号设置值.如何在保持swipeView.currentIndex == tabBar.currentIndex不变的情况下移至特定页面?

The following code is the best I've come up with. It correctly goes to the second page, and when I change the current page with the TabBar the SwipeView still updates. However, swiping to a new page no longer updates the TabBar. It appears that setting tabBar.currentIndex to swipeView.currentIndex only has the effect of setting by reference when done with the colon to initialize. Doing so with an equals sign sets by value. How can I move to a specific page while still maintaining the invariant that swipeView.currentIndex == tabBar.currentIndex?

// main.qml
import QtQuick 2.7
import QtQuick.Controls 2.0
import QtQuick.Layouts 1.0

ApplicationWindow {
    visible: true
    width: 640
    height: 480
    title: qsTr("Hello World")
    SwipeView {
        id: swipeView
        anchors.fill: parent
        currentIndex: tabBar.currentIndex

        Page {
            Button {
                text: qsTr("Continue to Page 2")
                onClicked: {
                    tabBar.currentIndex = 1;
                    // this next line merely sets tabBar.currentIndex to 1
                    tabBar.currentIndex = swipeView.currentIndex
                }
                anchors.centerIn: parent
                width: text.implicitWidth
                height: text.implicitHeight
            }
        }

        Page {
            Label {
                text: qsTr("Second page")
                anchors.centerIn: parent
            }
        }
    }

    footer: TabBar {
        id: tabBar
        currentIndex: swipeView.currentIndex
        TabButton {
            text: qsTr("First")
        }
        TabButton {
            text: qsTr( "Second")
        }
    }
}

C ++代码只是Qt Creator为我提供的默认代码:

The C++ code is simply the default that Qt Creator provided for me:

// main.cpp
#include <QGuiApplication>
#include <QQmlApplicationEngine>

int main(int argc, char *argv[])
{
    QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling);
    QGuiApplication app(argc, argv);

    QQmlApplicationEngine engine;
    engine.load(QUrl(QLatin1String("qrc:/main.qml")));

    return app.exec();
}

推荐答案

要在不破坏currentIndex绑定的情况下移至下一页或上一页,可以调用

In order to move to the next or the previous page without breaking the currentIndex bindings, you can call incrementCurrentIndex() or decrementCurrentIndex(), respectively. These methods were introduced in Qt Quick Controls 2.1 in Qt 5.8.

鉴于currentIndex设置者又名. QQuickContainer::setCurrentIndex()是一个插槽,您也可以从QML调用setCurrentIndex()跳转到任意页面.这也不会破坏现有的绑定.

Given that the currentIndex setter aka. QQuickContainer::setCurrentIndex() is a slot, you can also call setCurrentIndex() from QML to jump to an arbitrary page. This will not break the existing bindings either.

Button {
    onClicked: tabBar.setCurrentIndex(1)
}

这篇关于如何将SwipeView的currentIndex设置为TabBar的currentIndex“通过引用"转到特定页面后?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆