Android 优秀开源框架SuperTextView分享

地址：https://gitee.com/ReferLib/SuperTextView

如何开始使用

在你的build.gradle中加入：

allprojects {
    repositories {
        ...
        maven { url 'https://jitpack.io' }
    }
}

dependencies {
    // 最新：com.github.chenBingX:SuperTextView:v3.2.6
    compile 'com.github.chenBingX:SuperTextView:VERSION_CODE'
}

用这里的真实发行版本号, 替换 VERSION_CODE

特别提示💡

  • v3.2.6 版本支持：armeabi-v7a

  • v3.2.6.64 版本支持：armeabi-v7a、arm64-v8a

  • v3.2.6.99 版本支持：armeabi-v7a、arm64-v8a、x86

  • ⚠️ 特别注意：混淆请加上 -keep class com.coorchice.library.gifdecoder.JNI { *; }

1.基本属性

<com.coorchice.library.SuperTextView
    android:layout_width="50dp"
    android:layout_height="50dp"
    //设置圆角。会同时作用于填充和边框(如果边框存在的话)。
    //如果要设置为圆形，只需要把该值设置为宽或长的1/2即可。
    app:stv_corner="25dp"
    //设置左上角圆角
    app:stv_left_top_corner="true"
    //设置右上角圆角
    app:stv_right_top_corner="true"
    //设置左下角圆角
    app:stv_left_bottom_corner="true"
    //设置右下角圆角
    app:stv_right_bottom_corner="true"
    //设置填充颜色
    app:stv_solid="@color/red"
    //设置边框颜色
    app:stv_stroke_color="@color/black"
    //设置边框的宽度。
    app:stv_stroke_width="2dp"
    //放置一个drawable在背景层上。默认居中显示。
    //并且默认大小为SuperTextView的一半。
    app:stv_state_drawable="@drawable/emoji"
    //设置drawable的显示模式。可选值如下：
    // left、top、right、bottom、center(默认值)、
    //leftTop、rightTop、leftBottom、rightBottom、
    //fill(充满整个SuperTextView，此时会使设置drawable的大小失效)
    app:stv_state_drawable_mode="center"
    //设置drawable的height
    app:stv_state_drawable_height="30dp"
    //设置drawable的width
    app:stv_state_drawable_width="30dp"
    //设置drawble相对于基础位置左边的距离
    app:stv_state_drawable_padding_left="10dp"
    //设置drawble相对于基础位置上边的距离
    app:stv_state_drawable_padding_top="10dp"
    // boolean类型。是否显示drawable。
    //如果你想要设置的drawable显示出来，必须设置为true。
    //当不想让它显示时，再设置为false即可。
    app:stv_isShowState="true"
    //是否开启文字描边功能。
    //注意，启用这个模式之后通过setTextColor()设置的颜色将会被覆盖。
    //你需要通过text_fill_color来设置文字的颜色。
    app:stv_text_stroke="true"
    // 文字的描边颜色。默认为Color.BLACK。
    app:stv_text_stroke_color="@color/black"
    // 文字描边的宽度。
    app:stv_text_stroke_width="1dp"
    // 文字填充的颜色。默认为Color.BLACK。
    app:stv_text_fill_color="@color/blue"
    // boolean类型。是否启用Adjuster功能。
    //具体干什么，需要在Java中为SuperTextView实现一个Adjuster。
    //当你启用这个功能而没有实现自己的Adjuster时，
    //SuperTextView会启用默认的Adjuster。它会按照一定的规则调整文字大小。
    app:stv_autoAdjust="true" />

以上这些属性，均可以在Java中进行动态的设置。同时也能够获得它们的值。例如：

mSuperTextView.setCorner(10);
mSuperTextView.getCorner();

