Qt-QML-自定义个自己的文本Text
好久都没有正经的更新自己的文章了,这段时间也辞职了,听了小爱的,准备买个碗,自己当老板,下面请欣赏效果图
这个界面布局就是自己是在想不到啥了,按照常规汽车导航的布局布局了一下,主要看内容哈,看看这个文本文件
问个文本文件的状态了有一下三种
1. 正常 normal
2. 激活 active
3. 不可用 enable
位置可以有一下方式组合
1. 上
2. 下
3. 左
4. 右
5. 中心
等等,自己组合了就不写了
颜色目前默认是写了绿色,用了一些军事上面的颜色 。大家可以自行更改
下面附上文本文件的源代码
import QtQuick 2.0 /* 作者:张建伟 日期:2018年3月28日 简述:这是一个针对UFCP专门自定义的一个Text文本显示控件,该模块只适用于某种特定软件开发 */ Item { property string textState: "normal" //声明一个属性,用来表示当前文本的状态,/*激活:active*/ /*正常:normal*/ /*不可用:enable*/ property string textDetails: "测试文本" //声明一个属性,用来表示文本内容 property string textPositionH: "center" //声明一个属性,用来表示水平位置布局 /*左:left*/ /*右:right*/ /*中:center*/ property string textPositionV: "center" //声明一个属性,用来表示垂直位置布局 /*上: top*/ /*下:bottom*/ /*中:center*/ width: 200 //默认宽度 height: 96 //默认高度 Rectangle //用来显示文本的背景颜色 { id: background width: m_Text.width < 200 ? m_Text.width : 200 height: m_Text.height color: { /* 颜色根据文本不同的状态显示不同的颜色 */ if(textState == "active") { "#00FF00" } else { "#0000FF00" } } Text { id: m_Text color: { /* 文本颜色根据文本状态显示不同颜色 */ if(textState == "active") { "#000000" } else if(textState == "normal") { "#00FF00" } else { "#c0c0c0" } } font.pixelSize: 20 //字体大小20像素 font.family: "微软雅黑" //字体 微软雅黑 font.bold: false //关闭粗体显示 anchors.centerIn: parent text: qsTr(textDetails) //文本显示内容 } /* 文字布局,根据实际需求调整文本布局 */ anchors.top: { if(textPositionV == "top") { parent.top } } anchors.bottom: { if(textPositionV == "bottom") { parent.bottom } } anchors.left: { if(textPositionH == "left") { parent.left } } anchors.right: { if(textPositionH == "right") { parent.right } } anchors.centerIn: { if(textPositionH == "center" && textPositionV == "center") { parent.Center } } anchors.horizontalCenter: { if(textPositionH == "center") { parent.horizontalCenter } } anchors.verticalCenter: { if(textPositionV == "center") { parent.verticalCenter } } } }