钛合金标签对齐问题答案

【问题标题】：Issue with label alignment in titanium alloy钛合金标签对齐问题
【发布时间】：2014-10-21 14:25:47
【问题描述】：

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

看上面的截图：第一个选项标签文本是“请选择 2 个主要原因对程序进行评分”，第二个选项标签文本是“问题 2”。如果第一个标签中的文本很小，适合一行，那么 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'
}

谁能帮我解决这个问题？即使标签文本超过一行，视图的高度也应该自动增加并且选项应该是视图。请帮帮我。

【问题讨论】：

我现在没有要测试的系统，但我认为您应该为 .checkBoxContainerView 设置width: Ti.UI.FILL
谢谢，现在显示完整的标签文本。但是标签文本是从下一行开始的。即标签显示在复选框下方。我需要标签应该在显示复选框的同一行开始。请有任何建议
也许你可以将checkBoxConterView的高度设置为'auto'？
@Robin Ellerkmann 我尝试将高度设置为“自动”。它没有按我预期的那样工作，您能否建议另一种解决方法
虽然看起来有点奇怪：您可以尝试删除标签的高度属性。这应该会强制 Titanium 自动缩放高度。

标签： titanium titanium-mobile titanium-alloy tss

【解决方案1】：

在考虑了很多关于您的问题后，我做了一些实验。我没有使用复选框，但如果标签是多行标签，我会尝试接收正确的对齐方式。

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%，其余的用于您的标签。不要指定任何高度参数，因为系统会自动执行此操作。

【讨论】：