在Android中对Drawable进行颜色叠加

5

我一直在遵循这个教程 Medium - 对角线剪切视图 来实现那个对角线视图效果。

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

<item android:drawable="@color/colorPrimary"  />

<item>
    <bitmap
        android:src="@drawable/bebe"
        android:gravity="center"
        android:alpha="0.1" />
</item>

<item android:top="260dp"
    android:bottom="-100dp"
    android:left="0dp"
    android:right="-260dp">
    <rotate
        android:fromDegrees="-10"
        android:pivotX="0%"
        android:pivotY="100%">
        <shape
            android:shape="rectangle">
            <solid
                android:color="@android:color/white"/>
        </shape>
    </rotate>
</item>
</layer-list>

到目前为止,代码几乎相同,效果已经实现,但只适用于Lollipop+。我已经搜索过了,但找不到如何在drawable上面覆盖颜色以达到同样的效果,而且我所有的尝试都是徒劳无功。
这个drawable放在RelativeLayout的background属性中。我尝试过将其分成两个ImageView,一个用于背景图像,另一个用于颜色覆盖层,但是不能正确应用对角线样式。
如何在早期版本中实现这种效果?
1个回答

14
Drawable background = relativeLayout.getBackground();
background.setColorFilter(getResources().getColor(R.color.colorAccent), PorterDuff.Mode.SRC_IN);

您也可以尝试使用SRC_ATOPMULTIPLY,具体取决于所需效果。

========= 编辑 ========================

好的,我现在更好地理解了您的问题。一开始并不是完全清楚。

您并不是在询问颜色叠加,或者说,这不是您的问题所在。您的问题在于对 alpha 属性的依赖。

请按照以下方式处理:重新排列元素,使有颜色的形状位于图像上方,而不是使图像透明。我们让有颜色的形状的颜色具有指定的 alpha 字节,您可以根据需要更改颜色和 alpha 值。

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">

    <item>
        <bitmap
            android:gravity="center"
            android:src="@drawable/muse15fence_750"/>
    </item>
    
    <item>
        <shape android:shape="rectangle">
            <solid android:color="#cc3F51B5"/>
        </shape>
    </item>



    <item
        android:bottom="-100dp"
        android:left="0dp"
        android:right="-260dp"
        android:top="260dp">
        <rotate
            android:fromDegrees="-10"
            android:pivotX="0%"
            android:pivotY="100%">
            <shape
                android:shape="rectangle">
                <solid
                    android:color="@android:color/white"/>
            </shape>
        </rotate>
    </item>
</layer-list>

这是在果冻豆中的外观。

测试示例


我已经尝试了你的解决方案,但是在应用颜色叠加效果时,白色对角线切割也被着色,一切看起来像一个巨大的colorAccent矩形。 - Ivan Alburquerque
@IvanAlberto,我已经更新了你的答案。我已经测试过了,它可以正常工作。只需用你的图像和颜色替换我的图像和颜色即可。 - WIllJBD
1
太棒了!这正是我在Lollipop之前一直寻找的效果,有趣的方法,而且非常灵活!不幸的是我无法为答案点赞,但非常感谢你! - Ivan Alburquerque

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接