Разметка xml для android

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. Кроме стандартных элементов разметки существуют и сторонние разработки.

Источник

Работа с XML в Android

Очень часто приходится хранить информацию форм и для этого можно использовать xml файлы. В данном уроке мы это и рассмотрим, как можно работать с файлами XML.

Библиотеки Android имеют набор классов для работы с XML-документами с произвольной структурой и содержанием.

Шаг 1.

Для того чтобы упаковать статический XML файл вместе с вашим приложением, вам нужно поместить его в папку: res/xml/

В каталоге res/ создайте подкаталог xml/ в котором будет располагаться наш ХМL-файл.

После чего вы получите возможность обращаться в коде программы к этому документу.

Шаг 2.

Рассмотрим загрузку XML-документа произвольной структуры из ресурсов в код программы.

Создадим приложения, которое будет уметь способность читать список имен, фамилий и телефонов, определенных в XML-файле.

Теперь создадим XML файл который будет хранить Имена, Фамилии и номера телефонов сотрудников фирмы и сохраним его в res/xml/ под именем contacts.xml.

Вот как будут выглядеть XML файл contacts.xml

Шаг 3.

Создадим View состоять она будет с LinearLayout и ListView и назовем main.xml:

Шаг 4.

Загружаем файл contacts.xml, созданный ранее:

Метод getXml() возвращает XmlPullParser, используя который можно прочитать загруженный XML-документ в цикле while:

В конечном итоге ваше приложение должно выглядеть так:

Весь код MyActivity:

Обратите внимание что наследуется MyActivity не от Activity а от ListActivity.

Источник

Разметка xml для android

Разработка под android

Разметка описывает визуальную структуру пользовательского интерфейса, к примеру, для явлений и виджетов. Создать разметку можно двумя способами:

• Описать в XML. Android предоставляет простой набор XML элементов, соответствующих подклассам View.
• Создать элементы интерфейса в коде во время выполнения программы. Вы можете создавать визуальные элементы типа View и ViewGroup и управлять их свойствами программным способом.

Android позволяет гибко использовать эти методы отдельно друг от друга или одновременно для управления пользовательским интерфейсом приложения. Например, вы можете описать элементы экрана в XML, а затем во время выполнения изменить свойства этих объектов.

• Плагин ADT для Eclipse поддерживает предпросмотр XML разметки.
• Попробуйте также утилиту Hierarchy Viewer для отладки разметки.
• Инструмент layoutopt позволяет проводить быстрый анализ разметки и иерархии для поиска неэффективных решений и других проблем.

Преимущество разметки в XML заключается в том, что она позволяет лучшим образом отделить внешний вид интерфейса от кода его поведения. Интерфейс хранится отдельно от кода, что позволяет модифицировать и адаптировать его без необходимости менять код и перекомпилировать его. Например, вы может создать XML разметку для различных экранов или различных языков. Кроме того, описание разметки в XML легче воспринимается визуально и облегчает отладку. Данный урок рассказывает о создании разметки в XML. Если вас интересует создание разметки программным путем, обратитесь к описанию классов View и ViewGroup.

В общем, XML теги для объявления элементов интерфейса следуют структуре и наименованию классов и методов, так названия элементов соответствуют наименованиям классов, а названия атрибутов совпадают с соответствующими методами. В действительности, соответствие зачастую насколько прямое, что вы можете легко догадаться, что атрибут соответствует методу класса и какой класс соответствует заданному XML элементу. Те не менее, обратите внимание, что не все названия идентичны, в некоторых случаях есть небольшие различия. Например, элемент EditText имеет атрибут text , который соответствует методу EditText.setText() .

Создание XML

Используя XML теги, вы можете быстро проектировать пользовательский интерфейс, также как вы создаете web-страницы, применяя HTML — с помощью серии вложенных элементов.

Каждый файл разметки должен включать только один корневой элемент, который является объектом типа View или ViewGroup. Остальные элементы должны быть дочерними по отношению к нему, вы можете создавать иерархию групп и элементов при описании разметки. Например, следующая XML разметка использует вертикальную линейную разметку LinearLayout, в которой размещена кнопка (Button) и текстовая строка (TextView):

Сохраните файл разметки с разрешением .xml в директории res/layout/ вашего проекта. Подробная информация о синтаксисе XML разметки содержится в разделе Ресурс разметки.

Загрузка XML ресурса

При компиляции приложения, каждый XML файл разметки компилируется в ресурс типа View. Вы должны загрузить ресурс разметки в методе обратного вызова Activity.onCreate(). Это делается с помощью метода setContentView(), в который передается в виде аргумента ссылка на ресурс в следующем виде: R.layout.имя_файла_разметки . Например, если XML разметка хранится в файле main_layout.xml , ее можно загрузить следующим образом:

