макет примера scaloid не работает

#android #scala #layout

#Android #скала #планировка

Вопрос:

Мне нравится Scaloid, но я изо всех сил пытаюсь заставить любой макет работать дальше простого вертикального стека элементов пользовательского интерфейса, включая пример их домашней страницы. Это пример кода на сайте scaloid:

    new SVerticalLayout {
      STextView("Sign in").textSize(24.5 sp).<<.marginBottom(25 dip).>>
      STextView("ID")
      SEditText()
      STextView("Password")
      SEditText() inputType TEXT_PASSWORD
      SButton("Sign in")
      this  = new SLinearLayout {
        SButton("Help")
        SButton("Sign up")
      }
    }.padding(20 dip)
 

Чтобы попробовать это, я сделал следующее:

 class MyActivity extends SActivity {

      onCreate {

        contentView = new SVerticalLayout {
          STextView("Sign in").textSize(24.5 sp).<<.marginBottom(25 dip).>>
          STextView("ID")
          SEditText()
          STextView("Password")
          SEditText() inputType TEXT_PASSWORD
          SButton("Sign in")
          this  = new SLinearLayout {
            SButton("Help")
            SButton("Sign up")
          }
        }.padding(20 dip)
      }
}
 

Однако, когда я пытаюсь сделать это на своем телефоне (Nexus 5 в портретной ориентации), кнопка «Зарегистрироваться» не появляется. Кнопка «Справка» занимает всю ширину экрана. Я ожидаю, что SLinearLayout создаст горизонтальный макет, встроенный в SVerticalLayout, и что я увижу две кнопки рядом.

Итак, три вопроса:

1) Верен ли пример со скалоидом?

2) Правильно ли я встраиваю его в свой код? т.е. устанавливаю contentView в SVerticalLayout?

3) Как бы я изменил его, чтобы кнопки справки и регистрации отображались рядом друг с другом в строке?

Ответ №1:

Я автор примера. Это ошибка. Спасибо!

Для каждого виджета android:layout_width="match_parent" android:layout_height="wrap_content" Scaloid по умолчанию установлен параметр. Поскольку кнопка «Справка» заполняет родительский элемент, «Регистрация» не отображается.

Решение заключается в добавлении .wrap . Весь код становится:

 new SVerticalLayout {
  STextView("Sign in").textSize(24.5 sp).<<.marginBottom(25 dip).>>
  STextView("ID")
  SEditText()
  STextView("Password")
  SEditText() inputType TEXT_PASSWORD
  SButton("Sign in")
  this  = new SLinearLayout {
    SButton("Help")
    SButton("Sign up")
  }.wrap
}.padding(20 dip)
 

Функция .wrap применяется WRAP_CONTENT для ширины и высоты:

https://github.com/pocorall/scaloid#methods-fill-and-wrap

Комментарии:

1. Большое спасибо. Было бы полезно добавить примечание о значении по умолчанию в документ readme и объяснение того, что именно . <<wrap.>> работает. Что делает . <<wrap.>> делать?

2. Я добавил описание об этом.

Ответ №2:

Я понял это. Эти две кнопки отображаются подряд, если вы явно задаете их ограничения следующим образом:

 SButton("Help").<<(WRAP_CONTENT, MATCH_PARENT)
 

Исправленный пример:

  contentView = new SVerticalLayout {
    STextView("Sign in").textSize(24.5 sp).<<.marginBottom(25 dip).>>
      STextView("ID")
    SEditText()
    STextView("Password")
    SEditText() inputType TEXT_PASSWORD
    SButton("Sign in")
    this  = new SLinearLayout {
      SButton("Help").<<(WRAP_CONTENT, MATCH_PARENT)
      SButton("Sign up").<<(WRAP_CONTENT, MATCH_PARENT)
    }
  }.padding(20 dip)