Qt 基于小数点的居中文本QML类型

Qt 基于小数点的居中文本QML类型,qt,text,qml,center,Qt,Text,Qml,Center,我有一个简单的TextQML类型: Item { anchors.fill: parent Text { id: centerText text: "6.9" anchors.horizontalCenter: parent.horizontalCenter y: 570 } } 当前,文本将基于字符串的整个长度居中。 但是我想根据点字符将文本居中 我正在考虑将实际的文本分为三部分:圆形部分、圆点部分和小

我有一个简单的
Text
QML
类型:

Item {
    anchors.fill: parent

    Text {
        id: centerText
        text: "6.9"
        anchors.horizontalCenter: parent.horizontalCenter
        y: 570
    }
}
当前,
文本
将基于字符串的整个长度居中。 但是我想根据点字符将
文本居中

我正在考虑将实际的
文本
分为三部分:圆形部分、圆点部分和小数部分。然而,我不认为我可以分割
float
变量,只得到小数部分


是否有另一种更方便、更适合于
QML
的方法?

下面是一个如何实现这一点的快速示例。“虚拟”隐藏文本用于测量数字的整数部分有多宽,可通过使用
Math.floor()
获得。然后,您只需将其定位,使小数点始终位于父对象的中心,而不管数字是多少

 Column {
    x: 100
    y: 200
    spacing: 5
    Slider {
      id: sl
      width: 400
      minimumValue: 0
      maximumValue: 100
    }
    Rectangle {
      width: 400
      height: 100
      Text {
        x: parent.width * .5 - dummy.width
        y: parent.height * .5 - height * .5
        text: sl.value
        Text {
          id: dummy
          text: Math.floor(sl.value)
          visible: false
        }
      }
    }
  }


顺便说一句,当你有
archors.fill:parent
时,那么
archors.bottom:parent.bottom
是多余的。

你可能需要使用类似于基于0的填充来实现所需的对齐——或者找到一种单间距字体,然后使用空格而不是0

无论哪种方式--这都可能是一个解决方案:

导入QtQuick 2.0
项目{
身高:480
宽度:320
/*要填充的浮点字符串列表*/
属性变量MyFloat:[“6.9”、“36.21”、“4.632”、“4225.2”、“12.0”]
/*启动时对字符串应用基于零的填充
并输出到控制台*/
Component.onCompleted:{
log(pad_floats());
}
/*函数接受每个小数点,每个整数由分隔符分隔。
计算出最长的一个的长度,然后使用
将0添加到整数开头的填充算法
和0到小数的后面,并返回一个数组*/
功能板浮动(){
var_int=0;
var最长浮点数=0;
var newFloats=[];
对于(var i=0;i最长_int){
最长长度=tmp长度;
}
如果(tmp_十二月长度>最长浮点数){
最长浮点数=tmp浮点数长度;
}
}
对于(var u=0;u=width?n:新数组(width-n.length+1);
}
/*下面是显示实际浮动列表的列表视图*/
列表视图{
宽度:320
身高:480
锚定。填充:父级
anchors.left:parent.left
model:pad\u floats()//我们以前返回的数组
委托:listDelegate//指向下面组件的指针
}
组成部分{
id:listDelegate
正文{
文本:modelData
font.pointSize:11
垂直对齐:Text.AlignVCenter
水平对齐:Text.AlignHCenter
}

}
编辑:最后我使用了的解决方案。如果您使用的是自定义字体,请不要忘记在虚拟
文本中也包含它的选项!

我无法复制的解决方案。我提出了自己的解决方案。我搜索了如何在JavaScript中获取浮点值的小数部分,发现如下:

(4.89 + "").split(".")[1]; => 89
这比
C++
函数更方便,因为它不返回“0.”部分

由于这一点,我只需创建三种
文本
QML
类型:

// Center horizontally number based on the dot
Text {
    id: testValueRoundPart
    anchors.right: testSpeedDot.left
    y: 570
    text:  (6.9 + "").split(".")[0]
}

Text {
    id: testSpeedDot
    y: 570
    text:  "."
    anchors.horizontalCenter: parent.horizontalCenter
}

Text {
    id: testSpeedValueDecimalPart
    y: 570
    anchors.left: testSpeedDot.right
    text: (6.9 + "").split(".")[1];
}
我一直在使用自定义字体(无内疚和Universalis;我不认为这些是单空间字体),它起了作用。
这可能不是最优化的解决方案,但它符合我的需要。

我意识到这并不是解决这个问题的“最有效”方法——但我写了一个更“详细”的解决方案如果没有monospace字体,将一系列操作组合成一个大blobIt的方法是行不通的,而且monospace字体很少用于UI设计,它们是文本控制台类型的字体,主要用于编码。由于无法从QML访问字体度量,使用隐藏文本元素来测量宽度是唯一可能的方法在任何情况下都可以使用的解决方案。是的,似乎更有效的处理方法是使用隐藏文本框——在QML中运行JS函数在我的示例中似乎从来都不起作用,值来自滑块,只是为了交互性。只需删除列、滑块,并用正则表达式替换矩形在你的OP中的AR项。这个解决方案比你的效率要高一点——只有2个文本元素,而不是3个锚定。这个概念很简单——把文本放在父的中心减去整数部分的宽度,这样点就在中间。/code>和我的
文本的
字体.pixelSize
。但是,如果我使用我在回答中引用的字体之一,它就不起作用。我想我们需要考虑