На этапе дизайна при создании приложения зачастую требуется различная компоновка видимых компонентов. Но на экране в App Inventor, как правило, есть только один вариант размещения компонентов — друг под другом. максимум, что можно сделать, это выровнять содержимое экрана по горизонтали и вертикали. И тут на помощь приходят встроенные компоненты — расположения. Их пять вариантов: горизонтальное, горизонтальное прокручиваемое, вертикальное, вертикальное прокручиваемое, табличное.
Особенности и преимущества расположений
- Возможность размещения компонентов в нужной последовательности.
- Выравнивание внутри расположений может отличаться от общего выравнивания экрана.
- Возможность задавать цвет фона или фоновое изображение.
- Отсутствие программных функциональных блоков, кроме тех, что могут изменять основные свойства.
- Расположения можно вкладывать одно в другое, тем самым формируя сложную структуру.
Исходя из всего вышеперечисленного можно сделать вывод, что расположения — чисто дизайнерский компонент, помогающий правильно сформировать макет приложения.
Теперь подробнее о каждом виде.
Горизонтальное расположение
Горизонтальное расположение позволяет размещать компоненты горизонтально слева направо. Имеет следующие свойства:
- Выравнивание по горизонтали — выравнивание элементов внутри расположения по горизонтали (лево, право, центр).
- Выравнивание по вертикали — выравнивание элементов внутри расположения по вертикали (верх, низ, центр).
- Цвет фона — выбор цвета фона.
- Высота расположения:
- при автоматической высоте высота всего расположения будет равна высоте самого высокого элемента в расположении,
- наполнить родительский — будет заполнена вся свободная высота родительского элемента,
- точное значение в пикселях — высота будет равна точному значению вне зависимости от других размеров внутренних или внешних элементов,
- значение в процентах — высота будет вычислена в процентном соотношении относительно родительского элемента.
- Ширина расположения:
- при автоматической ширине ширина всего расположения будет равна сумме по ширине всех элементов внутри,
- наполнить родительский — будет заполнена вся свободная ширина родительского элемента,
- точное значение в пикселях — ширина будет равна точному значению вне зависимости от других размеров внутренних или внешних элементов,
- значение в процентах — ширина будет вычислена в процентном соотношении относительно родительского элемента.
- Изображение — позволяет установить фоновое изображение.
- Видимый — показывает ли скрывает отображение на экране. Внутренние элементы скрываются автоматически.
В разделе программирования доступны только блоки, изменяющие данные свойства.
Горизонтальное расположение с прокруткой имеет те же свойства, и отличается только 1 условием: если размер расположения выходит за пределы экрана устройства, то в прокручиваемом расположении появится возможность прокрутки, а в другом — не вошедшая в размер экрана часть не будет видна пользователю.
Вертикальное расположение
Вертикальное расположение позволяет размещать компоненты вертикально сверху вниз. Имеет следующие свойства:
- Выравнивание по горизонтали — выравнивание элементов внутри расположения по горизонтали (лево, право, центр).
- Выравнивание по вертикали — выравнивание элементов внутри расположения по вертикали (верх, низ, центр).
- Цвет фона — выбор цвета фона.
- Высота расположения:
- при автоматической высоте высота всего расположения будет равна сумме высот внутренних элементов,
- наполнить родительский — будет заполнена вся свободная высота родительского элемента,
- точное значение в пикселях — высота будет равна точному значению вне зависимости от других размеров внутренних или внешних элементов,
- значение в процентах — высота будет вычислена в процентном соотношении относительно родительского элемента.
- Ширина расположения:
- при автоматической ширине ширина всего расположения будет равна ширине самого широкого элемента расположения,
- наполнить родительский — будет заполнена вся свободная ширина родительского элемента,
- точное значение в пикселях — ширина будет равна точному значению вне зависимости от других размеров внутренних или внешних элементов,
- значение в процентах — ширина будет вычислена в процентном соотношении относительно родительского элемента.
- Изображение — позволяет установить фоновое изображение.
- Видимый — показывает ли скрывает отображение на экране. Внутренние элементы скрываются автоматически.
В разделе программирования доступны только блоки, изменяющие данные свойства.
Вертикальное расположение с прокруткой имеет те же свойства, и отличается только 1 условием: если размер расположения выходит за пределы экрана устройства, то в прокручиваемом расположении появится возможность прокрутки, а в другом — не вошедшая в размер экрана часть не будет видна пользователю.
Табличное расположение
Табличное расположение предоставляет сетку, в которой можно разместить компоненты. Особенность заключается в том, что в одной ячейке можно разместить только один компонент. Если в ячейке размещено более одного элемента, будет показан только последний.
Имеет следующие свойства:
- Столбцы — количество столбцов в таблице.
- Высота:
- при автоматической высоте высота всего расположения будет равна сумме высот внутренних элементов,
- наполнить родительский — будет заполнена вся свободная высота родительского элемента,
- точное значение в пикселях — высота будет равна точному значению вне зависимости от других размеров внутренних или внешних элементов,
- значение в процентах — высота будет вычислена в процентном соотношении относительно родительского элемента.
- Ширина:
- при автоматической ширине ширина всего расположения будет равна сумме по ширине всех элементов внутри,
- наполнить родительский — будет заполнена вся свободная ширина родительского элемента,
- точное значение в пикселях — ширина будет равна точному значению вне зависимости от других размеров внутренних или внешних элементов,
- значение в процентах — ширина будет вычислена в процентном соотношении относительно родительского элемента.
- Строки — количество строк в таблице.
Стоит также учитывать, что:
- Ширина столбца определяется самым широким компонентом в этом столбце. Однако каждый компонент всегда будет заполнять всю ширину занимаемого им столбца.
- Высота строки определяется самым высоким компонентом в этой строке.
В разделе программирования доступны только блоки, изменяющие свойства.
Расположения являются одним из основных макетов, доступных в App Inventor, которые помогают организовать компоненты в вашем приложении. Они предоставляют удобный способ управления размещением и внешним видом компонентов для создания эффективного пользовательского интерфейса.