Записи с тегом «layout»

показать все записи
5 лет назад

Android. Обзор AbsoluteLayout (устаревшая и не рекомендуемая компоновка)


AbsoluteLayout является контейнером компоновки с абсолютным позиционированием, т. е. нужно явно указывать X и Y координаты вложенных элементов.

Данный контейнер является устаревшим с версии Android 1.5, его не рекомендуется использовать в приложениях и в новых версиях он может пропасть.

Тот, кто программировал для мобильных телефонов на платформе J2ME, наверное скажет, ну и что в этом такого? В JAVA-ME при построении низкоуровнего интерфейса в классе Canvas и GameCanvas, также приходилось указывать абсолютные значения при позиционировании элементов. Дело в том, что Вы можете создать клёвую компоновку для одного экрана, но запустив приложение на другом экране, с другим dpi, она поплывёт и возможно окажется совсем на другом месте и в другом масштабе. В общем использовать не стоит, но про неё я расскажу.

Начнём как всегда с примера.

5 лет назад

Android. Обзор FrameLayout


Диспетчер компоновки FrameLayout в основном используется для динамического вывода одного представления, но его также можно заполнить множеством элементов, наложенных друг на друга. Можно определить один элемент как видимый, а остальные - невидимыми.

Если добавить в компоновку много элементов, то диспетчер FrameLayout просто уложит их в стопку, один поверх другого, причём последний элемент будет наверху. Таким образом, можно получить достаточно интересный интерфейс, чем сейчас и займёмся.

Пример 1
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
             android:layout_width="fill_parent"
             android:layout_height="fill_parent">
    <ImageView
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:scaleType="center"
            android:src="@drawable/pic2"/>
    <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginBottom="20dip"
            android:layout_gravity="center_horizontal|bottom"
            android:padding="12dip"
            android:background="#AA000000"
            android:textColor="#ffffffff"
            android:text="Клёвые туфли"/>
    <ImageView android:layout_width="wrap_content"
               android:layout_height="wrap_content"
               android:src="@drawable/google_plus"
               android:layout_gravity="right|top"
               android:layout_margin="12dip"/>
</FrameLayout>

Пример Android FrameLayout компоновки

Пример очень простой и наглядно показывает преимущества компоновки.
Для начала мы добавили картинку во всю ширину/высоту экрана и добавили текст с подписью и картинку кнопки Google+, а далее используя атрибут android:layout_gravity, выровняли в макете. Текст выровнен по центру горизонтали и по низу экрана android:layout_gravity="center_horizontal|bottom", а кнопка Google+ выровнена по правому краю и сверху экрана android:layout_gravity="right|top".  Как видно, они оказались поверх картинки.
5 лет назад

Android. Обзор TableLayout 2


Продолжаем говорить о контейнере компоновки TableLayout.
В этом обзоре мы разберём атрибуты android:shrinkColumns, android:collapseColumns и напишем программное добавление строк таблицы.

Атрибут android:shrinkColumns

В предыдущем обзоре TableLayout, мы рассмотрели атрибут android:stretchColumns, который отвечал за то, что элементы будут растянуты по всей длине, но что делать если содержимое слишком длинное и занимает всю ширину? Решение есть! Необходимо установить атрибутandroid:shrinkColumns, чтобы переносить содержимое столбца или столбцов, если для других столбцов нужно больше места.

Начнём с примера. Возьмём за основу первый пример из предыдущего поста и изменим немного его, добавив новый атрибут и длинное название для первого и второго столбцов.

