Color overlay on drawable Android

寵の児 提交于 2019-12-07 12:31:55

问题


I've been following this tutorial here Medium - Diagonal Cut View to get that diagonal view effect

<?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>

So far the code is the almost the same and the effect is achieved, but only works on Lollipop+, I have searched but cannot find how to have a color overlay on top of an drawable to achieve this same effect and all my tries has being in vain.

The drawable goes in the background property of a RelativeLayout. I have tried to make it in 2 separated ImageView, one for the background image and one for the color overlay, but that doesn't apply the diagonal style right.

How can one achieve this effect for pre-lollipop versions?


回答1:


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

you can also try SRC_ATOPor MULTIPLY depending on desired effect.

========= EDIT ========================

Ok, I think I now better understand what you are asking. It wasn't entirely clear at first.

You aren't asking about a color overlay per-say, or rather, that is not what your problem is. Your problem lies in your reliance on the alpha attribute.

Do this, I have reordered your elements, so that the colored shape goes on top of the image, and instead of making the image transparent, we make the colored shape's color have an specified alpha byte. You can change the color and alpha as you like.

<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>

This is what it looks like in Jelly Bean.



来源:https://stackoverflow.com/questions/39185299/color-overlay-on-drawable-android

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!