QtQuick.Controls2.0 Header、Footer:Tabbar

TabBar+header and footer 是Qt5.7的新组建,5.7提供了大量实用美观的组件Material和Universal 风格已经正式发布,在5.6中是试验版本。ApplicationWindow中提供了导航,类似于网页设计中的页头和页脚,Qtquick中 叫做 header和footer,这两个定义了固定在页面顶部的元素和底部的元素。currentIndex属性:当前Tabbar所选中的项,Tabbar中一般用新元素:TabButton来定义显示的按钮

写一段简单的代码,顶部导航和底部导航的curindex同步

import QtQuick 2.7import QtQuick.Controls 2.0import QtQuick.Layouts 1.0import QtQuick.Layouts 1.1import QtQuick.Window 2.0import QtQuick.Controls.Styles 1.4import QtQuick.Controls.Material 2.0import QtQuick.Controls.Universal 2.0ApplicationWindow {    id:root    visible: true;    height: 480;    width: 320;    header: TabBar {                id: headertabBar;                currentIndex:footertabBar.currentIndex                TabButton {                    text: qsTr("header Tab1");                }                TabButton {                    text: qsTr("header Tab2")                }                TabButton {                    text: qsTr("header Tab3")                }            }    footer: TabBar {        id: footertabBar        currentIndex: headertabBar.currentIndex        TabButton {            text: qsTr("footer Tab1");        }        TabButton {            text: qsTr("footer Tab2")        }        TabButton {            text: qsTr("footer Tab3")        }    }}