Экран QML подходит для всех разрешений

Привет всем, у меня проблема с моим кодом QML. Я допустил ошибку, и я пошел на определенный размер, и теперь у меня проблема при установке приложения на другие устройства. Я вставлю вам свой код, где у меня есть ширина и высота, поэтому вы можете изменить его, чтобы показать мне, как работать с динамическим изменением размера.

Мне нужно сказать, что я вызываю qml файл из qt с помощью этого кода:

Я поставил весь код с шириной и высотой, чтобы вы могли видеть, что я сделал неправильно. И, пожалуйста, если кто-то может сказать мне, как сделать его динамически заполняться.

Ответы

Ответ 1

К сожалению, сложно добиться совершенства, так как это может быть связано с тем, что при уменьшении размера экрана вы можете захотеть, чтобы кнопки были больше, и чтобы удалить контент с экрана, чтобы пользователь мог получить доступ и прочитать все в порядке.

Но общий подход заключается в том, чтобы установить масштабный коэффициент на стороне С++:

ctxt->setContextProperty("scale", /* put calculated scale factor here */);

И затем на стороне QML используйте все, чтобы масштабировать все объекты:

Rectangle {

    id:window
    width: 602 * scale
    height: 1000 * scale

Таким образом вы можете настроить масштабную переменную для изменения всего размера. Сказав это, многие люди получают различные файлы QML в зависимости от размера платформы.

Ответ 2

Я рекомендую вам прочитать Scalability в текущей документации Qt (4.8): она находится именно в этом разделе.

Он рекомендует эти методы (я цитирую страницу здесь), а затем предоставляет гораздо более подробную информацию.

Создайте отдельные определения макета верхнего уровня для каждого форм-фактора.
Держите макеты малыми и пусть компоненты масштабируются относительно их непосредственный родитель.
Определите независимые от устройства измерения, такие как dp (устройство независимые пиксели) и использовать их для масштабирования компонентов и компоновки измерение.
Определить макеты пропорционально с помощью встроенного макета функции QML.

Обновление 2014-11-18. Эта и видео статья очень полезна: Поддержка нескольких экранов и плотности экрана с Qt и V-Play

Обновление 2017-01-24. обновленная версия Qt 5.8 на странице "Масштабируемость", упомянутой выше.

Ответ 3

Изменение устройства, вы фактически меняете плотность пикселей экрана. Если у вас есть устройство с низким качеством отображения, оно будет иметь меньшее количество пикселей на дюйм или пикселей на сантиметр, чем устройство с дисплеем высокого качества.

Понимая это, мы можем легко разработать метод масштабирования нашего контента в соответствии с плотностью пикселей. Например, в моем случае у меня есть ноутбук, на котором я использую создателя Qt. Он имеет плотность пикселей 4. Но мой телефон Android имеет высокое качество, плотность которого составляет 16 (в 4 раза больше, чем у моего ноутбука). Это означает, что если элемент имеет ширину "X" и высоту "Y" при отображении на моем ноутбуке, на моем телефоне он будет отображаться с шириной "X" /4 и высотой "Y" /4. Таким образом, я должен масштабировать высоту и ширину на 4.

Теперь, как это реализовать? В QML у нас есть свойство "pixelDensity" под экраном объекта, которое даст вам плотность пикселей экрана, на котором вы запускаете приложение. Разделение этого по плотности экрана экрана, на котором вы протестировали свое приложение, даст вам масштабный коэффициент. Итак, теперь вам не нужно беспокоиться о других устройствах, на которых вы только что нашли плотность пикселей экрана, на которой вы сейчас работаете.

Следующий код отлично работает для меня.

property int default_pix_density: 4  //pixel density of my current screen
property int scale_factor: Screen.pixelDensity/default_pix_density
Rectangle
{
    width: 50*scale_factor
    height: 20*scale_factor
}