1.1 圆形和边框

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/base"
    android:fitsSystemWindows="true"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="15dp"
        android:gravity="center"
        android:orientation="horizontal">

        <com.coorchice.library.SuperTextView
            android:layout_width="80dp"
            android:layout_height="80dp"
            android:gravity="center"
            android:text="圆角矩形"
            android:textColor="@color/white"
            android:textSize="15sp"
            app:stv_corner="15dp"
            app:stv_solid="#FE7982" />

        <com.coorchice.library.SuperTextView
            android:layout_width="100dp"
            android:layout_height="80dp"
            android:gravity="center"
            android:text="全圆角矩形"
            android:textColor="@color/white"
            android:textSize="15sp"
            app:stv_corner="100dp"
            app:stv_solid="#9103A5" />

        <com.coorchice.library.SuperTextView
            android:layout_width="80dp"
            android:layout_height="80dp"
            android:gravity="center"
            android:text="方形边框"
            android:textColor="@color/white"
            android:textSize="15sp"
            app:stv_solid="#61C5F1"
            app:stv_stroke_color="#5162F3"
            app:stv_stroke_width="5dp" />

        <com.coorchice.library.SuperTextView
            android:layout_width="80dp"
            android:layout_height="80dp"
            android:gravity="center"
            android:text="圆角边框"
            android:textColor="@color/white"
            android:textSize="15sp"
            app:stv_corner="10dp"
            app:stv_solid="#008900"
            app:stv_stroke_color="@color/colorRed"
            app:stv_stroke_width="5dp" />


    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="15dp"
        android:gravity="center"
        android:orientation="horizontal">

        <com.coorchice.library.SuperTextView
            android:layout_width="80dp"
            android:layout_height="80dp"
            android:gravity="center"
            android:text="圆形"
            android:textColor="@color/white"
            android:textSize="15sp"
            app:stv_corner="40dp"
            app:stv_solid="#008971" />

        <com.coorchice.library.SuperTextView
            android:layout_width="80dp"
            android:layout_height="80dp"
            android:gravity="center"
            android:text="圆形边框"
            android:textColor="@color/white"
            android:textSize="15sp"
            app:stv_corner="40dp"
            app:stv_solid="#624CB5"
            app:stv_stroke_color="#BDAD92"
            app:stv_stroke_width="5dp" />

        <com.coorchice.library.SuperTextView
            android:layout_width="80dp"
            android:layout_height="80dp"
            android:gravity="center"
            android:text="圆形边框"
            android:textColor="@color/black"
            android:textSize="15sp"
            app:stv_corner="40dp"
            app:stv_solid="@color/white"
            app:stv_stroke_color="#B31EC2"
            app:stv_stroke_width="5dp" />

        <!--   stv_left_top_corner, stv_right_top_corner等必须要配合stv_corner使用    -->
        <com.coorchice.library.SuperTextView
            android:layout_width="80dp"
            android:layout_height="80dp"
            android:gravity="center"
            android:text="圆角指\n定边框"
            android:textColor="@color/black"
            android:textSize="15sp"
            app:stv_corner="40dp"
            app:stv_left_top_corner="true"
            app:stv_right_top_corner="true"
            app:stv_solid="@color/white"
            app:stv_stroke_color="#B31EC2"
            app:stv_stroke_width="5dp" />

    </LinearLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="15dp"
        android:gravity="center"
        android:orientation="horizontal">

        <!--        stv_state_drawable必须配合stv_isShowState使用     -->
        <com.coorchice.library.SuperTextView
            android:layout_width="80dp"
            android:layout_height="80dp"
            android:gravity="center_horizontal|bottom"
            android:text="图片"
            android:textColor="@color/white"
            android:textSize="15sp"
            app:stv_isShowState="true"
            app:stv_state_drawable="@mipmap/icon_fuel"
            app:stv_state_drawable_height="40dp"
            app:stv_state_drawable_padding_top="-5dp"
            app:stv_state_drawable_width="40dp" />

        <com.coorchice.library.SuperTextView
            android:layout_width="100dp"
            android:layout_height="80dp"
            app:stv_corner="80dp"
            app:stv_isShowState="true"
            app:stv_left_bottom_corner="false"
            app:stv_left_top_corner="true"
            app:stv_right_bottom_corner="false"
            app:stv_right_top_corner="false"
            app:stv_solid="@color/colorGreen"
            app:stv_state_drawable="@mipmap/icon_fuel"
            app:stv_state_drawable_height="30dp"
            app:stv_state_drawable_mode="center"
            app:stv_state_drawable_padding_left="10dp"
            app:stv_state_drawable_padding_top="3dp"
            app:stv_state_drawable_width="30dp"
            app:stv_stroke_color="@color/colorRed"
            app:stv_stroke_width="1dp" />

        <com.coorchice.library.SuperTextView
            android:layout_width="80dp"
            android:layout_height="80dp"
            android:gravity="center"
            android:text="空心文字"
            android:textSize="18sp"
            app:stv_solid="#EDF3E0"
            app:stv_text_fill_color="@color/white"
            app:stv_text_stroke="true"
            app:stv_text_stroke_color="#8C009F"
            app:stv_text_stroke_width="2dp" />

        <com.coorchice.library.SuperTextView
            android:layout_width="80dp"
            android:layout_height="80dp"
            android:gravity="center"
            android:text="文字描边"
            android:textSize="18sp"
            app:stv_solid="#E0ADE6"
            app:stv_text_fill_color="@color/white"
            app:stv_text_stroke="true"
            app:stv_text_stroke_color="#56205D"
            app:stv_text_stroke_width="2dp" />


    </LinearLayout>