Пример 1
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
             android:background="#eeeeee"
             android:stretchColumns="*"
             android:shrinkColumns="0,1"
             android:layout_width="fill_parent"
             android:layout_height="fill_parent">
    <TableRow android:background="#cccccc">
        <TextView android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="Дата заказа"
                  android:gravity="center_horizontal"
                  android:textAppearance="?android:attr/textAppearanceLarge"
                />
        <TextView android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="Количество заказов"
                  android:gravity="center_horizontal"
                  android:textAppearance="?android:attr/textAppearanceLarge"
                />
        <TextView android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="Сумма"
                  android:gravity="center_horizontal"
                  android:textAppearance="?android:attr/textAppearanceLarge"
                />
    </TableRow>
    <TableRow android:padding="5dp">
        <TextView android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="22 ноября"
                  android:gravity="center_horizontal"
                  android:textAppearance="?android:attr/textAppearanceMedium"
                />
        <TextView android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="397"
                  android:gravity="center_horizontal"
                  android:textAppearance="?android:attr/textAppearanceMedium"
                />
        <TextView android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="19039.21"
                  android:gravity="center_horizontal"
                  android:textAppearance="?android:attr/textAppearanceMedium"
                />
    </TableRow>
    <TableRow android:padding="5dp">
        <TextView android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="23 ноября"
                  android:gravity="center_horizontal"
                  android:textAppearance="?android:attr/textAppearanceMedium"
                />
        <TextView android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="348"
                  android:gravity="center_horizontal"
                  android:textAppearance="?android:attr/textAppearanceMedium"
                />
        <TextView android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="16759.28"
                  android:gravity="center_horizontal"
                  android:textAppearance="?android:attr/textAppearanceMedium"
                />
    </TableRow>
    <TableRow android:padding="5dp">
        <TextView android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="24 ноября"
                  android:gravity="center_horizontal"
                  android:textAppearance="?android:attr/textAppearanceMedium"
                />
        <TextView android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="305"
                  android:gravity="center_horizontal"
                  android:textAppearance="?android:attr/textAppearanceMedium"
                />
        <TextView android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="14527.19"
                  android:gravity="center_horizontal"
                  android:textAppearance="?android:attr/textAppearanceMedium"
                />
    </TableRow>
</TableLayout>

Android TableLayout shrinkColumns

5 лет назад

Android. Обзор TableLayout


Диспетчер компоновки TableLayout является расширением компоновки LinearLayout. Этот диспетчер выстраивает вложенные элементы в строки и столбцы, как и в любой таблице.
Для использования этой компоновки, нужно в контейнере TableLayout создать элементы TableRow, которые будут являться строками и выстраиваться вертикально. Внутри TableRow можно размещать другие элементы и они будут выстраиваться горизонтально.

Начнём с простого примера:
Пример 1
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
             android:background="#eeeeee"
             android:stretchColumns="*"
             android:layout_width="fill_parent"
             android:layout_height="fill_parent">
    <TableRow android:background="#cccccc"
              android:padding="5dp">
        <TextView android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="Дата"
                  android:gravity="center_horizontal"
                  android:textAppearance="?android:attr/textAppearanceLarge"
                />
        <TextView android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="Кол-во"
                  android:gravity="center_horizontal"
                  android:textAppearance="?android:attr/textAppearanceLarge"
                />
        <TextView android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="Сумма"
                  android:gravity="center_horizontal"
                  android:textAppearance="?android:attr/textAppearanceLarge"
                />
    </TableRow>
    <TableRow android:padding="5dp">
        <TextView android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="2012-11-22"
                  android:gravity="center_horizontal"
                  android:textAppearance="?android:attr/textAppearanceMedium"
                />
        <TextView android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="397"
                  android:gravity="center_horizontal"
                  android:textAppearance="?android:attr/textAppearanceMedium"
                />
        <TextView android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="19039.21"
                  android:gravity="center_horizontal"
                  android:textAppearance="?android:attr/textAppearanceMedium"
                />
    </TableRow>
    <TableRow android:padding="5dp">
        <TextView android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="2012-11-23"
                  android:gravity="center_horizontal"
                  android:textAppearance="?android:attr/textAppearanceMedium"
                />
        <TextView android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="348"
                  android:gravity="center_horizontal"
                  android:textAppearance="?android:attr/textAppearanceMedium"
                />
        <TextView android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="16759.28"
                  android:gravity="center_horizontal"
                  android:textAppearance="?android:attr/textAppearanceMedium"
                />
    </TableRow>
    <TableRow android:padding="5dp">
        <TextView android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="2012-11-24"
                  android:gravity="center_horizontal"
                  android:textAppearance="?android:attr/textAppearanceMedium"
                />
        <TextView android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="305"
                  android:gravity="center_horizontal"
                  android:textAppearance="?android:attr/textAppearanceMedium"
                />
        <TextView android:layout_width="fill_parent"
                  android:layout_height="wrap_content"
                  android:text="14527.19"
                  android:gravity="center_horizontal"
                  android:textAppearance="?android:attr/textAppearanceMedium"
                />
    </TableRow>
