Layout
Что такое Layout
При разработке первых приложений мы уже встречали элемент LinearLayout, который позволяет группировать дочерние элементы в одну линию в автоматическом режиме. Существуют и другие типы контейнеров, позволяющие располагать элементы разными способами. Пришло время познакомиться с ними поближе.
Компоновка (также используются термины разметка или макет) хранится в виде XML-файла в папке /res/layout. Это сделано для того, чтобы отделить код от дизайна, как это принято во многих технологиях (HTML и CSS). Кроме основной компоновки для всего экрана, существуют дочерние элементы компоновки для группы элементов. По сути, компоновка – это некий визуальный шаблон для пользовательского интерфейса вашего приложения, который позволяет управлять элементами управления, их свойствами и расположением. В своей практике вам придется познакомиться со всеми способами размещения. Поэтому здесь мы рассмотрим только базовую часть теории, чтобы вы поняли саму сущность разметки. Кроме того, разметку можно создавать программным способом, который будет описан в конце статьи. Если вы будет обращаться к элементам управления через Java-код, то необходимо присваивать элементам уникальный идентификатор через атрибут android:id. Сам идентификатор назначается через выражение @+id/your_value. После этого вы можете обращаться к элементу через код при помощи метода findViewById(R.id.your_value).
Android Studio включает в себя специальный редактор для создания разметки двумя способами. Редактор имеет две вкладки: одна позволяет увидеть, как будут отображаться элементы управления, а вторая – создавать XML-разметку вручную.
Создавая пользовательский интерфейс в XML-файле, вы можете отделить представление приложения от программного кода. Вы можете изменять пользовательский интерфейс в файле разметки без необходимости изменения вашего программного кода. Например, вы можете создавать XML-разметки для различных ориентаций экрана мобильного устройства (portrait, landscape), размеров экрана и языков интерфейса.
Каждый файл разметки должен содержать только один корневой элемент компоновки, который должен быть объектом View или ViewGroup. Внутри корневого элемента вы можете добавлять дополнительные объекты разметки или виджеты как дочерние элементы, чтобы постепенно формировать иерархию элементов, которую определяет создаваемая разметка.
Виды разметок
Существует несколько стандартных типов разметок:
Все описываемые разметки являются подклассами ViewGroup и наследуют свойства, определённые в классе View.
Комбинирование
Компоновка ведёт себя как элемент управления и их можно группировать. Расположение элементов управления может быть вложенным. Например, вы можете использовать RelativeLayout в LinearLayout и так далее. Но будьте осторожны: слишком большая вложенность элементов управления вызывает проблемы с производительностью.
Можно внедрить готовый файл компоновки в существующую разметку при помощи тега :
Подробнее в отдельной статье Include Other Layout
Программный способ создания разметки
Для подключения созданной разметки используется код в методе onCreate():
Естественно, вы можете придумать и свое имя для файла, а также в приложениях с несколькими экранами у вас будет несколько файлов разметки: game.xml, activity_settings.xml, fragment_about.xml и т.д.
В большинстве случаев вы будете использовать XML-способ задания разметки и подключать его способом, указанным выше. Но, иногда бывают ситуации, когда вам понадобится программный способ (или придётся разбираться с чужим кодом). Вам доступны для работы классы android.widget.LinearLayout, LinearLayout.LayoutParams, а также Android.view.ViewGroup.LayoutParams, ViewGroup.MarginLayoutParams. Вместо стандартного подключения ресурса разметки через метод setContentView(), вы строите содержимое разметки в Java, а затем уже в самом конце передаёте методу setContentView() родительский объект макета:
Число макетов постоянно меняется. Например, недавно появились новые виды CoordinatorLayout и ConstraintLayout. Кроме стандартных элементов разметки существуют и сторонние разработки.
Источник
Основы верстки для нативных андроид приложений
( пользоваться не рекомендуется, deprecated )
AbsoluteLayout — означает что каждый элемент верстки будет иметь абсолютную позицию относительно верхнего левого угла экрана задаваемую с помощью координат x и y. Т.е. верхнийлевый угол экрана при AbsoluteLayout имеет координаты x = 0, y = 0.
Позиция указывается в атрибутах элемента android:layout_x и android:layout_y.
Пример кода:
FrameLayout
FrameLayout — тип верстки внутри которого может отображаться только один элемент в строке. Т.е. если внутри FrameLayout вы поместите несколько элементов, то следующий будет отображаться поверх предыдущего.
Пример кода:
LinearLayout
LinearLayout — тип верстки при котором область верстки делится на строки и в каждую строку помещается один элемент. Разбиение может быть вертикальное или горизонтальное, тип разбиения указывается в атрибуте LinearLayout android:orientation. Внутри верстки возможно комбинировать вертикальную и горизонтальную разбивки, а кроме того, возможна комбинация нескольких разных типов верстки например использование LinearLayout внутри FrameLayout.
Пример вертикальной разбивки LinearLayout:
Пример горизонтальной разбивки LinearLayout:
Комбинация нескольких LinearLayout:
RelativeLayout
RelativeLayout — тип верстки при котором позиционирование элементов происходит относительно друг друга и относительно главного контейнера.
За то, каким образом будут позиционироваться элементы отвечают следующие атрибуты:
Атрибуты позиционирования относительно контейнера
- android:layout_alignParentBottom – Низ элемента находится внизу контейнера
- android:layout_alignParentLeft – Левая часть элемента прилегает к левой части контейнера
- android:layout_alignParentRight – Правая часть элемента прилегает к правой части контейнера
- android:layout_alignParentTop – Элемент находится в верхней части контейнера
- android:layout_centerHorizontal – Элемент позиционируется по центру относительно горизонтального размера контейнера
- android:layout_centerInParent – Элемент позиционируется по центру относительно горизонтального и вертикального размеров размера контейнера
- android:layout_centerVertical – Элемент позиционируется по центру относительно вертикального размера контейнера
Атрибуты позиционирования относительно других элементов.
В качестве значений этих атрибутов ставятся id элемента относительно которого будет производится позиционирование.
android:layout_above – Распологает элемент над указанным
android:layout_below – Распологает элемент под указанным
android:layout_toLeftOf – Распологает элемент слева от указанного
android:layout_toRightOf – Распологает элемент справа от указанного
Выравнивание относительно других элементов.
android:layout_alignBaseline – Выравнивает baseline элемента с baseline указаннго элемента
android:layout_alignBottom – Выравнивает низ элемента по низу указанного элемента
android:layout_alignLeft – Выравнивает левый край элемента с левым краем указанного элемента
android:layout_alignRight – Выравнивает правый край элемента с правым краем указанного элемента
android:layout_alignTop – Выравнивает верхнюю часть элемента в соответствие с верхней частью указанного элемента
TableLayout
TableLayout — табличная верстка.
Организует элементы в строки и столбцы таблицы.
Для организации строк служит таг
Alternate Layouts
Alternate Layouts — альтернативная верстка. Позволяет использовать различную верстку для различных ориентаций экрана.
XML для альтернативной верстки помещается в папки проекта:
res/layout-land – альтернативная верстка для landscape UI
res/layout-port –альтернативная верстка для portrait UI
res/lauout-square – альтернативная верстка для square UI
и перед тем как получить макет из res/lauout система проверяет наличие файлов в этих папках.
И в завершении немного о стилях.
Стили
Во первых стили элемента могут быть описаны в атрибутах самого элемента.
Например:
Кроме того стили можно вынести в отдельный xml файл и сохранить его в папке res/values/
Напимер:
Если мы вынесем стили в отдельный файл, то для описания стилей элемента будем использовать атрибут style.
Источник
Визуальное редактирование разметки внутри Android-приложения
Преамбула
Как это устроено?
Зеркальное дерево разметки. Основная идея – параллельно дереву объектов разметки (View), которое генерирует Android при загрузке Layout, программа создает зеркальное дерево собственных объектов (одноименные классы с префиксом Z – Zview, ZButton,…). Каждый из них имеет ссылку на объект – оригинал. Классы имеют наследование, аналогичное View, и поддерживают весь функционал, связанный с обходом дерева, например, при генерации xml-файлов разметки, создании списков параметров View. Кроме того, зеркальное дерево является основной структурой данных для описания открытого Layout: каждый объект содержит два важных параметра – вектор параметров разметки для View и зеркальный объект-описатель для LayoutParams. 
Параметры View. Исходное многообразие параметров View поддерживается группой классов – наследников ZParam, каждый из них реализует всю специфику внешнего и внутреннего представления параметров данного типа, конвертирования, вызова диалога его редактирования, определения соответствия типам значений в скомпилированном файле. На данный момент реализованы типы – int, hex (16-ричный int), boolean, float, string, charSequence, dimen (размерности), id (идентификатор ресурса), image, color, enumInt (список именованных целых констант), enumString, enumClass (список именованных целых классов). В последнем случае для каждого enum-класса создается свой производный класс.
Вектор параметров для каждого View десериализуется из соответствующего xml-файла, размещенного в assets. Чтобы упростить процедуру создания таких файлов, в приложении имеется компонента, которая для всех View ищет геттеры/сеттеры и по ним создает описание предполагаемых параметров. Затем уже эти файлы редактируются вручную по документации.
Параметры разметки LayoutParams. Для параметров разметки аналогичных файлов описания не существует. Вместо этого для каждого View читается LayoutParams (его тип зависит от типа предка), затем с помощью рефлексии для него генерируется одноименный класс описателя – ZLP и его производные, каждый класс создает вектор параметров и записывает в него значения, считанные из соответствующего LayoutParams.
Скомпилированный xml-файл Layout-а. В файле Android-приложения (apk) xml-файлы описания Layout содержатся в скомпилированном виде. Подробное описание формата имеется на justanapplication.wordpress.com/category/android/android-binary-xml. Несомненные достоинства формата – ограниченное количество внутренних типов данных для параметров, достаточная простота, чтобы пропарсить его доморощенными средствами (например, для просмотра дампа или извлечения параметров в зеркальное дерево разметки). Кроме того, внутренний парсер Android — класс android.content. res.XmlBlock способен создавать View из байтного массива, содержащего данные в аналогичном формате.
Замечание. В самом apk-файле скомпилированные файлы содержатся в сжатом виде. Однако в нашем случае это не важно, т.к. парсер XmlBlock получает их уже разархивированными.
Как это работает?
При старте приложение средствами рефлексии опрашивает Android-классы на предмет сбора необходимых констант и формирует таблицы в виде пар :
- идентификаторы ресурсов из R.java (отдельно по разным типам — подклассам);
- константы классов View;
- android.R.attr – внутренние константы имен для всех параметров;
- android.R.styleable – символьные обозначения констант, используемых в параметрах.
Для всех типов View из xml-файлов, размещенных в assets, десериализуются векторы объектов-описателей параметров (классы ZParam).
Редактирование в общих чертах происходит таком образом. Исходный нередактированный Layout загружается через id ресурса стандартным LayoutInflater. По загруженному View создается зеркальное дерево объектов, для каждого View копируется исходный вектор параметров. Затем собственный CXmlResourceParser, построенный на основе стандартного android.content.res.XmlResourceParser, читает параметры всех View и записывает их в объекты ZParam. Объекты-параметры, значения которых были прочитаны из файла разметки, отмечаются, так что в общем списке параметров они всегда будут выделены. Обработчики событий всех View настраиваются на программный код диалога редактирования.
При изменении любых параметров собственный CXmlParser пишет байтный массив в формате скомпилированного xml-файла, из которого парсер XmlBlock создает измененный View, меняя таким образом картинку Preview. То же самое CXmlParser делает при долговременном сохранении изменений в двоичный файл. При загрузке измененного Layout работает та же самая схема, только с другой парой парсеров: внутренний android.content. res.XmlBlock для загрузки View и собственный CXmlParser – для чтения параметров.
Для внешнего использования разметка может быть экспортирована в обычный xml-файл. Для этого используются собственные средства групп классов ZView и ZParam.
Размещение данных. Все данные размещены в каталоге GUIWizard на SD-карте. Приложение создает каталог с именем собственного пакета. Сгенерированные xml-файлы отредактированной разметки записываются туда с именами Layout-ов. Вспомогательные двоичные файлы скомпилированной разметки с расширением cxml записываются в подкаталог data. Сгенерированные файлы параметров для View записываются в каталог проекта с именами собственных классов (например, android.widget.ImageView.xml).
Замечание. Первоначально предполагалось, что при редактировании измененные параметры будут сразу же записываться сеттерами в соответствующие View, а при их отсутствии – напрямую в приватные поля View. Аналогично, для получения текущих значений полей предполагалось вызывать геттеры. Однако в дальнейшем оказалось, что имеется достаточно много исключений в однозначности «параметр-поле-сеттер-геттер». Например, одному параметру может соответствовать несколько сеттеров, один сеттер может принимать несколько параметров. Поэтому решено было полностью отказаться от взаимодействия объектов ZView – View. Вместо этого после каждого изменения параметра генерируется скомпилированный xml-файл разметки и пишется в байтный поток (т.е. речь не идет о файле в прямом смысле этого слова). Затем парсер XmlBlock создает по нему измененный View.
Рефлексия, как без нее ?
Интеграция с NetBeans
Модуль, встраиваемый в NetBeans, выполняет тривиальную работу. При нажатии дополнительной кнопки он через вызовы ADB просматривает содержимое каталога SDCard/GUIWizard/ . Имя пакета извлекается из файла манифеста текущего проекта, выбранного в окне проектов. Все файлы с расширением .xml копируются в /res/layout и удаляются. Старые версии переименовываются с расширением .orig. Исходники модуля — bitbucket.org/solus_rex/netbeans_guiwizard_plugin
Status quo
Для отладки парсинга скомпилированного файла разметки можно использовать двоичные файлы, содержащиеся в самом приложении. Для этого необходимо разрархивировать apk-файл и скопировать xml-файлы из res/layout в подкаталог GUIWizard/ /data (напомним, что они содержатся там в скомпилированном двоичном формате). В макете можно выполнять побайтное сравнение исходного двоичного файла разметки и файла, сгенерированного программой при совпадении их размерности. Для этого приложение при записи выходного файла сортирует таблицу имен и списки параметров в том порядке, в котором они были в исходном файле.
Источник
