TableView and ImageView with problems when I switch TabGroups

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

Hi,

I am a newbie and I have a question about Iphone and Ipad Simulators.

I have an application with two TabGroups, one of them has a TableView. The content of the TableView is loaded from Parse when the application starts.

The TabGroup containing the TableView is not displayed when the application starts. When I first switch to the TableView TabGroup the first line of the TableView is partially hidden. if I switch back to the first tab and then return to the TableView Tab the TableView shows correctly.

The same thing occures with the first Tab. It has an ImageView centralized. Th First Time it is displayed it centralized as expected but when I switch and return the image changes its position.

I do not have an Iphone or IPad. But when I delpoy directly to my Galaxy Tablet or run in the Android simulator it works perfectly. I would like to know if this is a problem with the Apple Simulators or I really have to take care in real devices.

Thanks in advance

— asked 3 years ago by Marcus Baffa
2 Comments
  • can you post some code?

    — commented 3 years ago by Gaurang Chhatbar

  • As soon as can access my development machine I will post the code. Thank you very much

    — commented 3 years ago by Marcus Baffa

2 Answers

Here is the code:

App.js

Ti.UI.setBackgroundColor('#000');

var mainTabGroup = require('ui/MainTabGroup');
mainTabGroup().open();

MainTabGroup.js

function MainTabGroup() {

var tabGroup = Ti.UI.createTabGroup();

var logoTab = require('ui/LogoTab');
var gamesTab = require('ui/GamesTab');
var arenasTab = require('ui/ArenasTab');

//
//  add tabs
//
tabGroup.addTab(logoTab());  
tabGroup.addTab(gamesTab());
tabGroup.addTab(arenasTab()); 

return tabGroup;

};

module.exports = MainTabGroup;

GamesTab.js

function GamesTab() {

var services = require('services/ServiceCall');
var genUtil = require('util/GenUtils');

var win1 = Ti.UI.createWindow ({        
    title: 'Games History',
    backgroundColor: 'white'
});

win1.width = Ti.Platform.displayCaps.platformWidth; 
win1.height = Ti.Platform.displayCaps.platformHeight; 

var tab1 = Ti.UI.createTab({  
    icon:'/images/KS_nav_history.png',
    title:'History',
    window:win1
});

win1.add(tblEquip);

var params = {className: "History", successCallback: function(result) { onSuccess(result); }}
services.parseGet( params );

return tab1;

// Preenche a TableView     
function onSuccess(result) {

    var data = [];
    var jsonObject = JSON.parse(result);

    var dpi = Ti.Platform.displayCaps.getDpi();

    for(var i = 0; i < jsonObject.results.length; i++) {

        //create a table row
        var row = Ti.UI.createTableViewRow({
            hasChild: true,
            height: 'auto'
        });

        //title label 
        var nomeLabel = Ti.UI.createLabel({
            text: jsonObject.results[i].year + ' - ' + jsonObject.results[i].city + ' - ' + jsonObject.results[i].country,
            font: {fontSize: 16 + (genUtil.isTablet(win1) ? 2 : 0), fontWeight: 'bold'}, 
            left: 50, 
            top: 5,
            height: 30, 
            width: 'auto', 
            color: '#000'
        }); 
        row.add(nomeLabel);

        //description label 
        var descriptionLabel = Ti.UI.createLabel({
            text: jsonObject.results[i].descricao, 
            font: {fontSize: 12 + (genUtil.isTablet(win1) ? 2 : 0), fontWeight: 'normal'}, 
            left: 50, 
            top: 35,
            bottom: 10,
            height: 'auto',
            width: 'auto', 
            color: '#000'
        }); 

        if(descriptionLabel.text == '') {
            descriptionLabel.text = 'No description.';
        } 
        row.add(descriptionLabel);          

        //add our little icon to the left of the row 
        var iconImage = Titanium.UI.createImageView({
            image: '/images/'+jsonObject.results[i].imagePath, 
            width: 'auto', 
            height: 'auto', 
            left: 5,
            top: 10
        });
        row.add(iconImage);

        //add the table row to our data[] object 
        data.push(row);
    }

    //finally, set the data property of the tableView //to our data[] object 
    tblEquip.data = data;
}

}

module.exports = GamesTab;

It worked, I just had to include top:0, left: 0 in the main window (win1).

Your Answer

Think you can help? Login to answer this question!