Как добавить текстовое сжатие в android

Цель: Наложение текстового заголовка поверх изображения. Что-то вроде этого:

Текущая реализация: У меня есть CardView, который состоит из ImageView и TextView. Я могу поместить текст поверх изображения, но я не могу получить этот фон.

Проблема: Мне нужен этот фоновый скрим, потому что без него текст нечитаем поверх изображения.

Стек: Android L

Макет XML:

<android.support.v7.widget.CardView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:card_view="http://schemas.android.com/apk/res-auto"
    android:id="@+id/event_cardView"
    android:layout_width="match_parent"
    android:layout_height="200dp"
    android:layout_margin="3dp"
    card_view:cardCornerRadius="10dp"
    card_view:cardElevation="5dp">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:padding="10dp">

        <ImageView
            android:id="@+id/eventImage"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:contentDescription="eventImage"
            android:src="@drawable/sample"
            android:layout_alignParentTop="true" />

        <TextView
            android:id="@+id/eventName"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:padding="2dip"
            android:textColor="#000000"
            android:textSize="15sp"
            android:maxLines="5"
            android:gravity="center"
            android:layout_alignParentBottom="true"
            android:text="Event Name" />
    </RelativeLayout>
</android.support.v7.widget.CardView>

Поблагодарили бы за какие-либо указания за помощь.

Ответы

Ответ 1

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

<?xml version="1.0" encoding="utf-8"?>
<shape
    xmlns:android="http://schemas.android.com/apk/res/android">

    <!-- The content of the shape will go here. -->

</shape>

Если вам нужен сплошной холст, добавьте твердый элемент в элемент формы с атрибутом android:color, установленным на некоторый цвет с альфой.

<solid
    android:color="#88000000"/>

Если вам нужен градиентный холст, добавьте элемент градиента со следующими атрибутами из пространства имен android: angle, centerY, startColor, centerColor, endColor и type. Если вы хотите следовать принципам дизайна материалов, как и в представленном вами изображении, элемент градиента должен иметь следующие значения:

<gradient
    android:angle="90"
    android:centerY="0.3"
    android:startColor="#CC000000"
    android:centerColor="#66000000"
    android:endColor="#00000000"
    android:type="linear"/>

Это хорошая идея, чтобы эти значения были извлечены и помещены в соответствующие файлы ресурсов, такие как dimens.xml и colors.xml, так что scrim может измениться в зависимости от конфигурации устройства.

После того как вы сохранили файл с сохранением формы, вы можете добавить его на задний план вашего TextView с помощью атрибута android:background. Используя TextView, который вы указали, и предположив, что вы назвали файл scrim scrim.xml, модификация будет следующей:

<TextView
    android:id="@+id/eventName"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="2dip"
    android:textColor="#000000"
    android:textSize="15sp"
    android:maxLines="5"
    android:gravity="center"
    android:layout_alignParentBottom="true"
    android:text="Event Name"
    android:background="@drawable/scrim"/>