How to make a transparent black color in a rectangular box. (color is black, but it needs to be transparent and need to show the screen behind)

I have designed link below, but it is fully black. I have changed a clor code, but it is not in black transparent.

Image which I have added as a dropdown is black

enter image description here

If i add any other transparent color it shows as below. Rectangle area get thicked

enter image description here

How can I make the whole as transparent black as below. Also I need the whole black to change to the below color

enter image description here

My Code:

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:right="10dp" android:top="10dp">
        <shape
            android:shape="rectangle">
            <solid android:color="#000000"/>
            <corners
                android:bottomLeftRadius="15dp"
                android:bottomRightRadius="35dp"
                android:topLeftRadius="15dp"
                android:topRightRadius="10dp" />
        </shape>
    </item>
    <item android:right="1dp" android:bottom="10dp" android:bottomRightRadius="100dp">
        <rotate
            android:fromDegrees="-30"
            android:pivotX="100%"
            android:pivotY="0%"
            >
            <shape android:shape="rectangle">
                <solid android:color="@color/black"  />
            </shape>
        </rotate>

    </item>

</layer-list>
3

There are 3 answers

0
MaLa On

Add alpha to the view. No need to edit the shape.

<View
        android:alpha="0.5"
        android:id="@+id/view"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:background="@drawable/shape"/>

This works if you run the application. What the design editor shows is different from what the application shows, so you need to test it!

3
Deep Parsania On
android:background="#CC000000"

in XML

where CC is the alpha value, 00 is the red factor, 00 is the green factor, and 00 is the blue factor.

Some opacity code:

100% — FF
95% — F2
90% — E6
85% — D9
80% — CC
75% — BF
70% — B3
65% — A6
60% — 99
55% — 8C
50% — 80
45% — 73
40% — 66
35% — 59
30% — 4D
25% — 40
20% — 33
15% — 26
10% — 1A
5%  — 0D
0% —  00
2
chand mohd On

Try this:

ic_chat_bubble_24.xml:

<vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="24dp"
    android:height="24dp"
    android:alpha="0.28"// customize on your own
    android:autoMirrored="true"
    android:tint="?attr/colorControlNormal"
    android:viewportWidth="24"
    android:viewportHeight="24">
    <path
        android:fillColor="@android:color/white"
        android:pathData="M20,2H4c-1.1,0 -2,0.9 -2,2v18l4,-4h14c1.1,0 2,-0.9 2,-2V4c0,-1.1 -0.9,-2 -2,-2z" />
</vector>

and rotate it 180 degree

ic_chat.xml

<rotate xmlns:android="http://schemas.android.com/apk/res/android"
    android:drawable="@drawable/ic_baseline_chat_bubble_24"
    android:fromDegrees="180">

</rotate>

output