BlinCT
BlinCT30 квітня 2016 р. 07:37

Компоновка элементов в QML

вёрстка qml, qml, ColumnLayout, компоновка qml, Rectangle

Всем привет. Я хочу несколько элементов разместить вертикально. Например, ColumnLayout, ComboBox, ColumnLayout. Если, например, я их оберну каждый в прямоугольник, то как указать каждому из них, что они в расположении должны следовать один за другим?
И еще если это имеет значение, этот файл подгружается из другого места в коде через Loader.

import QtQuick 2.6
import QtQuick.Controls 1.4
import QtQuick.Layouts 1.1
 
Rectangle
{
    id: menucontent1
    color: "grey"
    height: 50
 
    Rectangle
    {
        anchors.fill: top
        ColumnLayout
        {
            anchors.top: parent
            anchors.topMargin: 5
            GroupBox
            {
                title: Check1
 
                RowLayout
                {
                    ExclusiveGroup { id: tabPositionGroup}
                    RadioButton
                    {
                        text: qsTr("One Timer")
                        checked: true
                        exclusiveGroup: tabPositionGroup
                    }
                    RadioButton
                    {
                        text: qsTr("Two Timers")
                        exclusiveGroup: tabPositionGroup
                    }
                }
            }
        }
    }
    Rectangle
    {
        anchors.fill: top
        ComboBox
        {
            width: 60
            model: ["1_language", "2_language", "3_language"]
        }
    }
 
    Rectangle
    {
        anchors.fill: top
        ColumnLayout
        {
            GroupBox
            {
                title: Check2
 
                RowLayout
                {
                    ExclusiveGroup { id: tabPositionGroup1}
                    RadioButton
                    {
                        text: qsTr("Switch_1")
                        checked: true
                        exclusiveGroup: tabPositionGroup1
                    }
                    RadioButton
                    {
                        text: qsTr("Switch_2")
                        exclusiveGroup: tabPositionGroup1
                    }
                }
            }
        }
    }
}

 

Рекомендуємо хостинг TIMEWEB
Рекомендуємо хостинг TIMEWEB
Стабільний хостинг, на якому розміщується соціальна мережа EVILEG. Для проектів на Django радимо VDS хостинг.

Вам це подобається? Поділіться в соціальних мережах!

2
Evgenii Legotckoi
  • 30 квітня 2016 р. 10:33
  • Відповідь була позначена як рішення.

Добрый день.
1) Рекомендую ознакомиться с правилами вёрстки и компоновки при разработке на QML. Чтобы разобраться с некоторыми моментами при работе с якорями (anchors), например, как правильно растянуть дочерний элемент по родительскому, или прибить дочерний элемент к верхней части родительского или сестринского, то есть соседнего элемента.
QML имеет json-подобную древовидную структуру. Дочерний элемент располагается внутри родительского. Сестринские элементы располагаются на одном уровне и имеют один и тот же родительский элемент (то есть parent).
2) ColumnLayout располагает элементы в колонку, один под одним. По умолчанию сверху вниз.
3) RowLayout располагается элементы слева направо.
4) Что касается кода, то можно сделать вот так.