</LinearLayout>

1.2 渐变

// 必须设置为true才能启用渐变功能。这意味着你可以灵活的控制这一功能。
app:stv_shaderEnable="true"

// 设置起始颜色。
app:stv_shaderStartColor="@color/main_blue"

// 设置结尾颜色。
app:stv_shaderEndColor="@color/pink"

// 设置渐变模式。如上图可见，一共支持4中模式：
// topTopBottom, bottomToTop, leftToRight, rightToLeft
app:stv_shaderMode="rightToLeft"

当然，这些属性也都提供了对应的set/get方法，供你在Java中动态改变／获取它们的值。比如：

mSuperTextView.setShaderStartColor(Color.RED);

 <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_margin="15dp"
        android:gravity="center"
        android:orientation="vertical">

        <com.coorchice.library.SuperTextView
            android:layout_width="match_parent"
            android:layout_height="80dp"
            android:gravity="center"
            android:text="渐变topToBottom"
            android:textColor="@color/white"
            android:textSize="15sp"
            app:stv_corner="15dp"
            app:stv_shaderEnable="true"
            app:stv_shaderEndColor="#FDBECA"
            app:stv_shaderMode="topToBottom"
            app:stv_shaderStartColor="#27C2F5"
            app:stv_solid="#FE7982" />

        <com.coorchice.library.SuperTextView
            android:layout_width="match_parent"
            android:layout_height="80dp"
            android:layout_marginTop="10dp"
            android:gravity="center"
            android:text="渐变bottomToTop"
            android:textColor="@color/white"
            android:textSize="15sp"
            app:stv_corner="15dp"
            app:stv_shaderEnable="true"
            app:stv_shaderEndColor="#FDBECA"
            app:stv_shaderMode="bottomToTop"
            app:stv_shaderStartColor="#27C2F5"
            app:stv_solid="#FE7982" />

        <com.coorchice.library.SuperTextView
            android:layout_width="match_parent"
            android:layout_height="80dp"
            android:layout_marginTop="10dp"
            android:gravity="center"
            android:text="渐变leftToRight"
            android:textColor="@color/white"
            android:textSize="15sp"
            app:stv_corner="15dp"
            app:stv_shaderEnable="true"
            app:stv_shaderEndColor="#FDBECA"
            app:stv_shaderMode="leftToRight"
            app:stv_shaderStartColor="#27C2F5"
            app:stv_solid="#FE7982" />

        <com.coorchice.library.SuperTextView
            android:layout_width="match_parent"
            android:layout_height="80dp"
            android:layout_marginTop="10dp"
            android:gravity="center"
            android:text="渐变rightToLeft"
            android:textColor="@color/white"
            android:textSize="15sp"
            app:stv_corner="15dp"
            app:stv_shaderEnable="true"
            app:stv_shaderEndColor="#FDBECA"
            app:stv_shaderMode="rightToLeft"
            app:stv_shaderStartColor="#27C2F5"
            app:stv_solid="#FE7982" />
    </LinearLayout>

1.3 按压变色

只需在xml文件中设置以下两个属性就能轻松实现按压变色效果，例如上图那样的：

设置按压时的背景色
app:stv_pressBgColor="@color/red"
设置按压时的文字颜色
app:stv_pressTextColor="@color/white"