</TableLayout>
Из кода мы получили такую вот простую табличку

Пример TableLayout простая таблица портретная ориентацияПример TableLayout простая таблица портретная ориентация

5 лет назад

Android. Обзор RelativeLayout


С компоновкой LinearLayout разобрались, а теперь приступим к изучению другой популярной компоновки RelativeLayout.

В этой компоновке элементы в контейнере выстраиваются относительно либо контейнера, либо других элементов в этом контейнере.

Рассмотрим XML атрибуты и JAVA константы для выстраивания относительных связей.


Расположение относительно родительского элемента

У атрибута булево значение – true (использовать), false (не использовать – это значение по умолчанию)

Таблица №1
XML атрибут  JAVA константа  Действие
android:layout_centerInParent RelativeLayout.CENTER_IN_PARENT Элемент располагается в центре родительского элемента по горизонтали и вертикали
android:layout_centerHorizontal RelativeLayout.CENTER_HORIZONTAL Элемент располагается в центре родительского элемента по горизонтали
android:layout_centerVertical RelativeLayout.CENTER_VERTICAL Элемент располагается в центре родительского элемента по вертикали
android:layout_alignParentBottom RelativeLayout.ALIGN_PARENT_BOTTOM Нижняя граница элемента располагается на нижней границе контейнера RelativeLayout
android:layout_alignParentLeft RelativeLayout.ALIGN_PARENT_LEFT Левая граница элемента располагается на левой границе  контейнера RelativeLayout
android:layout_alignParentRight RelativeLayout.ALIGN_PARENT_RIGHT Правая граница элемента располагается на правой границе контейнера RelativeLayout
android:layout_alignParentTop RelativeLayout.ALIGN_PARENT_TOP Верхняя граница элемента располагается на верхней границе контейнера RelativLayout
android:layout_alignWithParentIfMissing Если указанный элемент (см. таблицу ниже) не найден, то для выравнивания будет использоваться родительский контейнер компоновки

Расположение относительно других элементов

Значением атрибута является id другого элемента

  • @id/name_id – если id или элемент с этим id уже определен в макете
  • @+id/name_id – если id не определён. Плюс указывает на создание id.
  • R.id.name_id – обращение к id из JAVA
Таблица №2
XML атрибут JAVA константа Действие
android:layout_above RelativeLayout.ABOVE Расположить элемент над указанным ID элемента
android:layout_below RelativeLayout.BELOW Расположить элемент под указанным ID элемента
android:layout_toLeftOf RelativeLayout.LEFT_OF Расположить элемент слева от указанного ID элемента
android:layout_toRightOf RelativeLayout.RIGHT_OF Расположить элемент справа от указанного ID элемента
android:layout_alignBottom RelativeLayout.ALIGN_BOTTOM Нижняя граница элемента выравнивается по нижней границе другого элемента
android:layout_alignLeft RelativeLayout.ALIGN_LEFT Левая граница элемента выравнивается по левой границе другого элемента
android:layout_alignRight RelativeLayout.ALIGN_RIGHT Правая граница элемента выравнивается по правой границе другого элемента
android:layout_alignTop RelativeLayout.ALIGN_TOP Верхняя граница элемента выравнивается по верхней границе другого элемента
android:layout_alignBaseline RelativeLayout.ALIGN_BASELINE Базовая линия элемента выравнивается по базовой линии другого элемента
Страницы:
1