1. #1
    Sencha User
    Join Date
    Feb 2012
    Posts
    67
    Answers
    3
    Vote Rating
    1
    Soenhay is on a distinguished road

      0  

    Default Answered: Tab panel with multiple views under one tab

    Answered: Tab panel with multiple views under one tab


    Hi,

    What would be the best way to have multiple views under one tab of a tab panel such that each view other than the first one has its own toolbar for navigation?

    Could I use a card layout within the tabs panel?

  2. Of course you can use card layout within an item of a tabpanel.

  3. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,756
    Answers
    3462
    Vote Rating
    828
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Of course you can use card layout within an item of a tabpanel.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  4. #3
    Sencha User
    Join Date
    Feb 2012
    Posts
    67
    Answers
    3
    Vote Rating
    1
    Soenhay is on a distinguished road

      0  

    Default


    When using card.setActiveItem() can I pass the Id of the view? Or must it be the index of the card?

  5. #4
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,756
    Answers
    3462
    Vote Rating
    828
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    You should be able to but I wouldn't set the id config when creating a view, I would just let Sencha Touch create one.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  6. #5
    Sencha User
    Join Date
    Feb 2012
    Posts
    67
    Answers
    3
    Vote Rating
    1
    Soenhay is on a distinguished road

      0  

    Default


    Ok, I got the card layout to work by adding my views to a container with a card layout.
    Cards is a reference to the container.

    cards.add(aView);

    And I can set the active view of the card layout by calling..

    cards.setActiveItem(aView);

    So it works the same as using Ext.Viewport.

    Thanks for your help.

    **One more question:

    Is there a specific event to listen for a tab panel button being clicked/tapped?

    For example, when changing tabs you click a button on the tab bar... or if you click the button of the tab that you are currently on.

    I want the event to reset the card layout to the 0 indexed view if the tab panel button for the tab that contains the card layout is clicked/tapped.

    If I make an event that listens for any button click/tap it will fire when I click the tab panels tab bar buttons but I am hoping for a more specific event.

    Thanks in advance.

  7. #6
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,756
    Answers
    3462
    Vote Rating
    828
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    You can either listen to the activeitemchange event to then execute setActiveItem on the new item or listen to the activate event on the item that will fire when it is made active
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  8. #7
    Sencha User
    Join Date
    Feb 2012
    Posts
    67
    Answers
    3
    Vote Rating
    1
    Soenhay is on a distinguished road

      0  

    Default


    Thanks for your help again.

    The activate and activeitemchange events only work if you switch from one tab to another. I wanted to be able to click on the same tab and catch that event so I just used the general button tap event.

    Here is a sample of the ref and control I used:

    Code:
    refs:
    {
          asdf: 'tabbar > button[title=SomeTitle]'
    },
    control:
    {
          asdf:{
                tap: 'theFunction'
           }
    }
    Other options for the ref that did work:
    asdf: 'tabbar > button[iconCls=SomeIconCls]'
    asdf: 'tabbar > button[text=SomeTitle]' //The title is set to the text

    I just used the title because I am pretty sure that I will not use the same title anywhere else on the tabbar or any other tabbar.

  9. #8
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,756
    Answers
    3462
    Vote Rating
    828
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Ok. So each tab is an instance of Ext.tab.Tab which is house in an Ext.tab.Bar instance used by the Ext.tab.Panel. Ext.tab.Tab extends Ext.Button which has a tap event when it is tapped.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  10. #9
    Sencha User
    Join Date
    Feb 2012
    Posts
    67
    Answers
    3
    Vote Rating
    1
    Soenhay is on a distinguished road

      0  

    Default


    The way I understand it is that a tabpanel has tabs and a tabbar,
    and a tabbar has buttons.

  11. #10
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,756
    Answers
    3462
    Vote Rating
    828
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    Tabpanel has a tab bar and the tab bar has tabs.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

Thread Participants: 1

Turkiyenin en sevilen filmlerinin yer aldigi xnxx internet sitemiz olan ve porn sex tarzi bir site olan mobil porno izle sitemiz gercekten dillere destan bir durumda herkesin sevdigi bir site olarak tarihe gececege benziyor. Sitenin en belirgin ozelliklerinden birisi de Turkiyede gercekten kaliteli ve muntazam, duzenli porno izle siteleri olmamasidir. Bu yuzden iste. Ayrica en net goruntu kalitesine sahip adresinde yayinlanmaktadir. Mesela diğer sitelerimizden bahsedecek olursak, en iyi hd porno video arşivine sahip bir siteyiz. "The Best anal porn videos and slut anus, big asses movies set..." hd porno faketaxi