1. #1
    Sencha User
    Join Date
    Sep 2011
    Posts
    3
    Vote Rating
    0
    PapaAdams is on a distinguished road

      0  

    Default Unanswered: Problems getting split carousels on a TabBar Panel

    Unanswered: Problems getting split carousels on a TabBar Panel


    I have setup a Toolbar for my user interface with four separate menu items. One of these menu's I would like to have 2 carousels split vertically so that the user can scroll them on either side of the device

    My current code is as follow; (It was taken from the Tabs and Toolbar Demo)

    Code:
    Project.views.item = Ext.extend(Ext.Panel,{
        title: "Item",
        iconCls: 'calendar',
        incomMask: true,
    });
    
    
    Ext.reg('cocktails', Project.views.Item);
    I am trying to get the following code to work on this panel (Taken from the Layouts Demo)

    Code:
    Ext.setup({
        onReady: function() {
    
    
            var topChanger = new Ext.Carousel({
                items: [
                    {style: "background-color: #D55B5B;"},
                    {style: "background-color: #B22222;"},
                    {style: "background-color: #7C0505;"}
                ]
            });
    
    
            var centerChanger = new Ext.Carousel({
                items: [
                    {style: "background-color: #FFDD00;"},
                    {style: "background-color: #FFBF00;"},
                    {style: "background-color: #FF8F00;"}
                ]
            });
    
    
            var bottomChanger = new Ext.Carousel({
                items: [
                    {style: "background-color: #7BB300;"},
                    {style: "background-color: #3B7E00;"},
                    {style: "background-color: #0E3E00;"}
                ]
            });
            
            new Ext.Panel({
                fullscreen: true,
                layout: {
                    type: 'vbox',
                    align: 'stretch'
                },
                defaults: {flex: 1},
                items: [topChanger, centerChanger, bottomChanger]
            });
    
    
        }
    });
    Thanks in advance for your help!

  2. #2
    Sencha Premium Member
    Join Date
    Nov 2007
    Location
    Moore, Oklahoma
    Posts
    464
    Answers
    8
    Vote Rating
    13
    Mthor will become famous soon enough

      0  

    Default


    kitchen sink has an example of this

  3. #3
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    36,811
    Answers
    3467
    Vote Rating
    834
    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


    I'm not sure exactly what you are wanting but if you want the 3 carousels to be side by side then use hbox instead of vbox.
    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: 2