Михаиллл08 квітня 2019 р. 08:05
Как в QML сделать растягивающийся интерфейс
Добрый день.
Как в QML сделать растягивающийся интерфейс?
В Qt дизайнере можно регулировать отношение виджитов на экране через соотношение сгрупированных лэйаутов на экране. Хорошо это описанно
тут
Но как это можно реализовать в QML?
Вот пример страницы, на которой тринируюсь
import QtQuick 2.4 import QtQuick.Controls 2.4 Item { id: page2element width: 400 height: 600 property alias page2Button0: page2Button0 property alias page2Button1: page2Button1 property alias page2Button2: page2Button2 property alias page2Button3: page2Button3 property alias page2ButtonMenu: page2ButtonMenu property alias page2Label1: page2Label1 property alias page2Label2: page2Label2 Button { id: page2ButtonMenu x: 150 y: 493 text: qsTr("МЕНЮ") anchors.horizontalCenter: parent.horizontalCenter font.pointSize: 18 } Label { id: page2labe0 x: 57 y: 49 width: 286 height: 33 text: qsTr("Выберете красный цвет") anchors.horizontalCenterOffset: 0 anchors.horizontalCenter: parent.horizontalCenter font.family: "Verdana" horizontalAlignment: Text.AlignHCenter font.pixelSize: 22 font.weight: Font.Thin } Label { id: page2Label1 x: 122 y: 343 width: 156 height: 56 text: qsTr("Побед: ") anchors.horizontalCenter: parent.horizontalCenter horizontalAlignment: Text.AlignHCenter font.pointSize: 20 } Label { id: page2Label2 x: 122 y: 419 width: 156 height: 56 text: qsTr("1 из 20") anchors.horizontalCenter: parent.horizontalCenter horizontalAlignment: Text.AlignHCenter font.pointSize: 20 } Row { id: row x: 29 y: 102 spacing: 50 anchors.horizontalCenter: parent.horizontalCenter Button { id: page2Button0 width: 100 height: 100 Image { id: page2image1 width: 100 height: 100 anchors.rightMargin: 0 anchors.bottomMargin: 0 anchors.fill: parent source: "qrc:/images/images/close.png" fillMode: Image.Stretch } } Button { id: page2Button1 width: 100 height: 100 Image { id: page2image2 width: 100 height: 100 anchors.rightMargin: 0 anchors.bottomMargin: 0 anchors.fill: parent source: "qrc:/images/images/close.png" fillMode: Image.Stretch } } } Row { id: row1 x: 57 y: 220 spacing: 50 anchors.horizontalCenter: parent.horizontalCenter Button { id: page2Button2 width: 100 height: 100 Image { id: page2image3 width: 100 height: 100 anchors.leftMargin: 0 anchors.topMargin: 0 anchors.rightMargin: 0 anchors.bottomMargin: 0 anchors.fill: parent source: "qrc:/images/images/close.png" fillMode: Image.Stretch } } Button { id: page2Button3 width: 100 height: 100 Image { id: page2image4 width: 100 height: 100 anchors.rightMargin: 0 anchors.bottomMargin: 0 anchors.fill: parent source: "qrc:/images/images/close.png" fillMode: Image.Stretch } } } states: [ State { name: "Page2State1" PropertyChanges { target: page2image1 source: "qrc:/images/images/red.png" } PropertyChanges { target: page2image2 source: "qrc:/images/images/black.png" } PropertyChanges { target: page2image3 source: "qrc:/images/images/black.png" } PropertyChanges { target: page2image4 source: "qrc:/images/images/black.png" } }, State { name: "Page2State2" PropertyChanges { target: page2image1 source: "qrc:/images/images/black.png" } PropertyChanges { target: page2image2 source: "qrc:/images/images/red.png" } PropertyChanges { target: page2image3 source: "qrc:/images/images/black.png" } PropertyChanges { target: page2image4 source: "qrc:/images/images/black.png" } }, State { name: "Page2State3" PropertyChanges { target: page2image1 source: "qrc:/images/images/black.png" } PropertyChanges { target: page2image2 source: "qrc:/images/images/black.png" } PropertyChanges { target: page2image3 source: "qrc:/images/images/red.png" } PropertyChanges { target: page2image4 source: "qrc:/images/images/black.png" } }, State { name: "Page2State4" PropertyChanges { target: page2image1 source: "qrc:/images/images/black.png" } PropertyChanges { target: page2image4 source: "qrc:/images/images/red.png" } PropertyChanges { target: page2image2 source: "qrc:/images/images/black.png" } PropertyChanges { target: page2image3 source: "qrc:/images/images/black.png" } }, State { name: "Page2State0" } ] }
Рекомендуємо хостинг TIMEWEB
Стабільний хостинг, на якому розміщується соціальна мережа EVILEG. Для проектів на Django радимо VDS хостинг.Вам це подобається? Поділіться в соціальних мережах!
sf
- sdfsdfkp fgskpgokspdog
- 14 жовтня 2024 р. 15:09
C++ - Тест 004. Указатели, Массивы и Циклы
- Результат:90бали,
- Рейтинг балів8
МВ
- Максим Васильев
- 02 жовтня 2024 р. 04:14
Qt - Тест 001. Сигналы и слоты
- Результат:68бали,
- Рейтинг балів-1
ЛС
- Лев Семенов
- 30 вересня 2024 р. 11:04
C++ - Тест 001. Первая программа и типы данных
- Результат:53бали,
- Рейтинг балів-4
Останні коментарі
Читалка файлів fb3 на Qt Creator Подскажите как это запустить? Я не шарю в программировании и кодинге. Скачал и установаил Qt, но куча ошибок выдается и не запустить. А очень надо fb3 переконвертировать в html
ИМ
Django - Урок 064. Як написати розширення для Python Markdown Приветствую Евгений! У меня вопрос. Можно ли вставлять свои классы в разметку редактора markdown? Допустим имея стандартную разметку: <ul> <li></li> <li></l…
Игорь Максимов05 жовтня 2024 р. 07:51
QML - Урок 016. База даних SQLite та робота з нею в QML Qt Здравствуйте, возникает такая проблема (я новичок): ApplicationWindow неизвестный элемент. (М300) для TextField и Button аналогично. Могу предположить, что из-за более новой верси…
Qt Linux - Урок 001. Автозапуск програми Qt під Linux как сделать автозапуск для флэтпака, который не даёт создавать файлы в ~/.config - вот это вопрос ))
АК
Qt WinAPI - Урок 007. Робота з ICMP Ping в Qt Без строки #include <QRegularExpressionValidator> в заголовочном файле не работает валидатор.
Анатолий Кононенко05 лютого 2024 р. 01:50
Тепер обговоріть на форумі
добавить qlineseries в функции Пользователь может получить любые разъяснения по интересующим вопросам, касающимся обработки его персональных данных, обратившись к Оператору с помощью электронной почты https://topdecorpro.ru…
ИМ
Реализация навигации по разделам Спасибо Евгений!
Игорь Максимов03 жовтня 2024 р. 04:05
Indian Food Restaurant In Columbus OH| Layla’s Kitchen Indian Restaurant If you're looking for a truly authentic https://www.laylaskitchenrestaurantohio.com/ , Layla’s Kitchen Indian Restaurant is your go-to destination. Located at 6152 Cleveland Ave, Colu…
КГ
Не запускается программа на Qt: точка входа в процедуру не найдена в библиотеке DLL Написал программу на C++ Qt в Qt Creator, сбилдил Release с помощью MinGW 64-bit, бинарнику напихал dll-ки с помощью windeployqt.exe. При попытке запуска моей сбилженной программы выдаёт три оши…
Кирилл Гусарев27 вересня 2024 р. 09:09
при создании qml проекта Kits есть но недоступны для выбора Поставил Qt Creator 11.0.2. Qt 6.4.3 При создании проекта Qml не могу выбрать Kits, они все недоступны, хотя настроены и при создании обычного Qt Widget приложения их можно выбрать. В чем может …
у тебя все элементы имеют точку привязки (х,у), используй соотношение елементов друг к другу
А как это сделать. Нужно узнавать ширину и высоту дисплея?
суть. я думаю поймете, а там експеременты все покажут
и ознакомьтесь с этим
Спасибо. Статью читал. К сожалению этот вариант страницы не запускается в скомпилированной программе. Но по такому принципу сделал нижиприведенный код. Но при этом не получилось достичь масштабируемости. Помогите пожалуйста решить это:
а что не понравилось в моем коде выше? там ваш код который маштабируется
Кажется я понял, нужно похоже так делать, тогда пропорции сохраняются
QML достаточно гибок, чтоб достичь желаемого разными способами, достаточно включить фантазию
Но есть ли возможности в дизайнере это сделать, без лишнего кода?
А Ваш код ошибок не выдовал, но программа просто не открывала эту страницу
учитесь делать рауками