Как развернуть extjs fileuploadfield виджет

Question

Я использую extjs fileuploadfield (xtype).

Когда я добавить это к моей панели выглядит очень обычный:

текстовое поле должно протянуть до конца «Файл:» ярлык, и в идеале я хотел бы кнопку просмотра больше справа. Вот как я его использую:

   layout: { 
        type: 'anchor' 
       }, 
       items: [ 
        { 
         flex: 1, 
         xtype: 'label', 

         text: 'Upload', 
         style: 'font-weight: bold', 
         height: 22 
        }, 
        { 
         flex: 1, 
         xtype: 'radio', 
         boxLabel: 'Client [Pfad/Dateiname]', 
         name: 'radioradio', 
         itemId:'RadioClientUploadWindow', 
         checked: 'true' 
        }, { 
         flex: 1, 
         xtype: 'fileuploadfield', 
         id: 'filedata', 
         emptyText: 'Select a document to upload...', 
         fieldLabel: 'File ', 
         buttonText: 'Browse ' 
        }, 

Есть ли способ сделать этот компонент достаточно разумным?

Answer 1

Оливер,

При проектировании формы, Сенча имел в виду, что вы бы иметь много полей в форме, поэтому все метки имеют одинаковую ширину сделать единообразный вид на экране.

Ваша форма выглядит странно, потому что у вас только одно поле формы. Чтобы настроить свою ширину, просто установите labelWidth на все, что подходит вашей форме (я считаю, что 40 будет для вас правильным), также, я не думаю, что настройка flex работает с макетом anchor, попробуйте заменить ее anchor: 100%. Это должно сделать ваше поле выглядит лучше:

{ 
    xtype: 'fileuploadfield', 
    anchor: '100%', 
    labelWidth: 40, 
    id: 'filedata', 
    emptyText: 'Select a document to upload...', 
    fieldLabel: 'File ', 
    buttonText: 'Browse ' 
}