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

Question

Я новичок в Дарт и Рикуло.

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

Fire Fox? Ты проверял это с Dartium? Обратите внимание, что вам нужно скомпилировать его в JS, прежде чем вы сможете протестировать его с другими браузерами, кроме Dartium.

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

Answer 2

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

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

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

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

Смотрите также Обзор макета