How to customize selected fields in a list in Sencha Touch app?

I have a need to customize the selected fields list in our Sencha Touch application.
For example: I have very long texts so I want to indicate variable height parameter.
So, please help me how can I do it..!

thank you.
Last updated:4/13/2016 1:23:44 AM

1 Answers

Tarun Kumar
Tarun Kumar

To adjust variable height according to the long texts, create a custom css for your selected field list.
Examples:  Use onFocus event on the selected field where you want to change the width of the panel list, like this:

onFocus: function (e)
{
    this.callParent(arguments);
    this.panelList.setWidth(320);
}
OR
You can get the selectfield when the panelList will be shown, like this:
sf = Ext.Viewport.down('selectfield[action=mySelectfield]');
After that set the width of the panel, like this:
sf.panelList.setWidth(320)
OR
You can use css for adjusting width according to the field list, like this:
.x-select-overlay
{
    .x-list
    {
        x-list-item
        {
            ---> you can code other related coding here
        }
    }
}
I hope it will be helpful for you.

Answer