PDA

View Full Version : Adding a Map to a Tab Panel



Vooetu
31 Aug 2012, 6:53 AM
Hi!

I am new to Sencha Architect and so far I am really liking it, but I cannot overcome an issue.

I have a Tab Panel with three tabs (First tab, Second tab, Third tab) all of which display different information. I have a button on my First tab (actually on it's TitleBar) and if I click on it I would like to see a Google Map. If I drag the Map component onto the First tab the original content (that was on the tab) which is a list dissapears and the map becomes active.

How can I make that the list is active and only if I click the button on the title bar the map show up.

Thanks for your help!

aconran
31 Aug 2012, 9:11 AM
The map disappears because it's parent is not dictating what its width/height should be and you have not set it.

You can set the first tab's container layout to 'fit' and the map should appear.



How can I make that the list is active and only if I click the button on the title bar the map show up.


Please reword this, I don't know what you're asking.

Vooetu
31 Aug 2012, 10:23 AM
Sorry if I was not totaly clear.

With the "tap onPlacesMapButtonTap" event I would like to show the map. I have created a controller for the PlacesTab and have added this line:
this.getPlacesTab().setActiveItem(1);

38388

So my question is how can I show the map when I click the PlacesMapButton.

Thank you!

Vooetu
2 Sep 2012, 4:08 AM
I have managed to show the map with this code, but now the title bar disappears and the map shows up as a new tab on the tab bar. I would like to show the map while the title bar is still visible and the PlacesTab is selected on the tab bar. And if I click the the PlacesMapButton again the PlacesList appears that why I wouldn't like to use the Navigation View. So the PlacesMapButton toggles between the PlacesMap and PlacesList.


this.animateActiveItem(this.down("#PlacesMap"), {type:'flip', direction: 'left'});

Vooetu
4 Sep 2012, 6:19 AM
Can anybody help me?