Using the various components of Guarana together in Views

[Aimevous]

Hi,

I have just started using the Guarana UI and I spent the past 2 days trying to understand how to use the View and ViewManager components.

Adding simple html text and images is easy but how do I integrate the other components in?

Its like I have:

var loadTabs = function () { /* code to use the Tabs component */ };
var loadList = function () { /* code to use the Transition List */};

These 2 functions work well when used on their own (what I want appears on screen). So I wanted to integrate them together by using the Views component.

So what I did was basically copied the JS code from the Views demo html file and changed the contents of the FirstView to

var FirstView = Nokia.View.extend({
			init: function() {},
			renderUI: function() {
				loadList;		// Am I doing this wrongly?		
			},
			bindUI: function() {},
			syncUI: function() {},
			show: function(){this.getContainer().show();}
		});

And similarly for SecondView. (I dont have a third view, just wanted to test the tabs to transitionlist view)
The rest of the code is copied from the demo.

and then I try to initiate everything with

Nokia.use('viewmanager','transitionlist','tabs', loadView);

where loadView is the function that stores the above Views code.

Not sure if I stated enough info here, but I was trying to keep the post short.. I would appreciate any help and be glad to furnish more code/info if anyone can help!

If you can, kindly advise where I should put the relevant codes!


Thanks a million!

[jappit]

Hi Aimevous,

it seems you're missing the parentheses when calling the loadList function, in the renderUI method. So it should look like:

renderUI: function() {
	loadList();
},

Apart from this, are you calling the loadTabs() function somewhere else? (cannot see it in your code)

Pit