钛合金中的标签对齐问题

Question

我在我的应用程序中创建了自定义复选框。如果标签文字很小，我对复选框及其标签没有任何问题。如果标签文本很大（超过一行），则对齐显示不正确。

请看上面的截图：第一个选项标签文字是＆＃34;请选择评估程序测试程序的2个主要原因＆＃34;和第二个选项标签文本是＆＃34;问题2＆＃34;。如果第一个标签中的文本很小，哪个适合一行，则UI看起来很好。但如果文字不止一行，我就面临上述问题。

我的代码如下，

查看：

<Label class="standardType1">Please select the 2 primary reasons rating the program?</Label>

<View class="checkBoxContainerView">
    <Widget id="box1" src="checkbox" value="true"/>
    <Label class="question1">Please select the 2 primary reasons rating the program testing the program</Label>
</View>

<View class="checkBoxContainerView">
    <Widget id="box2" src="checkbox" value="true"/>
    <Label class="question1">Question2</Label>
</View>

样式：

"#box1":
{
    height: Ti.UI.SIZE,
    width: Ti.UI.SIZE,
    left:10
}

"#box2":
{
    height: Ti.UI.SIZE,
    width: Ti.UI.SIZE,
    left:10
}

".question1":
{
    top: 3,
    left: 13,
    width: Ti.UI.SIZE,
    height: Ti.UI.SIZE,
    color: '#fff',
    font:{
        fontSize: 16, 
        fontWeight: 'normal'
    }
}

".checkBoxContainerView":
{
    left: 15,
    width: Ti.UI.SIZE,
    height: Ti.UI.SIZE,
    layout: 'horizontal'
}

任何人都可以帮助我吗？即使标签文本多于一行，视图的高度也应自动增加，并且应该查看选项。请帮帮我。

Answer 1

在思考了很多关于你的问题之后，我进行了一些实验。我没有使用checkBox但是如果标签是多行标签，则尝试接收正确的对齐方式。

XML：

<View id="temp" layout="horizontal" top="0" left="0">
    <Label id="headline"/>
    <Label id="description"/>
</View>

我的.tss：

"#headline": {
    top: "0",
    left: "0",
    width: "50%",
    text: "Headline",
    font: {
        fontSize: 20
    }
}
"#description": {
    left: "0",
    width: "50%",
    text: "Your long text here",
    font: {
        fontSize: 16
    }
}

正如您所看到的，我没有为容器指定任何高度或宽度（未在.tss中定义但在xml中定义）并且仅为我的标签设置宽度参数。您应该考虑将10-20％用于支票箱，其余用于标签。不要指定任何高度参数，因为系统会自动执行此操作。