Scroll Issue in Sencha Touch

0
votes

I have an application where the UI components are added to a formField dynamically. As the UI controls to placed on screen is decided run-time depending on server response, sometime the screen gets filled with multiple components. As the screen elements are added, i required to scroll through the screen to select the fields place to the end of the screen. But when i scroll the form bounces, but the scroll is not happening the way expected. Now i am not able to select the UI controls placed to the end of the form.

The screen has 3 components, Title Bar, Button Dock bar, and a form field. Here is the code i have used for form field

    var formBase = new Ext.form.FormPanel({
                scroll: 'vertical',
                xtype: 'form',
                ui: 'round',
// i have added the items and it shows on UI, As things are dynamic i cant place it here
                items: [{}]; 

    });

Help me to fix the same.

3
sencha-touchextjssencha-touch-2
Are you putting this form inside another panel? Can you share the full code? And after adding items, are you calling formBase.doLayout(); function? - Swar
i have used scroll: 'vertical', pinHeaders: true, and now it is working. - Nilanchala Panigrahy

3 Answers

2
votes

Try this this should work.

 Ext.apply(this, {
            scroll: 'vertical',
            pinHeaders: true,
            dockedItems : [{}],
            items : []
        });
       MyApp.views.MyScreenScreen.superclass.initComponent.call(this);
    },
0
votes

It happens because of the form height. Add height property to the object passed to the FormPanel. Something like this:

height: Ext.Viewport.getWindowHeight()-(the height of other compenents like toolbar)

Example for this would be:

height: Ext.Viewport.getWindowHeight()-50
-1
votes

Adding height config with some value might solve the issue.