Rectangle 
{
    id: menucontent1
    color: "grey"
 
    ColumnLayout
    {
        anchors.top: parent.top
        spacing: 2
 
        Rectangle
        {
            height: childrenRect.height
                GroupBox
                {
                    title: qsTr("Check1")
 
                    RowLayout
                    {
                        ExclusiveGroup { id: tabPositionGroup}
                        RadioButton
                        {
                            text: qsTr("One Timer")
                            checked: true
                            exclusiveGroup: tabPositionGroup
                        }
                        RadioButton
                        {
                            text: qsTr("Two Timers")
                            exclusiveGroup: tabPositionGroup
                        }
                    }
                }
        }
 
        Rectangle
        {
            height: childrenRect.height
            ComboBox
            {
                width: 60
                model: ["1_language", "2_language", "3_language"]
            }
        }
 
        Rectangle
        {
            height: childrenRect.height
            GroupBox
            {
                title: qsTr("Check2")
 
                RowLayout
                {
                    ExclusiveGroup { id: tabPositionGroup1}
                    RadioButton
                    {
                        text: qsTr("Switch_1")
                        checked: true
                        exclusiveGroup: tabPositionGroup1
                    }
                    RadioButton
                    {
                        text: qsTr("Switch_2")
                        exclusiveGroup: tabPositionGroup1
                    }
                }
            }
        }
    }
}

 

    BlinCT
    • 30 квітня 2016 р. 12:51
    Спасибо за совет, вижу теперь где я допустил оплошность. Я читал вашу тему по якорям, и кое что как раз мне пригодилось. Но вот такое height: childrenRect.height я если честно не знал. И как раз этого мне и не хватало чтобы цепляться к вышестоящему наследнику.

      Коментарі

      Only authorized users can post comments.
      Please, Log in or Sign up
      AD

      C++ - Тест 004. Указатели, Массивы и Циклы

      • Результат:50бали,
      • Рейтинг балів-4
      m
      • molni99
      • 26 жовтня 2024 р. 01:37

      C++ - Тест 004. Указатели, Массивы и Циклы

      • Результат:80бали,
      • Рейтинг балів4
      m
      • molni99
      • 26 жовтня 2024 р. 01:29

      C++ - Тест 004. Указатели, Массивы и Циклы

      • Результат:20бали,
      • Рейтинг балів-10
      Останні коментарі
      ИМ
      Игорь Максимов22 листопада 2024 р. 11:51
      Django - Підручник 017. Налаштуйте сторінку входу до Django Добрый вечер Евгений! Я сделал себе авторизацию аналогичную вашей, все работает, кроме возврата к предидущей странице. Редеректит всегда на главную, хотя в логах сервера вижу запросы на правильн…
      Evgenii Legotckoi
      Evgenii Legotckoi31 жовтня 2024 р. 14:37
      Django - Урок 064. Як написати розширення для Python Markdown Добрый день. Да, можно. Либо через такие же плагины, либо с постобработкой через python библиотеку Beautiful Soup
      A
      ALO1ZE19 жовтня 2024 р. 08:19
      Читалка файлів fb3 на Qt Creator Подскажите как это запустить? Я не шарю в программировании и кодинге. Скачал и установаил Qt, но куча ошибок выдается и не запустить. А очень надо fb3 переконвертировать в html
      ИМ
      Игорь Максимов05 жовтня 2024 р. 07:51
      Django - Урок 064. Як написати розширення для Python Markdown Приветствую Евгений! У меня вопрос. Можно ли вставлять свои классы в разметку редактора markdown? Допустим имея стандартную разметку: <ul> <li></li> <li></l…
      d
      dblas505 липня 2024 р. 11:02
      QML - Урок 016. База даних SQLite та робота з нею в QML Qt Здравствуйте, возникает такая проблема (я новичок): ApplicationWindow неизвестный элемент. (М300) для TextField и Button аналогично. Могу предположить, что из-за более новой верси…
      Тепер обговоріть на форумі
      Evgenii Legotckoi
      Evgenii Legotckoi24 червня 2024 р. 15:11
      добавить qlineseries в функции Я тут. Работы оень много. Отправил его в бан.
      t
      tonypeachey115 листопада 2024 р. 06:04
      google domain [url=https://google.com/]domain[/url] domain [http://www.example.com link title]
      NSProject
      NSProject04 червня 2022 р. 03:49
      Всё ещё разбираюсь с кешем. В следствии прочтения данной статьи. Я принял для себя решение сделать кеширование свойств менеджера модели LikeDislike. И так как установка evileg_core для меня не была возможна, ибо он писался…
      9
      9Anonim25 жовтня 2024 р. 09:10
      Машина тьюринга // Начальное состояние 0 0, ,<,1 // Переход в состояние 1 при пустом символе 0,0,>,0 // Остаемся в состоянии 0, двигаясь вправо при встрече 0 0,1,>…

      Слідкуйте за нами в соціальних мережах