Android如何让TextView中的文本结尾透明

Question

我在 Google Play 应用程序中发现了一个有趣的设计功能。

正如您在这张图片中看到的那样，文本通过一些渐变变得不可见。我怎样才能在我的应用程序中做类似的事情？

Answer 1

可以通过使 View 重叠 TextView 背景透明渐变来实现，如下所示：

在 drawable 文件夹中创建一个 xml 并命名为 "gradient":

<?xml version="1.0" encoding="utf-8"?>
    <shape xmlns:android="http://schemas.android.com/apk/res/android">
        <gradient 
            android:startColor="#FFFFFF"
            android:centerColor="#88FFFFFF"
            android:endColor="#FFFFFFFF"
            android:angle="90"
            android:dither="true"
         />
    </shape>

"FFFFFF" 之前的附加十六进制值为颜色提供了一个可被视为透明度或不透明度的 alpha 参数。现在在重叠布局的 View 中写入 android:background="@drawable/gradient" 我还没有测试过它，但它应该可以工作。当然，请确保扩展与 android:layout_marginLeft="20dp" 重叠的 View。

Answer 2

我会使用这样的颜色渐变

color_gradient.xml

<shape android:shape="rectangle"
   xmlns:android="http://schemas.android.com/apk/res/android">
    <gradient
        android:startColor="#ffffff"
        android:endColor="#00ffffff"
        android:angle="180"/>
</shape>

例如第一行：

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="120dp">

    <LinearLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_centerVertical="true"
        android:orientation="vertical">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Hello World HelloWorld HelloWorld"
           android:textAppearance="@style/Base.TextAppearance.AppCompat.Title"
            />

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Hello World HelloWorld HelloWorld"
            android:textAppearance="@style/Base.TextAppearance.AppCompat.Subhead"
        />
    </LinearLayout>

    <View
        android:id="@+id/gradient"
        android:layout_width="60dp"
        android:layout_height="match_parent"
        android:layout_toStartOf="@+id/button_box"
        android:background="@drawable/color_gradient"/>

    <FrameLayout
        android:id="@+id/button_box"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_alignParentEnd="true"
        android:padding="16dp"
        android:background="#ffffff">
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            android:padding="8dp"
            android:text="Tout mettre a jour"
            android:textColor="#ffffff"
            android:background="#22bb66"/>
    </FrameLayout>
</RelativeLayout>

请注意布局有多种选择。这种方法的中心思想是使渐变可绘制加上包含 Button 的白框与 TextViews

重叠

Answer 3

一个（更有效的）选项是覆盖 onDraw 并仅在视图顶部绘制渐变：

   @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);

        Paint paint = new Paint();
        paint.setShader(new LinearGradient(0, 0, 0, getHeight(),
                        Color.WHITE, Color.TRANSPARENT, Shader.TileMode.CLAMP));
        canvas.drawPaint(paint);
    }

注意：如果您的视图是布局，请改写 dispatchDraw(Canvas canvas)。

Android如何让TextView中的文本结尾透明

How to make the end of the text in TextView transparent in Android

android

textview