Quantcast
Channel: Appcelerator Developer Center Q&A Unanswered Questions 20
Viewing all articles
Browse latest Browse all 8068

imageView on top of the window with bottom TabBar

$
0
0

Hello , I created a window with three imageView and a bottom TabBar. The three images should be visible below each other, filling the space above the TabBar, and when I click on a button of the TabBar, I want to see its corresponding view over the TabBar, instead of the three imageView. The TabBar works before attacking the three imageView, now if I set the window layer as vertical, the imageView displays fine but I can't see the view corresponding to the TabBar selected when I click. If I remove the layer from the window I noticed that I see the third image in the center of the available space on the TabBar, and the TabBar, and if I click a button I see the view behind the imageView . How can I do to fix this? The graphical user interface must be the same for iOS and Android (from 2.3) , the TabBar should stay on bottom, and the view must continue to show the TabBar. Thanks in advance for your help.

This is my code:

var win = Titanium.UI.createWindow({
//  layout: 'vertical', 
    navBarHidden: true, //nasconde la titlebar
    fullscreen: false,  //mantiene visibile la statusbar
        exitOnClose:true,    
});
 
var osname = Ti.Platform.osname;
if (osname === 'iphone') {
   win.setStatusBarStyle(Titanium.UI.iPhone.StatusBar.LIGHT_CONTENT);
}; 
 
var colors = Ti.UI.createImageView({
  image:'line_colors_portrait_iphone.jpg',
});
 
var urbanEff = Ti.UI.createImageView({
  image:'line_urbaneffects_portrait_iphone.jpg'
});
 
var resins = Ti.UI.createImageView({
  image:'line_resins_portrait_iphone.jpg'
});
 
 
//Tab container holds the custom tabgroup
var tabC = Ti.UI.createView({
    bottom:0,
    height: '15%',
    width: Ti.UI.FILL,
    layout: 'horizontal'    
});
 
//----The custom tabs-----
var b1 = Titanium.UI.createButton({
    left : 0,
    height : Ti.UI.FILL,
    width : '25%',
        backgroundColor : 'black',
        backgroundImage : 'button_menu_personalchoice_landscape_iphone.png',
        title: 'Scelta guidata',
    font:{fontSize:12,fontFamily:'Helvetica Neue'},    
    textAlign : 'center',    
        color: 'white',
});
 
var b2 = Titanium.UI.createButton({
    left : 0,
    height : Ti.UI.FILL,
    width : '25%',
        backgroundColor : 'black',
        title: 'Calcola',
    font:{fontSize:12,fontFamily:'Helvetica Neue'},    
       textAlign : 'center',    
       color: 'white'     
});
 
var b3 = Titanium.UI.createButton({
    left : 0,
    height : Ti.UI.FILL,
    width : '25%',
        backgroundColor : 'black',
        title: 'Video',
    font:{fontSize:12,fontFamily:'Helvetica Neue'},    
        textAlign : 'center',    
        color: 'white'         
});
 
var b4 = Titanium.UI.createButton({
    left : 0,
    height : Ti.UI.FILL,
    width : '25%',
        backgroundColor : 'black',
        title: 'Rivenditori',
    font:{fontSize:12,fontFamily:'Helvetica Neue'},    
        textAlign : 'center',    
        color: 'white' 
});
 
//-------Views to hold content------- 
var sv1 = Ti.UI.createScrollView({
    top: 0,
    height: '85%',
    backgroundColor: 'white',
    visible: false
});
 
var sv2 = Ti.UI.createScrollView({
    top: 0,
    height: '85%',
    backgroundColor: 'red',
    visible: false
});
 
var sv3 = Ti.UI.createScrollView({
    top: 0,
    height: '85%',
    backgroundColor: 'green',
    visible: false
});
 
var sv4 = Ti.UI.createScrollView({
    top: 0,
    height: '85%',
    backgroundColor: 'pink',
    visible: false
});
 
win.add(colors);
win.add(urbanEff);
win.add(resins);
tabC.add(b1);
tabC.add(b2);
tabC.add(b3);
tabC.add(b4);
 
win.add(tabC);
win.add(sv1);
win.add(sv2);
win.add(sv3);
win.add(sv4);
 
b1.addEventListener('click', function(e){
    sv1.setVisible(true);
    sv2.setVisible(false);
    sv3.setVisible(false);
    sv4.setVisible(false);
    colors.setVisible(false);
    urbanEff.setVisible(false);
    resins.setVisible(false);   
});
 
b2.addEventListener('click', function(e){
    sv2.setVisible(true);
    sv1.setVisible(false);
    sv3.setVisible(false);
    sv4.setVisible(false);
    colors.setVisible(false);
    urbanEff.setVisible(false);
    resins.setVisible(false);
});
 
b3.addEventListener('click', function(e){
    sv3.setVisible(true);
    sv2.setVisible(false);
    sv1.setVisible(false);
    sv4.setVisible(false);
    colors.setVisible(false);
    urbanEff.setVisible(false);
    resins.setVisible(false);
});
 
b4.addEventListener('click', function(e){
    sv4.setVisible(true);
    sv2.setVisible(false);
    sv3.setVisible(false);
    sv1.setVisible(false);
    colors.setVisible(false);
    urbanEff.setVisible(false);
    resins.setVisible(false);
});
 
win.open();

Viewing all articles
Browse latest Browse all 8068

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>