如何设置形状的不透明度?

我已经知道如何设置背景图像的不透明度,但我需要设置我的形状对象的不透明度。

在我的 Android 应用程序中,我是这样设置的: enter image description here

我想让这个黑色的区域变得透明一点,比如这里,我可以通过这个“欢迎...”看到圆圈:

enter image description here

这是我的形状代码:

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

我该怎么做?

118062 次浏览

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.

Use this one, I've written this to my app,

<?xml version="1.0" encoding="utf-8"?>
<!--  res/drawable/rounded_edittext.xml -->
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle" android:padding="10dp">
<solid android:color="#882C383E"/>
<corners
android:bottomRightRadius="5dp"
android:bottomLeftRadius="5dp"
android:topLeftRadius="5dp"
android:topRightRadius="5dp"/>
</shape>

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"

If someone is trying with Cardview they can try this code.

<androidx.cardview.widget.CardView
android:id="@+id/cvView"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_marginBottom="16dp"
android:shape="ring"
android:visibility="visible"
app:cardCornerRadius="75dp"
app:cardBackgroundColor="@android:color/transparent"
app:layout_constraintBottom_toTopOf="@id/fab"
app:layout_constraintEnd_toEndOf="@+id/fab"
app:layout_constraintStart_toStartOf="@+id/fab">


<ImageView
android:id="@+id/ivImage"
android:orientation="horizontal"
android:layout_width="48dp"
android:layout_height="48dp"
android:layout_gravity="center"
android:padding="@dimen/_10sdp"
android:background="@drawable/custom_circle_shape"
android:src="@drawable/ic_fab_rpt"/>


</androidx.cardview.widget.CardView>

custom_circle_shape.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid android:color="#4D4953D2" />
<corners android:radius="40dp" />
<stroke
android:width="@dimen/_2sdp"
android:color="#7882FA" />
</shape>

Instead of convert alpha to a hex value, we can also use color state list to define alpha.

res/values/colors.xml

<color name="colorPrimary">#0000FF</color>

res/color/color_primary_20.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:alpha="0.2" android:color="?attr/colorPrimary" />
</selector>

res/drawable/a_shape.xml

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<stroke
android:width="2dp"
android:color="@color/color_primary_20" />
</shape>

To set alpha with a theme attribute color like as ?attr/colorSurface:

<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:tint="?attr/colorSurface"> <!-- specify your tint color -->
<solid android:color="#AA000000" /> <!-- instead of `AA` specify your alpha level -->
</shape>

Full alpha changeel

enter image description here