Метод onCreate() вызывается системой Android при запуске явления. Подробнее о жизненном цикле явлений рассказано в разделе Явления.

Атрибуты

Каждый объект типа View и ViewGroup поддерживает собственный набор XML атрибутов. Некоторые атрибуты специфичны для объектов типа View (например, TextView поддерживает атрибут textSize ), но эти атрибуты также наследуются другими объектами, расширяющими данный класс. Некоторые атрибуты являются общими для всех объектов View, поскольку они наследуются от корневого базового класса View (например атрибут id ). А так же существуют другие атрибуты, которые считаются «параметрами разметки» и описывают компоновку и ориентацию View объектов, как это определено в родительском контейнере типа ViewGroup.

Любой объект типа View может иметь уникальный целочисленный идентификатор, ассоциированный с ним. При компиляции приложения, данный идентификатор ссылается на целое число, но как правило идентификатор назначается в XML файле в виде строки с помощью атрибута id . Это общий для всех объектов атрибут, который имеет следующий синтаксис:

Символ собачка «@» указывает XML парсеру, что перед ним идентификатор ресурса. Символ плюс «+» указывает, что данный ресурс новый и для него должен быть добавлен объект в файле R.java . Android предоставляет ряд встроенных ресурсов. При ссылке на них не нужно указывать знак «+», но необходимо добавлять название пакета android :

Добавляя название пакета android , мы таким образом ссылаемся на ресурсы класса android.R , а не на локальный класс ресурсов.

Чтобы создать визуальный компонент и ссылаться на него из приложения, проделайте следующее:

Опишите компонент в файле разметки и присвойте ему уникальный идентификатор:

Затем создайте экземпляр объекта нужного типа и установите для него разметку следующим образом:

Указание идентификаторов важно при использовании относительной разметки (RelativeLayout). В относительной разметке, объекты могут указывать где они располагаются относительно соседей, ссылаясь на них с помощью идентификаторов.

ID не обязательно должен быть уникальным для всего дерево, но должен быть уникальным в пределах части дерева, в котором вы ищите объект (часто поиск происходит по всему дереву, поэтому лучше взять за правило назначать полностью уникальные идентификаторы для всех элементов проекта).

Параметры разметки

XML атрибуты разметки с именем layout_что-нибудь описывают параметры разметки, подходящие для контейнера ViewGroup, в котором располагается элемент View.

Каждый класс ViewGroup имеет внутренний класс ViewGroup.LayoutParams. Этот подкласс включает типы свойств, которые объявляют размер и позицию для каждого дочернего элемента группы. Как видно на рисунке 1, родительский контейнер указывает свойства разметки для каждого дочернего элемента (включая дочернюю подгруппу).

Рисунок 1. представление иерархии визуальных компонентов со свойствами разметки.

Помните, что каждый подкласс LayoutParams имеет свой собственный синтаксис для установки значений. Каждый дочерний элемент должен указывать параметры LayoutParams, который предоставляет его родительский элемент, хотя он может также определять различные параметры разметки для своих собственных дочерних элементов.

Все контейнеры включают ширину и высоту ( layout_width и layout_height ), и каждый элемент view должен их объявлять. Многие классы LayoutParams также включают необязательные параметры отступов и бордюров.

Вы можете указать ширину и высоту с помощью конкретных цифр, однако чаще всего вы будете использовать следующие ключевые слова:

• wrap_content сообщает, что должен быть установлен размер, которого достаточно, чтобы уместить содержимое компонента.
• match_parent(до API 8 fill_parent) сообщает, что компонент должен занять все доступное пространство родителя.

В общем, указывать ширину с помощью абсолютных единиц, вроде пикселей, не рекомендуется. Вместо этого используйте относительные единицы, такие как dp, wrap_content или match_parent. Это гарантирует, что приложение будет правильно отображаться на экранах различных размеров. Принятые типы измерений описаны в разделе Ресурсы.

Позиция разметки

Геометрически визуальный компонент это прямоугольник. Он имеет местоположение, заданное с помощью пары координат слева-сверху, а также размер, заданный как высота и ширина. Единица измерения положения и размера — пиксель.

Можно получить положение элемента с помощью двух методов getLeft() и getTop(). Первый возвращает координату X, второй Y, относительно родительского контейнера.

Кроме того, есть несколько удобных методов, позволяющих избежать ненужных вычислений — getRight() и getBottom(), которые возвращают, соответственно, координату правой и нижней стороны прямоугольника, представляющего компонент. Например getRight() вернет результат, аналогичный следующему выражение: getLeft() + getWidth() .

Размер, поля и отступы

Размер задается с помощью пары ширина и высота. На самом деле компонент имеет две пары ширины и высоты.

