[AC-2023] iOS: Layout horizontal adds space to the top and bottom of inner elements

 
<!-- AddAlarm.xml -->
<Alloy>
    <Window class='container' id="win">
        <ScrollView>
            <Label class='header'>Add New Alarm</Label>
            <View id="overview">
                <TextField hintText="Alarm Name" borderStyle="Ti.UI.INPUT_BORDERSTYLE_ROUNDED" id="alarm_name" />
                <View class='form' id='form'> </View>
                <View id="repeat">
                                </View>
                <Button onClick="close" id="create_alarm">Add Alarm</Button>
                <Button onClick="close" class='pink' id="cancel_alarm">Cancel</Button>
            </View>
        </ScrollView>
    </Window>
</Alloy>

 
// AddAlarm.tss
"#repeat":{
    width: Ti.UI.FILL
    ,height: Ti.UI.SIZE
    ,left: '10dip'
    ,right: '10dip'
    ,layout:'horizontal'
 
},

// lib/tools.js
module.exports = (function(){
    return {
        /**
         * Creates a checkbox which can be used on android or anything else.
         * @param {Object} specs
         * Object which holds the specs to be defined.
         */
        createCheckbox: function(specs) {
            var is_android = Ti.Platform.osname == 'android';
            if(typeof specs != "object")
                specs = {};
            var checkbox;
                checkbox = Ti.UI.createSwitch({
                    style : is_android?Ti.UI.Android.SWITCH_STYLE_CHECKBOX:null,
                    value : false,
                    height : Ti.UI.SIZE,
                    width : Ti.UI.SIZE
                });
 
            var view = Ti.UI.createView({
                height: specs.height || Ti.UI.SIZE,
                width: specs.width || Ti.UI.SIZE,
                layout: specs.layout || 'vertical',
                top: specs.top || '0dip',
                bottom: specs.bottom || '0dip',
                backgroundColor:'red'
            });
 
            if(specs.label){
                if(typeof specs.label == 'string'){
                    var lbl = Ti.UI.createLabel({
                        height: Ti.UI.SIZE,
                        width: Ti.UI.SIZE,
                        text: specs.label,
                        color: 'black',
                        font: {fontSize: '15dip'}
                    });
                    view.add(lbl);
                    // view.label = lbl;
                }
                else{
                    view.add(specs.label);
                }
            }
            view.checked = false;
            view.add(checkbox);
 
            function togglecheck () {
                if(!view.checked) {
                    view.checked = true;
                }
                else {
                    view.checked = false;
                }           
            };
            view.addEventListener('change', togglecheck);
 
            return view;
        },
// ....

 
// AddAlarm.js
ch_sun = utils.createCheckbox({label:" Sunday", width:'33%'});
ch_mon = utils.createCheckbox({label:" Monday", width:'33%'});
ch_tue = utils.createCheckbox({label:" Tuesday", width:'33%'});
ch_wed = utils.createCheckbox({label:" Wednesday", width:'33%'});
ch_thu = utils.createCheckbox({label:" Thursday", width:'33%'});
ch_fri = utils.createCheckbox({label:" Friday", width:'33%'});
ch_sat = utils.createCheckbox({label:" Saturday", width:'99%'});
 
$.repeat.add(ch_sun);
$.repeat.add(ch_mon);
$.repeat.add(ch_tue);
$.repeat.add(ch_wed);
$.repeat.add(ch_thu);
$.repeat.add(ch_fri);
$.repeat.add(ch_sat);

// tools.js
//................
                                        var lbl = Ti.UI.createLabel({
						height:'20dip',
						width: Ti.UI.SIZE,
						text: specs.label,
						color: 'black',
						font: {fontSize: '15dip'}
					});
					view.add(lbl);
// ...................