Appcelerator Titanium - How do I place an image at the bottom of the screen

Question

I have a main view, then on that view I have, as children, two labels and an image. I want the labels to flow one after another from the top of the screen and I want the image at the bottom. I get the labels to flow properly by setting layout:'vertical' in the main window. But once that is done, I can't seem to force the image to the bottom. Here is a snippet of my code:

var self = Ti.UI.createView({
    backgroundColor:'#fff',
    layout:'vertical'
});

var l1 = Titanium.UI.createLabel({                  
    text:quote,
    color:'#000',
    shadowColor:'#ddd',
    shadowOffset:{x:2,y:2},
    font:{fontFamily:'Marker Felt',fontSize:24},
    top:20,
    left:15,
    right:15,
    height:'auto'
});
self.add(l1);

var l2 = Titanium.UI.createLabel({
    text:author,
    color:'#000',
    shadowColor:'#ddd',
    shadowOffset:{x:2,y:2},
    font:{fontSize:16},
    top:10,
        left:15,
        right:15,
    height:'auto',
    textAlign:'right'
});
self.add(l2);

var imgView = Titanium.UI.createImageView({
    image:myimage,
    setBottom:10,
    height:100
});
self.add(imgView);

I have tried setting the image layout and that doesn't work. If I change the 'self' window layout to 'absolute' then I can't seem to get the labels to flow cleanly after one another. The first label is of variable height so I need them to follow each other.

I am using Titanium 1.82.

Thanks. In advance.

Answer 1

You might need to add another view. The 'base' view would have what you are calling 'self' added at top:0 and height: 'auto'

Then add imgView to 'base' with bottom: 10 (not setBottom like you have).