TabBarPage.qml Example File
touch/content/TabBarPage.qml 
          
            
            
import QtQuick 2.2
import QtQuick.Controls 1.2
import QtQuick.Controls.Styles 1.1
Item {
    width: parent.width
    height: parent.height
    TabView {
        anchors.fill: parent
        style: touchStyle
        Tab {
            title: "Buttons"
            ButtonPage{ visible: true }
        }
        Tab {
            title: "Sliders"
            SliderPage{ visible: true }
        }
        Tab {
            title: "Progress"
            ProgressBarPage{ visible: true }
        }
    }
    Component {
        id: touchStyle
        TabViewStyle {
            tabsAlignment: Qt.AlignVCenter
            tabOverlap: 0
            frame: Item { }
            tab: Item {
                implicitWidth: control.width/control.count
                implicitHeight: 50
                BorderImage {
                    anchors.fill: parent
                    border.bottom: 8
                    border.top: 8
                    source: styleData.selected ? "../images/tab_selected.png":"../images/tabs_standard.png"
                    Text {
                        anchors.centerIn: parent
                        color: "white"
                        text: styleData.title.toUpperCase()
                        font.pixelSize: 16
                    }
                    Rectangle {
                        visible: index > 0
                        anchors.top: parent.top
                        anchors.bottom: parent.bottom
                        anchors.margins: 10
                        width:1
                        color: "#3a3a3a"
                    }
                }
            }
        }
    }
}