2.图片设置

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/base"
    android:fitsSystemWindows="true"
    android:orientation="vertical"
    android:paddingTop="@dimen/dp_15"
    tools:context=".MainActivity">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="horizontal">

        <com.coorchice.library.SuperTextView
            android:layout_width="100dp"
            android:layout_height="100dp"
            app:stv_drawableAsBackground="true"
            app:stv_state_drawable="@drawable/ppp" />

        <com.coorchice.library.SuperTextView
            android:layout_width="100dp"
            android:layout_height="100dp"
            app:stv_corner="15dp"
            app:stv_drawableAsBackground="true"
            app:stv_state_drawable="@drawable/ppp" />

        <com.coorchice.library.SuperTextView
            android:layout_width="100dp"
            android:layout_height="100dp"
            app:stv_corner="15dp"
            app:stv_drawableAsBackground="true"
            app:stv_state_drawable="@drawable/ppp"
            app:stv_stroke_color="#F4E187"
            app:stv_stroke_width="4dp" />

        <com.coorchice.library.SuperTextView
            android:layout_width="100dp"
            android:layout_height="100dp"
            app:stv_corner="50dp"
            app:stv_drawableAsBackground="true"
            app:stv_state_drawable="@drawable/ppp"
            app:stv_stroke_color="#F4E187"
            app:stv_stroke_width="4dp" />

    </LinearLayout>

    <com.coorchice.library.SuperTextView
        android:layout_width="match_parent"
        android:layout_height="60dp"
        android:layout_marginTop="10dp"
        app:stv_corner="50dp"
        app:stv_drawableAsBackground="true"
        app:stv_state_drawable="@drawable/ppp"
        app:stv_state_drawable_mode="center" />

    <com.coorchice.library.SuperTextView
        android:layout_width="200dp"
        android:layout_height="200dp"
        app:stv_corner="100dp"
        app:stv_drawableAsBackground="true"
        app:stv_isShowState2="true"
        app:stv_state_drawable="@drawable/ppp"
        app:stv_state_drawable2="@drawable/ccc"
        app:stv_state_drawable2_height="50dp"
        app:stv_state_drawable2_mode="rightTop"
        app:stv_state_drawable2_width="50dp" />

    <com.coorchice.library.SuperTextView
        android:layout_width="match_parent"
        android:layout_height="200dp"
        android:background="@drawable/bbb"
        app:stv_isShowState="true"
        app:stv_isShowState2="true"
        app:stv_state_drawable="@drawable/ccc"
        app:stv_state_drawable2="@drawable/ppp"
        app:stv_state_drawable2_height="150dp"
        app:stv_state_drawable2_mode="rightTop"
        app:stv_state_drawable2_padding_left="-15dp"
        app:stv_state_drawable2_padding_top="@dimen/dp_15"
        app:stv_state_drawable2_width="150dp"
        app:stv_state_drawable_height="150dp"
        app:stv_state_drawable_mode="leftTop"
        app:stv_state_drawable_padding_left="15dp"
        app:stv_state_drawable_padding_top="15dp"
        app:stv_state_drawable_width="150dp" />

</LinearLayout>

3.图片颜色和选择角度修改

修改 drawable 的颜色
app:stv_state_drawable_tint="@color/gray"

修改 drawable2 的颜色
app:stv_state_drawable2_tint="@color/red"

修改 drawable 的旋转角度
app:stv_state_drawable_rotate="90"

修改 drawable2 的旋转角度
app:stv_state_drawable2_rotate="90"

这些属性也在 Java 中开放了 set/get 接口，便于开发者随时动态的修改它们

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="horizontal">

        <com.coorchice.library.SuperTextView
            android:layout_width="100dp"
            android:layout_height="100dp"
            app:stv_isShowState="true"
            app:stv_state_drawable="@mipmap/icon_fuel"
            app:stv_state_drawable_mode="fill" />

        <com.coorchice.library.SuperTextView
            android:layout_width="100dp"
            android:layout_height="100dp"
            app:stv_isShowState="true"
            app:stv_state_drawable="@mipmap/icon_fuel"
            app:stv_state_drawable_mode="fill"
            app:stv_state_drawable_tint="@color/colorRed" />

        <com.coorchice.library.SuperTextView
            android:layout_width="100dp"
            android:layout_height="100dp"
            app:stv_isShowState="true"
            app:stv_state_drawable="@mipmap/icon_fuel"
            app:stv_state_drawable_mode="fill"
            app:stv_state_drawable_rotate="90"
            app:stv_state_drawable_tint="@color/colorGreen" />

    </LinearLayout>

