View inside of ScrollView doesnt show

You must Login before you can answer or comment on any questions.

Hi all,

I have a problem with adding a view to a scrollview: In a Master/Detail Application I require the following DetailView module. It is a scrollview with a vertical layout (title lable, subtitle label, detailtext label). At the bottom of the variable sized lbl_detail label I want to append two buttons (button1 and button2). To have them next to eachother I embed them to a containerview (buttonView).

Now, when the lbl_detail label exceeds a certain height the buttonView is not visible. However, when I add the button directly (without first adding them to the buttonView: scrollView.add(button1)) it works fine.

Any explanations/workarounds for that?

Best,

Dirk

function DetailView() {
 
    //create a scrollview
    var scrollView = Titanium.UI.createScrollView({
        layout:'vertical',
        showVerticalScrollIndicator:'true',
        contentHeight:"auto",
        height: "auto"
    });
 
    //create title text
    var lbl_head = Ti.UI.createLabel({
        width:'auto',
        height: "auto",
        color:'#000',
        font:{fontSize:20,fontWeight:'bold'},
        top:15,
        left:8      
    });
 
    //create subtitle text  
    var lbl_abo = Ti.UI.createLabel({
        height:"auto",
        width:'auto',
        color:'#000',
        font:{fontSize:12},
        left:8,
        top:5       
    });
 
    // create detail text
    var lbl_detail = Ti.UI.createLabel({
        height:'auto',
        width:'auto',
        color:'#000',
        font:{fontSize:16},
        left:8,
        top:5       
    });
 
    // Create a first Button.
    var button1 = Ti.UI.createButton({
        title : 'Foo1',
        width : 120,
        left : 20
    });
 
    // Listen for click events.
    button1.addEventListener('click', function() {
        alert('\'button1\' was clicked!');
    });
 
    // Create a second Button.
    var button2 = Ti.UI.createButton({
        title : 'Foo2',
        width : 120,
        right : 20
    });
 
    // Listen for click events.
    button2.addEventListener('click', function() {
        alert('\'button2\' was clicked!');
    });
 
    //create containerview for 2 buttons
    var buttonView = Titanium.UI.createView({
        top : 5
    });
 
    // Add to the parent view
    buttonView.add(button1);
    buttonView.add(button2);
    scrollView.add(lbl_head);
    scrollView.add(lbl_abo);
    scrollView.add(lbl_detail);
    scrollView.add(buttonView); //this does not work
    //scrollView.add(button1); //this works
 
    scrollView.addEventListener('itemSelected', function(e) {
        lbl_head.text = e.title;
        lbl_detail.text = e.detail;
        lbl_abo.text = e.abo;       
        // lbl.text = e.title+ ' \n\n '+e.text;
    });
 
    return scrollView;
};
 
module.exports = DetailView;

1 Answer

Accepted Answer

Hi Dirk,

You have no height set for the button or the view containing the button.. Add a height and see if that solves it ..

T.

— answered 11 months ago by Trevor Ward
answer permalink
1 Comment
  • thanks Trevor, that solved it... just wondering why this was related to the size of my label (lbl_detail). With smaller sizes buttons showed up without setting height. With larger sizes, they didnt show. Anyways explicitely setting height solved it.

    — commented 11 months ago by Dirk Roland

Your Answer

Think you can help? Login to answer this question!