qml 桌面组件缩放 [英] qml desktop components scaling
问题描述
我想创建一个可以缩放并包含一些桌面组件的用户界面 qtquick2.正如这篇博客文章 qml/qtquick2 的默认渲染应该使用距离字段而不是原生文本渲染.我尝试缩放 qt 快速控件.结果相当令人失望.我正在 ubuntu 64 和 qt-5.1.1 上进行测试.控件上的文本看起来很糟糕,但标准 qml 元素 (Text/TextEdit) 中的所有文本在缩放时看起来都不错.
这让我认为原生渲染现在是桌面组件的默认设置.这个可以关掉吗?
在 Qt 5.2 中可以使用样式设置 Qt Quick Controls 的渲染类型,例如在 TextArea
中:
TextArea {/* ... */样式:TextAreaStyle {渲染类型:Text.QtRendering}}
支持的渲染类型有:
Text.QtRendering
Text.NativeRendering
(默认)
对于Button
和ButtonStyle
,在Qt 5.2 中没有直接设置渲染类型的公共接口.但是你可以做的是用你自己的文本组件覆盖 label
:
按钮{id:按钮/* ... */样式:按钮样式{标签:项目{隐含宽度:row.implicitWidth隐式高度:row.implicitHeight属性 var __syspal: SystemPalette {颜色组:theButton.enabled ?SystemPalette.Active : SystemPalette.Disabled}排 {编号:行anchors.centerIn:父级间距:2图像 {来源:theButton.iconSourceanchors.verticalCenter: parent.verticalCenter}文本 {renderType: Text.NativeRendering/* 改变我 */anchors.verticalCenter: parent.verticalCenter文本:theButton.text颜色:__syspal.text}}}}
此代码的灵感来自 ButtonStyle.qml,已修改且未经测试.
I want to create a user interface qtquick2 that can be scaled and includes some desktop components. As mentioned in this blogpost the default rendering for qml/qtquick2 should use distance fields and not native text rendering. I tried to scale qt quick controls. The result is rather disappointing. I was testing on ubuntu 64 and qt-5.1.1. The text on the controls is looking bad but all text in standard qml elements (Text/TextEdit) is looking good when scaled.
This leads me to think that native rendering is the default now for desktop components. Can this be turned of?
Setting render types of Qt Quick Controls will be available in Qt 5.2 using styles, e.g. in TextArea
:
TextArea {
/* ... */
style: TextAreaStyle {
renderType: Text.QtRendering
}
}
Supported render types are:
Text.QtRendering
Text.NativeRendering
(default)
See TextArea.qml, TextAreaStyle.qml.
For Button
and ButtonStyle
there is no public interface to set the render type directly in Qt 5.2. But what you can do, is overwrite the label
with your own text component:
Button {
id: theButton
/* ... */
style: ButtonStyle {
label: Item {
implicitWidth: row.implicitWidth
implicitHeight: row.implicitHeight
property var __syspal: SystemPalette {
colorGroup: theButton.enabled ?
SystemPalette.Active : SystemPalette.Disabled
}
Row {
id: row
anchors.centerIn: parent
spacing: 2
Image {
source: theButton.iconSource
anchors.verticalCenter: parent.verticalCenter
}
Text {
renderType: Text.NativeRendering /* Change me */
anchors.verticalCenter: parent.verticalCenter
text: theButton.text
color: __syspal.text
}
}
}
}
This code is inspired by the default label
component of ButtonStyle.qml, modified and untested.
这篇关于qml 桌面组件缩放的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!