kotlin:
binding.xxxxx.setDrawableTint(getColor(color.colorRed))

4.渐变文字

是否启用渐变色文字
app:stv_textShaderEnable="true"

设置文字的起始渐变色
app:stv_textShaderStartColor="@color/red"

设置文字的结束渐变色
app:stv_textShaderEndColor="@color/yellow"

设置文字的渐变的模式
leftToRight：左 -> 右
rightToLeft：右 -> 左
topToBottom：上 -> 下
bottomToTop：下 -> 上
app:stv_textShaderMode="leftToRight"

这些属性也在 Java 中开放了 set/get 接口，便于开发者随时动态的修改它们

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/white"
    android:fitsSystemWindows="true"
    android:orientation="vertical"
    android:padding="15dp"
    tools:context=".MainActivity">

    <com.coorchice.library.SuperTextView
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:gravity="center"
        android:text="渐变文字leftToRight"
        android:textSize="20sp"
        app:stv_corner="10dp"
        app:stv_solid="@color/black"
        app:stv_textShaderEnable="true"
        app:stv_textShaderEndColor="#ffff00"
        app:stv_textShaderMode="leftToRight"
        app:stv_textShaderStartColor="#ff0000" />

    <com.coorchice.library.SuperTextView
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_marginTop="10dp"
        android:gravity="center"
        android:text="渐变文字rightToLeft"
        android:textSize="20sp"
        app:stv_corner="10dp"
        app:stv_solid="@color/black"
        app:stv_textShaderEnable="true"
        app:stv_textShaderEndColor="#ffff00"
        app:stv_textShaderMode="rightToLeft"
        app:stv_textShaderStartColor="#ff0000" />

    <com.coorchice.library.SuperTextView
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_marginTop="10dp"
        android:gravity="center"
        android:text="渐变文字topToBottom"
        android:textSize="20sp"
        app:stv_corner="10dp"
        app:stv_solid="@color/black"
        app:stv_textShaderEnable="true"
        app:stv_textShaderEndColor="@color/white"
        app:stv_textShaderMode="topToBottom"
        app:stv_textShaderStartColor="@color/colorRed" />

    <com.coorchice.library.SuperTextView
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_marginTop="10dp"
        android:gravity="center"
        android:text="渐变文字bottomToTop"
        android:textSize="20sp"
        app:stv_corner="10dp"
        app:stv_solid="@color/black"
        app:stv_textShaderEnable="true"
        app:stv_textShaderEndColor="@color/white"
        app:stv_textShaderMode="bottomToTop"
        app:stv_textShaderStartColor="@color/colorRed" />

</LinearLayout>

