Home > DeveloperSection > Articles > Spinner Field in Sencha Touch

Spinner Field in Sencha Touch


Sencha Touch Sencha Touch 
Ratings:
0 Comment(s)
 4271  View(s)
Rate this:

Spinner Field in Sencha Touch           

In this article, I’m explaining the spinner field in sencha touch and how to use it in our application.

Spinner field wraps an HTML5 number field.

Example

Ext.define('MyApp.view.MyFormPanel', {

    extend: 'Ext.form.Panel',

 

    config: {

        items: [

            {

                xtype: 'titlebar',

                docked: 'top',

                title: 'Spinner Field'

            },

            {

                xtype: 'fieldset',

                instructions: '<code>minValue = 10; maxValue = 30; increment = 2;</code>',

                title: '',

                items: [

                    {

                        xtype: 'spinnerfield',

                        increment: '2',

                        label: 'Spinner Field :',

                        maxValue: 30,

                        minValue: 10

                    }

                ]

            }

        ]

    }

});

 

Output

Spinner Field in Sencha Touch

When you click/tap on the Plus sign tab the value increases:

Spinner Field in Sencha Touch

When you click/tap on the Minus sign tab the value decreases:

Spinner Field in Sencha Touch


Don't want to miss updates? Please click the below button!

Follow MindStick