I have created custom check boxes in my application. I have no issue with check box and it's label if the label text is small. If the label text is large (more than a one line) the alignment is not showing properly.
Look at the above screenshot: the first option label text is "Please select the 2 primary reasons rating the program testing the program" and second option label text is "Question2". If the text in first label is small that is which fits in one line then the UI looks good. But If text is more than one line I am facing the above issue.
My code is as follows,
View:
<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>
Style:
"#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'
}
Can any one help me with that? Even if label text is more than one line the height of the view should automatically increase and option should be view. Please help me.