DevPad.RU – записки разработчика

Диспетчер компоновки 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>

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

Диспетчер компоновки 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>

Из кода мы получили такую вот простую табличку

Тяготение – атрибуты 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 и получим кнопку, расположенную по правому краю и с текстом в центре.

<?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>