QML not displaying correctly



  • Hey,

    I'm using the Tabs component. The first tab (Blocks) displays correctly, but when I navigate to the Transactions tabs, the TextArea goes off the screen.

    Here's the code:
    import QtQuick 2.5
    import QtQuick.Controls 1.4
    import QtQuick.Layouts 1.2
    import QtQuick.Dialogs 1.2

    ApplicationWindow {
    id: mainWindow
    visible: true
    width: 640
    height: 480
    title: qsTr("Block Explorer")

    signal prevPressed();
    signal nextPressed();
    
    menuBar: MenuBar {
        Menu {
            title: qsTr("File")
            MenuItem {
                text: qsTr("&Open")
                onTriggered: console.log("Open action triggered");
            }
            MenuItem {
                text: qsTr("Exit")
                onTriggered: Qt.quit();
            }
        }
    }
    
    
    TabView {
        anchors.fill: parent
    
        Tab {
            title: "Blocks"
            Item {
                anchors.centerIn: parent
    
                TextArea {
                    id: block
                    x: 107
                    y: 62
                    width: 392
                    height: 327
                    visible: true
                    frameVisible: true
                    tabChangesFocus: false
                    readOnly: true
                    text: Test.text
                }
    
                Button {
                    id: previous
                    x: 240
                    y: 400
                    onClicked: mainWindow.prevPressed()
                    text: qsTr("Previous")
                }
    
                Button {
                    id: next
                    x: 340
                    y: 400
                    onClicked: mainWindow.nextPressed()
                    text: qsTr("Next")
                }
    
            }
        }
        Tab {
            title: "Transactions"
            anchors.centerIn: parent
    
            TextArea {
                id: transactions
                x: 107
                y: 62
                width: 392
                height: 327
                visible: true
                frameVisible: true
                tabChangesFocus: false
                readOnly: true
                text: "Transactions"
            }
    
            Button {
                id: transaction_previous
                x: 240
                y: 400
                onClicked: mainWindow.prevPressed()
                text: qsTr("Previous")
            }
    
            Button {
                id: transaction_next
                x: 340
                y: 400
                onClicked: mainWindow.nextPressed()
                text: qsTr("Next")
            }
        }
        Tab {
            title: "State"
            anchors.centerIn: parent
    
            Rectangle {
                color: "green"
            }
        }
    }
    
    MessageDialog {
        id: messageDialog
        title: qsTr("May I have your attention, please?")
    
        function show(caption) {
            messageDialog.text = caption;
            messageDialog.open();
        }
    }
    

    }



  • Whoops, forgot to put the second tab in an Item

    Here's the fixed code:
    import QtQuick 2.5
    import QtQuick.Controls 1.4
    import QtQuick.Layouts 1.2
    import QtQuick.Dialogs 1.2

    ApplicationWindow {
    id: mainWindow
    visible: true
    width: 640
    height: 480
    title: qsTr("Block Explorer")

    signal prevPressed();
    signal nextPressed();
    
    menuBar: MenuBar {
        Menu {
            title: qsTr("File")
            MenuItem {
                text: qsTr("&Open")
                onTriggered: console.log("Open action triggered");
            }
            MenuItem {
                text: qsTr("Exit")
                onTriggered: Qt.quit();
            }
        }
    }
    
    
    TabView {
        anchors.fill: parent
    
        Tab {
            title: "Blocks"
            Item {
                anchors.centerIn: parent
    
                TextArea {
                    id: block
                    x: 107
                    y: 62
                    width: 392
                    height: 327
                    visible: true
                    frameVisible: true
                    tabChangesFocus: false
                    readOnly: true
                    text: Test.text
                }
    
                Button {
                    id: previous
                    x: 240
                    y: 400
                    onClicked: mainWindow.prevPressed()
                    text: qsTr("Previous")
                }
    
                Button {
                    id: next
                    x: 340
                    y: 400
                    onClicked: mainWindow.nextPressed()
                    text: qsTr("Next")
                }
    
            }
        }
        Tab {
            title: "Transactions"
            Item {
                anchors.centerIn: parent
    
                TextArea {
                    id: transactions
                    x: 107
                    y: 62
                    width: 392
                    height: 327
                    visible: true
                    frameVisible: true
                    tabChangesFocus: false
                    readOnly: true
                    text: "Transactions"
                }
    
                Button {
                    id: transaction_previous
                    x: 240
                    y: 400
                    onClicked: mainWindow.prevPressed()
                    text: qsTr("Previous")
                }
    
                Button {
                    id: transaction_next
                    x: 340
                    y: 400
                    onClicked: mainWindow.nextPressed()
                    text: qsTr("Next")
                }
            }
        }
        Tab {
            title: "State"
            anchors.centerIn: parent
    
            Rectangle {
                color: "green"
            }
        }
    }
    
    MessageDialog {
        id: messageDialog
        title: qsTr("May I have your attention, please?")
    
        function show(caption) {
            messageDialog.text = caption;
            messageDialog.open();
        }
    }
    

    }


Log in to reply
 

Looks like your connection to Qt Forum was lost, please wait while we try to reconnect.