0

アプリケーションにカスタム チェック ボックスを作成しました。チェックボックスに問題はありません。ラベルのテキストが小さい場合はラベルです。ラベル テキストが大きい (1 行以上) 場合、配置が正しく表示されません。

ここに画像の説明を入力

上のスクリーンショットを見てください。最初のオプション ラベル テキストは「プログラムをテストしているプログラムを評価する 2 つの主な理由を選択してください」で、2 番目のオプション ラベル テキストは「質問 2」です。最初のラベルのテキストが 1 行に収まるほど小さい場合、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'
}

誰でもそれで私を助けることができますか？ラベル テキストが複数行の場合でも、ビューの高さが自動的に増加し、オプションがビューになるはずです。私を助けてください。

4

1 に答える 1

4

あなたの問題についてよく考えた後、私は少し実験しました。私は 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% を使用し、残りをラベルに使用することを検討する必要があります。システムが自動的に行うため、高さパラメータを指定しないでください。

于 2014-10-22T11:00:31.973 に答える