Первая пара, известная как измеренная ширина и измеренная высота. Она показывает, как много элемент хочет занять места в его родительском контейнере. Получить измеренные размеры можно с помощью методов getMeasuredWidth() и getMeasuredHeight().

Вторая пара, известная как просто ширина и высота, или иногда нарисованная ширина и нарисованная высота. Она показывает актуальный размер элемента на экране. Это значение может отличаться от измеренного, хотя и не всегда. Может быть получена с помощью методов getWidth() и getHeight().

Для измеренной величины элемента принимается во внимание его поля. Поля задаются в пикселях для левой, верхней, правой и нижней части компонента. Поля могут использоваться для сдвига содержимого на определенное количество пикселей. Например, левое поле равное 2 позволяет сдвинуть содержимое элемента на два пикселя вправо (отодвинуть от левой границы элемента на 2 пикселя). Поля могут быть установлены с помощью метода setPadding(int, int, int, int) и получены с помощью методов getPaddingLeft(), getPaddingTop(), getPaddingRight() и getPaddingBottom().

Несмотря на то, что компоненты могут иметь поля, не существует какой-либо поддержки отступов. Однако, ViewGroup предоставляет такую поддержку. За подробной информацией обратитесь к документации по классам ViewGroup и ViewGroup.MarginLayoutParams.

Подробнее об измерениях смотрите в разделе Другие типы ресурсов.

Популярные контейнеры разметки

Каждый подкласс ViewGroup предоставляет уникальный способ отображения его дочерних элементов. Ниже представлены наиболее часто используемые виды разметки.

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

Линейная разметка (LinearLayout)

Группа для организации элементов по вертикали или горизонтали. Создает полосу прокрутки, если элементы не умещаются.

Относительная разметка (RelativeLayout)

Группа, позволяющая указать расположение элемента относительно его соседей.

WebView

Создание разметки с использованием адаптера

Для динамично изменяющегося содержимого вы можете использовать контейнер, который является подклассом AdapterView, позволяющий создавать элементы во время выполнения. Подкласс AdapterView использует адаптер (Adapter) для связи данных с макетом. Adapter представляет из себя прослойку между источником данных и разметкой типа AdapterView — адаптер получает данные из источника и преобразует каждую запись в визуальный компонент, который может быть добавлен в разметку.

Вот два наиболее популярных типа разметки для работы с адаптером:

ListView

Прокручиваемый список элементов.

GridView

Прокручиваемая сетка (таблица) элементов.

Заполнение контейнера с помощью адаптера

Вы можете заполнить контейнер подкласса AdapterView, такой как ListView или GridView, связав экземпляр AdapterView с объектом Adapter, который получает данные из внешнего источника и создает элемент View для их отображения.

Android предоставляет различные подклассы Adapter, которые удобны для получения различного вида данных. Вот два наиболее популярных из них:

Используется в случае, если данные хранятся в массиве. По умолчанию ArrayAdapter создает визуальные компоненты для каждого элемента массива, вызывая метод toString() и размещая результат в TextView.

Например, если у вас есть массив строк, который вы хотите отобразить в ListView, создайте экземпляр ArrayAdapter с помощью конструктора, указав в нем разметку для каждой строки и сам строковый массив:

Конструктор принимает следующие аргументы:

• Context приложения.
• Разметку, которая содержит TextView для строк массива.
• Строковый массив.

Затем просто вызовите метод setAdapter() для вашего ListView:

Для настройки внешнего вида каждого пункта, вы можете переопределить метод toString() для объекта вашего массива. Вы также можете создать любой другой визуальный компонент для каждого пункта (например ImageView для картинок), расширив класс ArrayAdapter и переопределив метод getView(), чтобы он возвращал нужный тип компонента.

Данный адаптер используется когда данные должны быть получены из курсора (Cursor). При использовании SimpleCursorAdapter вы должны указать разметку, которая будет использоваться для каждой строки курсора, а каждый столбец курсора должен быть вставлен в соответствующий элемент разметки. Например, если вы хотите создать список людей с их номерами телефонов, вы можете выполнить запрос, который вернет объект типа Cursor, включающий строки для каждого из людей и столбцы имени и номера телефона. Затем создается строковый массив, который определяет какие столбцы курсора вы хотите отобразить в разметке, и какие визуальные компоненты разметки использовать для каждого из столбцов:

При создании экземпляра SimpleCursorAdapter, передайте макет, который будет использоваться для каждой строки объекта Cursor, а также два массива, указывающих соответствие столбцов визуальным элементам:

Если в ходе выполнения приложения исходные данные, которые считывает адаптер, изменяются, вы должны вызвать метод notifyDataSetChanged(). Это позволит визуальным компонентам обновить себя.

Источник