5.GIF图片

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/white"
    android:fitsSystemWindows="true"
    android:orientation="vertical"
    android:padding="15dp"
    tools:context=".MainActivity">
    <!--在 XML 中配置 Gif-->
    <com.coorchice.library.SuperTextView
        android:id="@+id/stvGif"
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:layout_gravity="center_horizontal"
        app:stv_drawableAsBackground="true"
        app:stv_state_drawable="@drawable/gif2" />

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:orientation="horizontal">

        <Button
            android:id="@+id/btnStart"
            android:layout_width="wrap_content"
            android:layout_height="60dp"
            android:layout_weight="1"
            android:text="start" />

        <Button
            android:id="@+id/btnStop"
            android:layout_width="wrap_content"
            android:layout_height="60dp"
            android:layout_weight="1"
            android:text="stop" />

    </LinearLayout>

    <com.coorchice.library.SuperTextView
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:gravity="center_vertical"
        android:paddingStart="62dp"
        android:paddingEnd="10dp"
        android:text="小火箭发射了！啦啦啦啦啦啦..."
        android:textColor="#ffffff"
        android:textSize="22sp"
        app:stv_corner="6dp"
        app:stv_isShowState="true"
        app:stv_solid="#0D1831"
        app:stv_state_drawable="@drawable/gif3"
        app:stv_state_drawable_height="40dp"
        app:stv_state_drawable_mode="left"
        app:stv_state_drawable_padding_left="10dp"
        app:stv_state_drawable_width="40dp" />

    <!--为 Gif 加上旋转-->
    <com.coorchice.library.SuperTextView
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_marginTop="10dp"
        android:gravity="center_vertical"
        android:paddingStart="62dp"
        android:paddingEnd="10dp"
        android:text="小火箭发射了！啦啦啦啦啦啦..."
        android:textColor="#ffffff"
        android:textSize="22sp"
        app:stv_corner="6dp"
        app:stv_isShowState="true"
        app:stv_solid="#0D1831"
        app:stv_state_drawable="@drawable/gif3"
        app:stv_state_drawable_height="40dp"
        app:stv_state_drawable_mode="left"
        app:stv_state_drawable_padding_left="10dp"
        app:stv_state_drawable_rotate="90"
        app:stv_state_drawable_width="40dp" />
    <!--将 Gif 圆角化-->
    <com.coorchice.library.SuperTextView
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_gravity="center_horizontal"
        app:stv_corner="50dp"
        app:stv_drawableAsBackground="true"
        app:stv_scaleType="center"
        app:stv_state_drawable="@drawable/gif2" />
    <!--为 Gif 加上边框-->
    <com.coorchice.library.SuperTextView
        android:layout_width="350dp"
        android:layout_height="148.4dp"
        android:layout_gravity="center_horizontal"
        android:gravity="center"
        android:text="SuperTextView"
        android:textSize="36dp"
        android:textStyle="bold"
        app:stv_corner="6dp"
        app:stv_drawableAsBackground="true"
        app:stv_isShowState="true"
        app:stv_scaleType="center"
        app:stv_state_drawable="@drawable/gif2"
        app:stv_stroke_color="@color/color_CCCCCC"
        app:stv_stroke_width="5dp"
        app:stv_text_fill_color="#ccffffff"
        app:stv_text_stroke="true"
        app:stv_text_stroke_color="#cc000000"
        app:stv_text_stroke_width="4dp" />

</LinearLayout>

5.1展示 Gif 超简单

在 XML 中配置 Gif , 注意使用：app:stv_drawableAsBackground="true"

<com.coorchice.library.SuperTextView
    android:id="@+id/stv_1"
    android:layout_width="match_parent"
    android:layout_height="150dp"
    app:stv_drawableAsBackground="true"
    app:stv_state_drawable="@drawable/gif_1" />

在代码中配置 Gif

stv_1 = (SuperTextView) findViewById(R.id.stv_1);
stv_1.setDrawable(R.drawable.gif_1);

展示网络 Gif 一样简单

stv_1 = (SuperTextView) findViewById(R.id.stv_1);
stv_1.setUrlImage("http://example.com/images/example.gif");

💡实际上，SuperTextView 的 Drawable1 和 Drawable2 图像展示位，均可用来展示 Gif 图。总之，一切都是你所熟悉的样子。

5.2对 Gif 进行操控

播放/暂停，可以随时控制 Gif 图，播放，或者暂停。

if (stv.getDrawable() instanceof GifDrawable) {
  // 先获取到 GifDrawable 对象
  GifDrawable gifDrawable = (GifDrawable) stv.getDrawable();

  // 播放
  gifDrawable.play();

  // 暂停
  gifDrawable.stop();
}

跳转/获取指定帧

if (stv.getDrawable() instanceof GifDrawable) {
  // 先获取到 GifDrawable 对象
  GifDrawable gifDrawable = (GifDrawable) stv.getDrawable();

  // 跳转到指定帧
  gifDrawable.gotoFrame(pre);

  // 获取指定帧
  Bitmap frame = gifDrawable.getFrame(i);
}

💡由于 SuperTextView 能够支持局部增量渲染，所以当你的 Gif 支持这种渲染模式时，意味着你可能需要通过调用 gifDrawable.setStrict(true) 开启 严格模式，来确保帧跳转或者帧提取的图像是正确的。这可能会花费一些时间，所以你应该尽量将 严格模式 下的操作在异步线程中进行。

SuperTextView 允许你随意的修改 Gif 图的播放速率。

if (stv.getDrawable() instanceof GifDrawable) {
  // 先获取到 GifDrawable 对象
  GifDrawable gifDrawable = (GifDrawable) stv.getDrawable();

  // 设置帧播放间隔时间，20ms
  gifDrawable.setFrameDuration(20);
}

