6 лет назад

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".  Как видно, они оказались поверх картинки.
6 лет назад

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

6 лет назад

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 простая таблица портретная ориентация

6 лет назад

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 Базовая линия элемента выравнивается по базовой линии другого элемента
6 лет назад

Android. Всё о LinearLayout - 3


Тяготение – атрибуты android:layout_gravity и android:gravity

Тяготение (gravity) по существу является выравниванием. Например, если нужно выровнять текст справа, то нам нужно присвоить атрибуту gravity значение right, а если снизу, то bottom и т.д. Значения можно группировать, через «побитовое или» |, например, bottom|center.

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

 XML значение
 JAVA константа
 Описание
top


Gravity.TOP
Тяготение вверх


bottom


Gravity.BOTTOM


Тяготение вниз
left
Gravity.LEFT
Тяготение влево
right
Gravity.RIGHT
Тяготение вправо

center


Gravity.CENTER

Тяготение по центру, как по горизонтальной, так и по вертикально оси
center_horizontal


Gravity.CENTER_HORIZONTAL
Тяготение по центру горизонтальной оси

center_vertical


Gravity.CENTER_VERTICAL

Тяготение по центру вертикальной оси
clip_horizontal
Gravity.CLIP_HORIZONTAL
Place object in the horizontal center of its container, not changing its size.
clip_vertical
Gravity.CLIP_VERTICAL
Place object in the vertical center of its container, not changing its size.
fill
Gravity.FILL
Grow the horizontal and vertical size of the object if needed so it completely fills its container.
fill_horizontal
Gravity.FILL_HORIZONTAL  Grow the horizontal size of the object if needed so it completely fills its container.
fill_vertical
Gravity.FILL_VERTICAL  Grow the vertical size of the object if needed so it completely fills its container.

Сравнение android:gravity и android:layout_gravity

В Android определены два похожих атрибута тяготения – android:gravity и android:layout_gravity.
Разница между ними состоит в следующем:

  • layout_gravity используется контейнером компоновки и выравнивает сам элемент на экране.
  • gravity используется представлением и занимается выравниванием внутри элемента

Таким образом можно задать у кнопки layout_gravity равным right, а gravity равным center и получим кнопку, расположенную по правому краю и с текстом в центре.

Android latout_gravity

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="vertical"
              android:layout_width="fill_parent"
              android:layout_height="fill_parent">
    <Button
            android:gravity="center"
            android:layout_gravity="right"
            android:layout_height="50dp"
            android:layout_width="100dp"
            android:text="Button"/>
</LinearLayout>
Страницы:
2