Есть ли способ сделать тень Material-style в API <21 (5.0 Lolipop)?

Материал дизайна делает большой акцент на метафоре "листов бумаги". Чтобы сделать это, тени необходимы. Поскольку дизайн материалов является философией и не API (несмотря на то, что он встроен в L), это должно быть сделано в любом месте (Windows Forms, HTML/CSS и т.д.). Как это сделать в Android API от 14 до 20?

Обратите внимание, что готовые PNG не будут действительно практичными для круговых и других неквадратных фигур.

Ответ 1

Если вас не беспокоит обратная совместимость с Lollipop, вы можете установить атрибут высоты непосредственно в XML

    android:elevation="10dp"

В противном случае вы должны установить его на Java, используя библиотеку support.v4.ViewCompat.

    ViewCompat.setElevation(myView, 10);

и добавьте это в свой build.gradle

    compile 'com.android.support:support-v4:21.+'

http://developer.android.com/reference/android/support/v4/view/ViewCompat.html#setElevation(android.view.View,%20float)

Ответ 2

вот только грубая выборка...

<?xml version="1.0" encoding="utf-8"?>

<!-- Drop Shadow Stack -->
<item>
    <shape android:shape="oval">
        <corners android:radius="64dp"/>
        <solid android:color="#009A3D"/>
        <size
            android:width="64dp"
            android:height="64dp"/>
        <padding
            android:top="1dp"
            android:right="1dp"
            android:bottom="1dp"
            android:left="1dp"/>
        <solid android:color="#00CCCCCC"/>
    </shape>
</item>
<item>
    <shape android:shape="oval">
        <corners android:radius="64dp"/>
        <solid android:color="#009A3D"/>
        <size
            android:width="64dp"
            android:height="64dp"/>
        <padding
            android:top="1dp"
            android:right="1dp"
            android:bottom="1dp"
            android:left="1dp"/>
        <solid android:color="#10CCCCCC"/>
    </shape>
</item>
<item>
    <shape android:shape="oval">
        <corners android:radius="64dp"/>
        <solid android:color="#009A3D"/>
        <size
            android:width="64dp"
            android:height="64dp"/>
        <padding
            android:top="1dp"
            android:right="1dp"
            android:bottom="1dp"
            android:left="1dp"/>
        <solid android:color="#20CCCCCC"/>
    </shape>
</item>
<item>
    <shape android:shape="oval">
        <corners android:radius="64dp"/>
        <solid android:color="#009A3D"/>
        <size
            android:width="64dp"
            android:height="64dp"/>
        <padding
            android:top="1dp"
            android:right="1dp"
            android:bottom="1dp"
            android:left="1dp"/>
        <solid android:color="#30CCCCCC"/>
    </shape>
</item>
<item>
    <shape android:shape="oval">
        <corners android:radius="64dp"/>
        <solid android:color="#009A3D"/>
        <size
            android:width="64dp"
            android:height="64dp"/>
        <padding
            android:top="1dp"
            android:right="1dp"
            android:bottom="1dp"
            android:left="1dp"/>
        <solid android:color="#50CCCCCC"/>
    </shape>

</item>

<!-- Background -->
<item>
    <shape android:shape="oval">

        <corners android:radius="64dp"/>
        <solid android:color="#009A3D"/>
        <size
            android:width="64dp"
            android:height="64dp"/>
    </shape>
</item>

В вашем файле макета вы можете использовать его...

<Button
        android:id="@+id/add_btn"

        android:text="+"
        android:textColor="#FFFDFC"
        android:textSize="44sp"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:layout_marginRight="50dp"
        android:layout_marginBottom="40dp"
        android:layout_width="64dp"
        android:layout_height="64dp"
        android:clickable="true"
        android:enabled="true"
        android:singleLine="false"
        android:layout_alignParentTop="false"
        android:background="@drawable/round_button"/>

Ответ 3

Рендеринг теней на pre-Lollipop непросто, но возможно. Фокус в том, что тень - это просто черная, размытая форма зрения. Вы можете сделать это сами.

  • Нарисуйте ваш теневой вид на растровое изображение с помощью LightingColorFilter (0,0) set
  • Размыть его с помощью ScriptIntrisincBlur
  • Нарисуйте фигуру
  • Нарисуйте представление поверх формы

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

Ответ 4

Кнопка плавающего действия (с тенью) может быть эмулирована на старых платформах с помощью простого класса java.

Я использую версию Faiz Malkani здесь: https://github.com/FaizMalkani/FloatingActionButton

[Обратите внимание, что для его совместимости с Gingerbread вам нужно будет поместить некоторые версии проверки SDK вокруг вызовов анимации и прозрачности в его коде.]

Ответ 5

Вы можете использовать android.support.v7.widget.CardView.

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

private View.OnTouchListener touch = new View.OnTouchListener() {

    @Override
    public boolean onTouch(View v, MotionEvent event) {

        final android.support.v7.widget.CardView card_view = (android.support.v7.widget.CardView) ((View) v.getParent()).findViewById(R.id.card_view);


        switch (event.getAction()) {

            case MotionEvent.ACTION_DOWN:

                card_view.setCardElevation(6);
                card_view.setScaleX(1.007f);
                card_view.setScaleY(1.007f);
                break;
            case MotionEvent.ACTION_CANCEL:
            case MotionEvent.ACTION_UP:

                card_view.setCardElevation(3);
                card_view.setScaleX(1f);
                card_view.setScaleY(1f);
                break;
        }
        return false;
    }
};

В xml файле я использую:

<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"

android:id="@+id/card_view"
android:layout_width="match_parent"
android:layout_height="match_parent"

card_view:cardCornerRadius="2dp"
card_view:cardMaxElevation="6dp"
card_view:cardElevation="3dp">