5.3 获取 Gif 信息

获取 Gif 尺寸

// 获取宽度
int width = gifDrawable.getWidth();

// 获取高度
int height = gifDrawable.getHeight();

获取 Gif 帧信息

// 获取帧数
int frameCount = gifDrawable.getFrameCount();

// 获取当前帧间隔
int frameDuration = gifDrawable.getFrameDuration();

// 获取当前渲染到那一帧
int framePotision = gifDrawable.getCurrentFrame();

// 是否在播放
boolean isPlaying = gifDrawable.isPlaying();

5.4 其他 Gif 设置

SuperTextView 凭借对 Gif 渲染的无缝融合，此前 Drawable1 和 Drawable2 的一切配置项，在展示 Gif 图时，也同样能够生效。
旋转角度

app:stv_state_drawable_rotate="90"

Gif 圆角化

<com.coorchice.library.SuperTextView
    android:layout_width="185dp"
    android:layout_height="138.75dp"
    android:layout_gravity="center_horizontal"
    app:stv_corner="20dp"

    // 设置 Gif 作为控件背景
    app:stv_drawableAsBackground="true"

    app:stv_scaleType="fitCenter"

    // 配置 Gif
    app:stv_state_drawable="@drawable/gif_1" />

Gif 加上边框

<com.coorchice.library.SuperTextView
    android:layout_width="350dp"
    android:layout_height="148.4dp"
    android:layout_gravity="center_horizontal"
    android:gravity="center"

    // 加上文字会显的更有格调
    android:text="SuperTextView"

    android:textSize="36dp"
    android:textStyle="bold"
    android:visibility="invisible"
    app:stv_corner="6dp"
    app:stv_drawableAsBackground="true"
    app:stv_isShowState="true"
    app:stv_scaleType="center"
    // 设置边框颜色
    app:stv_stroke_color="@color/opacity_8_gray_4c

    // 设置边框宽度
    app:stv_stroke_width="5dp"

    app:stv_text_fill_color="#ccffffff"
    app:stv_text_stroke="true"
    app:stv_text_stroke_color="#cc000000"
    app:stv_text_stroke_width="2dp"

    // 配置 Gif
    app:stv_state_drawable="@drawable/gif_1"/>

轻松实现动态头像

<com.coorchice.library.SuperTextView
    android:layout_width="80dp"
    android:layout_height="80dp"
    android:layout_marginLeft="30dp"
    app:stv_corner="40dp"

    // 设置为背景图
    app:stv_drawableAsBackground="true"

    // 配置 Gif 头像
    app:stv_state_drawable="@drawable/gif_avatar"

    // 添加边框
    app:stv_stroke_color="#ffffff"
    app:stv_stroke_width="3dp"
    />

在代码中，你可以直接配置一张网络动态头像。

stv.setUrlImage("http://gif_avatar.gif");

5.5 GIF点击监听事件

SuperTextView 通过监控点击动作发生的位置，能够将点击动作准确的定位到所发生的区域中（Drawable1、Drawable2 或者 其它区域），然后触发相应的监听回调。
你可以为 SuperTextView 设置 Drawable 上的点击动作监听器，以便在动作发生时，作出准确的响应。

stv.setOnDrawableClickedListener(new SuperTextView.OnDrawableClickedListener() {
    @Override
    public void onDrawable1Clicked(SuperTextView stv) {
        // Drawable1 clicked，do something...
    }
    @Override
    public void onDrawable2Clicked(SuperTextView stv) {
        // Drawable2 clicked，do something...
    }
});

stv.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        // 非 Drawable 区域被点击，do something...
    }
});

5.6背景图缩放模式支持

现在，当你将 Drawable1 作为背景图时，你可以为它配置不同的缩放模式，以达到你心仪的效果。

stv.setScaleType(ScaleType.CENTER);

SuperTextView 为开发者提供了多达 3 种的缩放模式：

  • ScaleType.FIT_XY 将图片拉伸平铺。
  • ScaleType.FIT_CENTER 将图片剪裁居中。
  • ScaleType.CENTER 将图片自适应居中。默认值。
class MainActivity : AppCompatActivity() {

    companion object {
        private const val TAG = "MainActivity"
    }

