1. #1
    Sencha User
    Join Date
    Feb 2012
    Posts
    18
    Vote Rating
    0
    amussini@gmail.com is on a distinguished road

      0  

    Question TabBar example and Carousel don't work

    TabBar example and Carousel don't work


    Hi all,
    I copied and pasted a Sencha demo into one app of mine, I tried to modify step by step, inserting some carousels into it. So, any Carousel move at all. So strange...

    html
    Code:
    <!DOCTYPE html><html lang="it-IT">
    <html>
    <head>
        <meta charset="utf-8">
        <title>My app</title>
        
        <link rel="stylesheet" href="touch/resources/css/apple.css" type="text/css"/>    
        <script type="text/javascript" src="touch/sencha-touch-all-debug.js"></script>    
        <script type="text/javascript" src="app/app.js"></script>
    </head>
    <body></body>
    </html>
    app.js
    Code:
    var mycar = Ext.create('Ext.Carousel', {   // fullscreen: true,
        direction: 'vertical',
    	title: 'myVBox',
    	iconCls: 'settings',
    	cls: 'settings',
        defaults: {
            styleHtmlContent: true
        },
    
    
        items: [
            {
                html : 'Item 1',
                style: 'background-color: #759E60'
            },
            {
                html : 'Item 2',
                style: 'background-color: #5E99CC'
            }
        ]
    });
    
    
    var myVBox = Ext.create('Ext.Container', {
        //fullscreen: true,
        layout: 'vbox',
    	title: 'myVBox',
    	iconCls: 'more',
    	cls: 'more',
        items: [
    		{ xtype: 'toolbar', title: 'myfirst'},
            {
    			xtype: 'carousel',
                //html: 'Top item',
    			defaults: {
    				styleHtmlContent: true
    			},
                //style: 'background-color: #5E99CC;',
                flex: 1,
    			items:[
    				{ html: 'ciao ciao'},
    				{ html: 'ciao ciao'},
    				{ html: 'ciao ciao'}
    			]
            },
            {
    			xtype: 'carousel',
                //html: 'Top item',
    			defaults: {
    				styleHtmlContent: true
    			},
                //style: 'background-color: #5E99CC;',
                flex: 1,
    			items:[
    				{ html: 'ciao ciao'},
    				{ html: 'ciao ciao'},
    				{ html: 'ciao ciao'}
    			]
            },
            {
    			xtype: 'carousel',
                //html: 'Top item',
    			defaults: {
    				styleHtmlContent: true
    			},
                //style: 'background-color: #5E99CC;',
                flex: 1,
    			items:[
    				{ html: 'ciao ciao'},
    				{ html: 'ciao ciao'},
    				{ html: 'ciao ciao'}
    			]
            }
        ]
    });
    
    
    
    
    
    
    Ext.application({
        name: 'Sencha',
    
    
        launch: function() {
            //The whole app UI lives in this tab panel
            Ext.Viewport.add({
                xtype: 'tabpanel',
                fullscreen: true,
                tabBarPosition: 'bottom',
    
    
                items: [
                    // This is the home page, just some simple html
                    {
                        title: 'Home',
                        iconCls: 'home',
                        cls: 'home',
    					items: [
    						{ xtype: 'toolbar', title: 'myfirst'}
    					],
                        html: [
                            '<img height=260 src="http://staging.sencha.com/img/sencha.png" />',
                            '<h1>Welcome to Sencha Touch</h1>',
                            "<p>Building the Getting Started app</p>",
                            '<h2>Sencha Touch (2.0.0)</h2>'
                        ].join("")
                    },
    				myVBox,mycar,
                    // This is the recent blogs page. It uses a tree store to load its data from blog.json
                    {
                        xtype: 'nestedlist',
                        title: 'Blog',
                        iconCls: 'star',
                        cls: 'blog',
                        displayField: 'title',
    
    
                        store: {
                            type: 'tree',
    
    
                            fields: ['title', 'link', 'author', 'contentSnippet', 'content', {
                                name: 'leaf',
                                defaultValue: true
                            }],
    
    
                            root: {
                                leaf: false
                            },
    
    
                            proxy: {
                                type: 'jsonp',
                                url: 'https://ajax.googleapis.com/ajax/services/feed/load?v=1.0&q=http://feeds.feedburner.com/SenchaBlog',
                                reader: {
                                    type: 'json',
                                    rootProperty: 'responseData.feed.entries'
                                }
                            }
                        },
    
    
                        detailCard: {
                            xtype: 'panel',
                            scrollable: true,
                            styleHtmlContent: true
                        },
    
    
                        listeners: {
                            itemtap: function(nestedList, list, index, element, post) {
                                this.getDetailCard().setHtml(post.get('content'));
                            }
                        }
                    },
    
    
                    // This is the contact page, which features a form and a button. The button submits the form
                    {
                        xtype: 'formpanel',
                        title: 'Contact Us',
                        iconCls: 'user',
                        url: 'contact.php',
                        layout: 'vbox',
    
    
                        items: [
                            {
                                xtype: 'fieldset',
                                title: 'Contact Us',
                                instructions: 'Email address is optional',
    
    
                                items: [
                                    {
                                        xtype: 'textfield',
                                        label: 'Name',
                                        name: 'name'
                                    },
                                    {
                                        xtype: 'emailfield',
                                        label: 'Email',
                                        name: 'email'
                                    },
                                    {
                                        xtype: 'textareafield',
                                        label: 'Message',
                                        name: 'message',
                                        height: 90
                                    }
                                ]
                            },
                            {
                                xtype: 'button',
                                text: 'Send',
                                ui: 'confirm',
    
    
                                // The handler is called when the button is tapped
                                handler: function() {
    
    
                                    // This looks up the items stack above, getting a reference to the first form it see
                                    var form = this.up('formpanel');
    
    
                                    // Sends an AJAX request with the form data to the url specified above (contact.php).
                                    // The success callback is called if we get a non-error response from the server
                                    form.submit({
                                        success: function() {
                                            // The callback function is run when the user taps the 'ok' button
                                            Ext.Msg.alert('Thank You', 'Your message has been received', function() {
                                                form.reset();
                                            });
                                        }
                                    });
                                }
                            }
                        ]
                    }
                ]
            });
        }
    });
    Is a bug? Is a problem of mine writing it?

    Thanks,
    Ale

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    35,668
    Vote Rating
    746
    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 shouldn't use Ext.create before the launch method fires. You will find if you place the two Ext.create within the launch method it will work for you.
    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.

  3. #3
    Sencha User
    Join Date
    Feb 2012
    Posts
    18
    Vote Rating
    0
    amussini@gmail.com is on a distinguished road

      0  

    Default


    As always, thank you man, I will try it this evening....

Thread Participants: 1

Tags for this Thread

film izle

hd film izle

film sitesi

takipci kazanma sitesi

takipci kazanma sitesi

güzel olan herşey

takipci alma sitesi

komik eğlenceli videolar