Facing QML Column Layout and Row Layout issue in my application #QML #Layouts

[Arpitha]

This post is deleted!

[Arpitha]

This post is deleted!

[Arpitha]

This post is deleted!

[Arpitha]

This post is deleted!

[Arpitha]

This post is deleted!

[Arpitha]

Hello
anybody please help me on this ?

[Arpitha]

Anybody there please ??

[SuhasKrishanamurthy]

import QtQuick 2.15
import QtQuick.Window 2.15
import QtQuick.Controls 2.15
import QtQuick.Layouts 1.15

Window {
    id: mainWindow
    visible: true
    width: 850
    height: 360
    minimumWidth: 350
    minimumHeight: 620
    title: "Flight Plan Dashboard"
    color: "#1e2130"

    property bool isHorizontal: width >= 700

    ColumnLayout {
        anchors.fill: parent
        anchors.margins: 10
        spacing: 10

        GridLayout {
            id: mainContentGrid
            Layout.fillWidth: true
            Layout.fillHeight: true
            flow: isHorizontal ? GridLayout.LeftToRight : GridLayout.TopToBottom
            columns: isHorizontal ? 3 : 1
            rows: isHorizontal ? 1 : 3

            // Flight Plan Panel
            Rectangle {
                Layout.fillWidth: !isHorizontal
                Layout.preferredWidth: isHorizontal ? mainWindow.width * 0.25 : -1
                Layout.preferredHeight: isHorizontal ? mainWindow.height - 20 : 100
                color: "#282c3e"
                radius: 5

                ColumnLayout {
                    anchors.fill: parent
                    anchors.margins: 12
                    spacing: 6

                    Text {
                        text: "Flight Plan 1.0"
                        font.pixelSize: 14
                        font.bold: true
                        color: "white"
                    }

                    Text {
                        text: "26 Nov 06:43Z"
                        font.pixelSize: 12
                        color: "#a0a0a0"
                    }

                    Text {
                        text: "KRISTINA-SOLI"
                        font.pixelSize: 14
                        font.bold: true
                        color: "white"
                        Layout.topMargin: 4
                    }

                    Text {
                        text: "4047154622*79502/0B"
                        font.pixelSize: 12
                        color: "#a0a0a0"
                    }

                    Item { Layout.fillHeight: true }
                }
            }

            // Crew Panel
            Rectangle {
                Layout.fillWidth: !isHorizontal
                Layout.preferredWidth: isHorizontal ? mainWindow.width * 0.35 : -1
                Layout.preferredHeight: isHorizontal ? mainWindow.height - 20 : 180
                color: "#282c3e"
                radius: 5

                ColumnLayout {
                    anchors.fill: parent
                    anchors.margins: 12
                    spacing: 6

                    Text {
                        text: "Crew"
                        font.pixelSize: 14
                        font.bold: true
                        color: "white"
                    }

                    RowLayout {
                        spacing: 6

                        Text {
                            text: "Flight Deck"
                            font.pixelSize: 12
                            color: "#a0a0a0"
                        }

                        Rectangle {
                            Layout.preferredWidth: 20
                            Layout.preferredHeight: 20
                            radius: 10
                            color: "#4a5064"

                            Text {
                                anchors.centerIn: parent
                                text: "2"
                                color: "white"
                                font.pixelSize: 10
                            }
                        }

                        Text {
                            text: "Cabin"
                            font.pixelSize: 12
                            color: "#a0a0a0"
                            Layout.leftMargin: 8
                        }

                        Rectangle {
                            Layout.preferredWidth: 20
                            Layout.preferredHeight: 20
                            radius: 10
                            color: "#4a5064"

                            Text {
                                anchors.centerIn: parent
                                text: "4"
                                color: "white"
                                font.pixelSize: 10
                            }
                        }
                    }

                    Repeater {
                        model: isHorizontal ? 2 : 3

                        delegate: Rectangle {
                            Layout.fillWidth: true
                            Layout.preferredHeight: 30
                            color: "transparent"
                            border.color: "#444"
                            border.width: 1
                            radius: 4
                            Layout.topMargin: 4

                            RowLayout {
                                anchors.fill: parent
                                anchors.margins: 6
                                spacing: 8

                                Rectangle {
                                    Layout.preferredWidth: 20
                                    Layout.preferredHeight: 20
                                    radius: 10
                                    color: "#4a5064"

                                    Text {
                                        anchors.centerIn: parent
                                        text: "👤"
                                        color: "white"
                                        font.pixelSize: 12
                                    }
                                }

                                Text {
                                    text: {
                                        if (index === 0) return "CRAIG M GIFFORD";
                                        if (index === 1) return "COLIN P ZIMMERM...";
                                        if (index === 2) return "CHRISTY L ALLEN";
                                        return "";
                                    }
                                    color: "white"
                                    font.pixelSize: 12
                                }
                            }
                        }
                    }

                    Item { Layout.fillHeight: true }
                }
            }

            // Aircraft Status Panel with FMS INIT & FA
            ColumnLayout {
                Layout.fillWidth: !isHorizontal
                Layout.preferredWidth: isHorizontal ? mainWindow.width * 0.4 - 30 : -1
                Layout.preferredHeight: isHorizontal ? mainWindow.height - 20 : -1
                spacing: 6

                Rectangle {
                    Layout.fillWidth: true
                    Layout.preferredHeight: 200
                    color: "#282c3e"
                    radius: 5

                    ColumnLayout {
                        anchors.fill: parent
                        anchors.margins: 12
                        spacing: 6

                        Text {
                            text: "Aircraft Status"
                            font.pixelSize: 14
                            font.bold: true
                            color: "white"
                        }

                        Text {
                            text: "N542DE / DL375"
                            font.pixelSize: 14
                            font.bold: true
                            color: "white"
                            Layout.topMargin: 4
                        }

                        Text {
                            text: "A21N"
                            font.pixelSize: 12
                            color: "#a0a0a0"
                        }

                        Item { Layout.fillHeight: true }
                    }
                }

                RowLayout {
                    Layout.fillWidth: true
                    spacing: 10

                    Rectangle {
                        Layout.fillWidth: true
                        Layout.preferredHeight: (mainWindow.width * 0.4 - 50) / 3
                        color: "#343747"
                        radius: 4

                        Text {
                            anchors.centerIn: parent
                            text: "FMS INIT"
                            color: "white"
                            font.pixelSize: 12
                        }
                    }

                    Rectangle {
                        Layout.fillWidth: true
                        Layout.preferredHeight: (mainWindow.width * 0.4 - 50) / 3
                        color: "#343747"
                        radius: 4

                        Text {
                            anchors.centerIn: parent
                            text: "FA"
                            color: "white"
                            font.pixelSize: 12
                        }
                    }
                }
            }
        }
    }
}