如何为 ImageButton 添加阴影？

Posted 2023-03-05

【中文标题】如何为 ImageButton 添加阴影？

【英文标题】：How can I add shadow to ImageButton?

【发布时间】：2014-10-10 10:57:37

【问题描述】：

这是我第一次发帖。我一直在使用这个网站作为一个很好的资源。 但是我遇到了一个问题。我尝试对 ImageButton 应用阴影效果，但它不起作用？我想要实现的是你可以在浮动气泡上看到的阴影（材料设计）。我有一个圆形 ImageButton，但我希望在它周围添加一个阴影。我怎样才能做到这一点？

这是 circle_button.xml

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

这是 circle_button_pressed.xml

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

这是我的选择器，它将两个可绘制对象合二为一。按钮.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/circle_button"
        android:state_focused="true"
        android:state_pressed="true" />
    <item android:drawable="@drawable/circle_button_pressed"
        android:state_focused="false"
        android:state_pressed="true" />
    <item android:drawable="@drawable/circle_button_pressed"
            android:state_focused="true" />
    <item android:drawable="@drawable/circle_button"
        android:state_focused="false"
        android:state_pressed="false" />
</selector>

这就是我将它应用到我的 ImageButton 的方式

<ImageButton
           android:id="@+id/btn_apply"
           android:layout_
           android:layout_
           android:layout_alignParentTop="true"
           android:layout_alignRight="@+id/scrollView1"
           android:layout_marginRight="45dp"
           android:layout_marginTop="94dp"
           android:adjustViewBounds="true"
           android:background="@drawable/button"
           android:scaleType="fitCenter"
           android:src="@drawable/apply_two" />

又是这样吗？如何为按钮添加阴影？感谢您的宝贵时间。

【问题讨论】：

在 android L 的 imagebutton 中使用 android:elevation="4dp"

【参考方案1】：

可以帮助你： 您可以使用按钮：

<ImageButton
        android:id="@+id/fab"
        android:background="@drawable/ripple"
        android:stateListAnimator="@anim/anim"
        android:src="@drawable/ic_action_add"
        android:elevation="4dp"
        />

ic_action_add 是您的图标。

drawable/ripple.xml 是：

<ripple xmlns:android="http://schemas.android.com/apk/res/android" android:color="?android:colorControlHighlight">
    <item>
        <shape android:shape="oval">
            <solid android:color="?android:colorAccent" />
        </shape>
    </item>
</ripple>

anim/anim.xml 是：

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item
        android:state_enabled="true"
        android:state_pressed="true">
        <objectAnimator
            android:duration="@android:integer/config_shortAnimTime"
            android:propertyName="translationZ"
            android:valueFrom="@dimen/button_elevation"
            android:valueTo="@dimen/button_press_elevation"
            android:valueType="floatType" />
    </item>
    <item>
        <objectAnimator
            android:duration="@android:integer/config_shortAnimTime"
            android:propertyName="translationZ"
            android:valueFrom="@dimen/button_press_elevation"
            android:valueTo="@dimen/button_elevation"
            android:valueType="floatType" />
    </item>
</selector>

Dimens.xml 是：

<resources>
<dimen name="fab_size">56dp</dimen>

<dimen name="button_elevation">2dp</dimen>
<dimen name="button_press_elevation">4dp</dimen>

使用 elevation 属性，您应该通过代码设置 Outline：

public class MainActivity extends Activity 

    @Override
    protected void onCreate(Bundle savedInstanceState) 
        super.onCreate(savedInstanceState);
        setContentView(R.layout.layoutfab);

        //Outline
        int size = getResources().getDimensionPixelSize(R.dimen.fab_size);
        Outline outline = new Outline();
        outline.setOval(0, 0, size, size);
        findViewById(R.id.fab).setOutline(outline);