How to set shape's opacity?

Question

I already know how to set the opacity of the background image but I need to set the opacity of my shape object.

In my Android app, I have it like this:

and I want to make this black area a bit transparent, like here, for example I can see circles though this "Welcome..." :

Here is my shape code:

<?xml version="1.0" encoding="UTF-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android"     android:id="@+id/shape_my"">     <stroke android:width="4dp" android:color="#636161" />     <padding android:left="20dp"         android:top="20dp"         android:right="20dp"         android:bottom="20dp" />     <corners android:radius="24dp" /> </shape> 

How can I do that?

Answer 1

In general you just have to define a slightly transparent color when creating the shape.

You can achieve that by setting the colors alpha channel.

#FF000000 will get you a solid black whereas #00000000 will get you a 100% transparent black (well it isn't black anymore obviously).

The color scheme is like this #AARRGGBB there A stands for alpha channel, R stands for red, G for green and B for blue.

The same thing applies if you set the color in Java. There it will only look like 0xFF000000.

UPDATE

In your case you'd have to add a solid node. Like below.

<?xml version="1.0" encoding="UTF-8"?> <shape xmlns:android="http://schemas.android.com/apk/res/android"     android:id="@+id/shape_my">     <stroke android:width="4dp" android:color="#636161" />     <padding android:left="20dp"         android:top="20dp"         android:right="20dp"         android:bottom="20dp" />     <corners android:radius="24dp" />     <solid android:color="#88000000" /> </shape> 

The color here is a half transparent black.

Answer 2

use this code below as progress.xml:

<layer-list xmlns:android="http://schemas.android.com/apk/res/android">      <item android:id="@android:id/background">         <shape>             <corners android:radius="5dip" />             <gradient                     android:startColor="#ff9d9e9d"                     android:centerColor="#ff5a5d5a"                     android:centerY="0.75"                     android:endColor="#ff747674"                     android:angle="270"             />         </shape>     </item>      <item android:id="@android:id/secondaryProgress">         <clip>             <shape>                 <solid android:color="#00000000" />             </shape>         </clip>     </item>      <item android:id="@android:id/progress">         <clip>             <shape>                 <solid android:color="#00000000" />             </shape>         </clip>     </item>  </layer-list> 

where:

• "progress" is current progress before the thumb and "secondaryProgress" is the progress after thumb.
• color="#00000000" is a perfect transparency
• NOTE: the file above is from default android res and is for 2.3.7, it is available on android sources at: frameworks/base/core/res/res/drawable/progress_horizontal.xml. For newer versions you must find the default drawable file for the seekbar corresponding to your android version.

after that use it in the layout containing the xml:

<SeekBar     android:id="@+id/myseekbar"     ...     android:progressDrawable="@drawable/progress"     /> 

you can also customize the thumb by using a custom icon seek_thumb.png:

android:thumb="@drawable/seek_thumb"