是否可以使用CardView为浮动操作按钮制作阴影？

Question

我知道CardView不是为此而做的，但理论上如果cardCornerRadius = view_size / 2它应该导致圆圈。

我错过了什么吗？

Answer 1

绘制真实的动画阴影并不是那么困难，你可以尝试在任何Android到Froyo上实现Lollipop的效果。以下是它的工作原理：

1. 使用LightingColorFilter（0,0）
将视图绘制到屏幕外位图
2. 使用ScriptIntrisincBlur模糊该位图。将模糊半径设置为高程值。
3. 在浮动操作按钮下方绘制模糊的位图。

有关示例实现，请参阅：

• 阴影生成器，模糊视图：https://github.com/ZieIony/Carbon/blob/master/carbon/src/main/java/carbon/shadow/ShadowGenerator.java
• 支持阴影的LinearLayout，请检查drawChild（）方法：https://github.com/ZieIony/Carbon/blob/master/carbon/src/main/java/carbon/widget/LinearLayout.java#L102

基本上碳库试图尽可能好地模仿棒棒糖的效果。我知道导入这样的库可能是一种过度杀伤，但是如果你希望你只能复制代码的有趣部分并在你的应用中使用它。

Answer 2

没有暗示，这是违背模式的。 CardView用于列表。您可以使用Floating Action Button创建自己的ImageView和阴影。

activity_layout.xml：

<LinearLayout 
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    ....
    <ImageButton
            android:id="@+id/add_courses_button"
            android:layout_width="64dp
            android:layout_height="64dp"

            android:layout_alignParentRight="true"
            android:layout_alignParentEnd="true"
            android:layout_alignParentBottom="true"

            android:layout_marginBottom="16dp"
            android:layout_marginRight="16dp"

            android:background="@drawable/fab"
            android:tint="@color/white"
            android:src="@drawable/add_image"/>
    ...
</LinearLayout>

fab.xml：

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_pressed="true">
        <layer-list>
            <!-- Shadow -->
            <item android:top="1dp" android:right="1dp">
                <layer-list>
                    <item>
                        <shape android:shape="oval">
                            <solid android:color="#08000000"/>
                            <padding
                                android:bottom="3px"
                                android:left="3px"
                                android:right="3px"
                                android:top="3px"
                                />
                        </shape>
                    </item>
                    <item>
                        <shape android:shape="oval">
                            <solid android:color="#09000000"/>
                            <padding
                                android:bottom="2px"
                                android:left="2px"
                                android:right="2px"
                                android:top="2px"
                                />
                        </shape>
                    </item>
                    <item>
                        <shape android:shape="oval">
                            <solid android:color="#10000000"/>
                            <padding
                                android:bottom="2px"
                                android:left="2px"
                                android:right="2px"
                                android:top="2px"
                                />
                        </shape>
                    </item>
                    <item>
                        <shape android:shape="oval">
                            <solid android:color="#11000000"/>
                            <padding
                                android:bottom="1px"
                                android:left="1px"
                                android:right="1px"
                                android:top="1px"
                                />
                        </shape>
                    </item>
                    <item>
                        <shape android:shape="oval">
                            <solid android:color="#12000000"/>
                            <padding
                                android:bottom="1px"
                                android:left="1px"
                                android:right="1px"
                                android:top="1px"
                                />
                        </shape>
                    </item>
                    <item>
                        <shape android:shape="oval">
                            <solid android:color="#13000000"/>
                            <padding
                                android:bottom="1px"
                                android:left="1px"
                                android:right="1px"
                                android:top="1px"
                                />
                        </shape>
                    </item>
                    <item>
                        <shape android:shape="oval">
                            <solid android:color="#14000000"/>
                            <padding
                                android:bottom="1px"
                                android:left="1px"
                                android:right="1px"
                                android:top="1px"
                                />
                        </shape>
                    </item>
                    <item>
                        <shape android:shape="oval">
                            <solid android:color="#15000000"/>
                            <padding
                                android:bottom="1px"
                                android:left="1px"
                                android:right="1px"
                                android:top="1px"
                                />
                        </shape>
                    </item>
                    <item>
                        <shape android:shape="oval">
                            <solid android:color="#16000000"/>
                            <padding
                                android:bottom="1px"
                                android:left="1px"
                                android:right="1px"
                                android:top="1px"
                                />
                        </shape>
                    </item>
                </layer-list>
            </item>

            <!-- Blue button pressed -->
            <item>
                <shape android:shape="oval">
                    <solid android:color="#0099cc"/>
                </shape>
            </item>
        </layer-list>
    </item>

    <item android:state_enabled="true">

        <layer-list>
            <!-- Shadow -->
            <item android:top="1dp" android:right="1dp">
                <layer-list>
                    <item>
                        <shape android:shape="oval">
                            <solid android:color="#08000000"/>
                            <padding
                                android:bottom="3px"
                                android:left="3px"
                                android:right="3px"
                                android:top="3px"
                                />
                        </shape>
                    </item>
                    <item>
                        <shape android:shape="oval">
                            <solid android:color="#09000000"/>
                            <padding
                                android:bottom="2px"
                                android:left="2px"
                                android:right="2px"
                                android:top="2px"
                                />
                        </shape>
                    </item>
                    <item>
                        <shape android:shape="oval">
                            <solid android:color="#10000000"/>
                            <padding
                                android:bottom="2px"
                                android:left="2px"
                                android:right="2px"
                                android:top="2px"
                                />
                        </shape>
                    </item>
                    <item>
                        <shape android:shape="oval">
                            <solid android:color="#11000000"/>
                            <padding
                                android:bottom="1px"
                                android:left="1px"
                                android:right="1px"
                                android:top="1px"
                                />
                        </shape>
                    </item>
                    <item>
                        <shape android:shape="oval">
                            <solid android:color="#12000000"/>
                            <padding
                                android:bottom="1px"
                                android:left="1px"
                                android:right="1px"
                                android:top="1px"
                                />
                        </shape>
                    </item>
                    <item>
                        <shape android:shape="oval">
                            <solid android:color="#13000000"/>
                            <padding
                                android:bottom="1px"
                                android:left="1px"
                                android:right="1px"
                                android:top="1px"
                                />
                        </shape>
                    </item>
                    <item>
                        <shape android:shape="oval">
                            <solid android:color="#14000000"/>
                            <padding
                                android:bottom="1px"
                                android:left="1px"
                                android:right="1px"
                                android:top="1px"
                                />
                        </shape>
                    </item>
                    <item>
                        <shape android:shape="oval">
                            <solid android:color="#15000000"/>
                            <padding
                                android:bottom="1px"
                                android:left="1px"
                                android:right="1px"
                                android:top="1px"
                                />
                        </shape>
                    </item>
                    <item>
                        <shape android:shape="oval">
                            <solid android:color="#16000000"/>
                            <padding
                                android:bottom="1px"
                                android:left="1px"
                                android:right="1px"
                                android:top="1px"
                                />
                        </shape>
                    </item>
                </layer-list>
            </item>

            <!-- Blue button -->
            <item>
                <shape android:shape="oval">
                    <solid android:color="#33b5e5"/>
                </shape>
            </item>
        </layer-list>

    </item>

</selector>

结果是这样的：

Answer 3

从技术上讲，这似乎是可能的，但实际上并非如此。

如果你想使用这样的按钮，我建议你使用这个库。它工作得很好。 https://github.com/navasmdc/MaterialDesignLibrary