Как изменить ширину представлений TextBox, используя Rikulo Anchor Layout

Question

Я новичок в Dart и Rikulo.

class NameView extends Section 
{ 
    View parentVu; 

    // the inputs 
    DropDownList titleDdl, suffixDdl; 
    TextBox firstNameTBox, middleNameTBox, lastNameTBox; 

    // the labels 
    TextView titleLbl, firstNameLbl, middleNameLbl, lastNameLbl, suffixLbl; 

    List<String> titles = [ 'Dr', 'Hon', 'Miss', 'Mr', 'Mrs', 'Prof', 'Sir' ]; 
    List<String> suffixes = ['I', 'II', 'III', 'IV', 'Junior', 'Senior']; 

    NameView() 
    { 
    parentVu = new View() 
    ..style.background = 'cyan' 
    ..addToDocument(); 

    titleLbl = new TextView('Title'); 
    parentVu.addChild(titleLbl); 

    titleDdl = new DropDownList(model : new DefaultListModel(titles)) 
     ..profile.anchorView = titleLbl 
     ..profile.location = 'east center'; 
    parentVu.addChild(titleDdl); 

    firstNameLbl = new TextView('First') 
     ..profile.anchorView = titleDdl 
     ..profile.location = 'east center'; 
    parentVu.addChild(firstNameLbl); 

    firstNameTBox = new TextBox(null, 'text') 
     ..profile.anchorView = firstNameLbl 
     ..profile.location = 'east center'; 
     //..profile.width = 'flex'; 
    parentVu.addChild(firstNameTBox); 
} 

Программа оказывает. Однако он не использует всю ширину браузера (FireFox). Я пробовал для TextBoxes profile.width = 'flex'

но он не работает.

Любая помощь приветствуется.

Answer 1

Firefox? Вы тестировали его с помощью Dartium? Обратите внимание, что вам нужно скомпилировать его в JS, прежде чем вы сможете протестировать его с помощью браузеров, отличных от Dartium.

Кстати, из вашей реализации NameView, похоже, не имеет отношения к parentVu вообще. Если это просто контроллер, он не должен распространяться на раздел (т. Е. Он не должен быть представлением).

Answer 2

Если представление привязано к другому, то местоположение и размер будут зависеть от вида, который он закрепляет. В вашем случае, если указать flex для TextBox, его ширина будет такой же, как FirstNameLb1. Вот почему она такая маленькая.

Вы можете прослушивать событие макета, такие как:

firstNameTBox.on.layout.listen((_) { 
    firstNameTBox.width = parentVu.width; 
}); 

Примечание: Вы должны сделать некоторые вычисления, чтобы получить правильную ширину.

Смотрите также Layout Overview