    private lateinit var binding: ActivityMainBinding

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        binding = ActivityMainBinding.inflate(layoutInflater)
        setContentView(binding.root)

        //在代码中配置本地 Gif
        //binding.stvGif.setDrawable(R.drawable.gif_1)
        //展示网络 Gif
        //binding.stvGif.setUrlImage("https://p6.itc.cn/q_70/images03/20210120/a0a8e62215a6416bb805292ac52b0d3b.gif")

        if (binding.stvGif.drawable is GifDrawable) {
            // 先获取到 GifDrawable 对象
            val gifDrawable = binding.stvGif.drawable as GifDrawable

            // 获取帧数
            val frameCount = gifDrawable.frameCount
            // 获取当前帧间隔
            val frameDuration = gifDrawable.frameDuration
            // 获取当前渲染到那一帧
            val framePositation = gifDrawable.currentFrame
            // 是否在播放
            val isPlaying = gifDrawable.isPlaying
            Log.d(TAG, "获取帧数: $frameCount --- 获取当前帧间隔: $frameDuration --- 获取当前渲染到那一帧 $framePositation --- 是否在播放: $isPlaying")

            // 获取宽度
            val width = gifDrawable.width
            // 获取高度
            val height = gifDrawable.height
            Log.d(TAG, "获取宽度: $width --- 获取高度: $height")

            // 设置帧播放间隔时间，20ms  随意的修改 Gif 图的播放速率
            //gifDrawable.frameDuration = 20
            // 跳转到指定帧
            //gifDrawable.stop()
            //gifDrawable.gotoFrame(3)
            // 获取指定帧
            //val frame = gifDrawable.getFrame(3)

            binding.btnStart.setOnClickListener {
                // 播放
                gifDrawable.play()
            }

            binding.btnStop.setOnClickListener {
                // 暂停
                gifDrawable.stop()
            }
        }
    }
}

gif素材来源于：https://www.aigei.com/lib/gif/star_2

6.其他配置

6.1Drawable 支持指定层级

<com.coorchice.library.SuperTextView
    ...
    // 配置 Drawable1 的层级
    app:stv_state_drawable_layer="beforeText"
    // 配置 Drawable2 的层级
    app:stv_state_drawable2_layer="afterText"
    ...
    />

支持模式:

  • beforeText，在文字前
  • afterText，在文字后
    Java 中有对应函数支持动态配置

6.2 支持在 XML 中，为 StateDrawable 和 StateDrawable2 设置网络图片

在 XML 中，把网络图片作为背景图

<com.coorchice.library.SuperTextView
  android:id="@+id/stv_40"
  android:layout_width="150dp"
  android:layout_height="150dp"
  android:layout_gravity="center_horizontal"
  android:layout_marginTop="16dp"
  android:gravity="bottom|center"
  android:paddingBottom="1dp"
  android:text="网络背景图"
  android:textColor="#000"
  android:textSize="14sp"
  app:stv_corner="10dp"
  app:stv_isShowState="true"
  app:stv_drawableAsBackground="true"
  app:stv_solid="#f1f1f1"
  app:stv_state_drawable="https://gw.alicdn.com/imgextra/i3/O1CN01suhAFr1cXQX49D2xp_!!6000000003610-0-tps-468-466.jpg" />

在 XML 中，为 StateDrawable2 设置网络图片

<com.coorchice.library.SuperTextView
  android:id="@+id/stv_41"
  android:layout_width="350dp"
  android:layout_height="100dp"
  android:layout_gravity="center_horizontal"
  android:layout_marginTop="30dp"
  android:paddingLeft="116dp"
  android:paddingTop="30dp"
  android:text="StateDrawable2 网络图"
  android:textColor="@color/black"
  android:textSize="14sp"
  app:stv_corner="50dp"
  app:stv_isShowState2="true"
  app:stv_left_bottom_corner="true"
  app:stv_left_top_corner="true"
  app:stv_solid="#f1f1f1"
  app:stv_state_drawable2="https://gw.alicdn.com/imgextra/i3/O1CN01XPmcmt1vJfKcQ8o6O_!!6000000006152-0-tps-500-500.jpg"
  app:stv_state_drawable2_height="100dp"
  app:stv_state_drawable2_mode="left"
  app:stv_state_drawable2_width="100dp"/>
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容