Transparent widget background?

Question

In Android widgets, how can I give the background color but make it transparent at the same time? Please see the background on the clock in the screenshot. It is a black but transparent background. How can I do this on my own widget? Can I also possibly refer to system colors, for example, in a screenshot from HTC Sense? Thanks for any hint!

Answer 1

You must specify an alpha channel (= transparency channel) for your resources.

If you use a standard color in your XML-res (for example, from your .xml color) to fill the background, you can specify alpha by changing the first two numbers. Example format:

<color name="transparent_red">#99FF0000</color> 

Here 99 indicates the alpha value, change it to FF, you will get a solid red color by changing it to 00, making the whole color invisible. Just check this by changing the value between them.

See here for more details.

If you want to use the actual image / bitmap, for example, you need to create PNG images with the specified alpha channel. It depends on what software you use to create the bitmap images. I recommended vector graphics programs like Illustrator or Inkscape for this, they have alpha value when you specify the color. Once you have created it, export the PNG image and add it to your resources.

Answer 2

 <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="wrap_content" android:layout_height="wrap_content" android:orientation="vertical" android:background="@android:color/transparent"> <ImageView android:id="@+id/widget_image" android:layout_width="110sp" android:layout_height="110sp" android:layout_gravity="center" android:src="@drawable/appicon" /> </LinearLayout> 

Just set the layout background to transparent. Add below code. This worked for me and his widget.

 android:background="@android:color/transparent" 

Answer 3

android:background="#TTRRGGBB - RR, GG, BB are the (hexadecimal) red, green, blue components, and TT is the transparency component. Use TT = 80 (hex) for 50% transparency, FF for transparency, 00 for full transparent.

Or use png with transparency components, as your screenshot shows.