Kotlin使用TransitionDrawable实现颜色渐变效果流程讲解

 更新时间:2023年02月16日 14:37:16   作者:破浪会有时  
这篇文章主要介绍了Kotlin使用TransitionDrawable实现颜色渐变效果,这里,我们通过TransitionDrawable显示颜色渐变效果,包括背景颜色的变化,以及图片与图片的渐变效果

1 导入需要渐变的图片

如果需要实现图片之间的渐变效果,我们需要两张照片,这样才能实现照片1到照片2的渐变。在路径 /res/values/ 下,我们新建一个 arrays.xml 文件:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <array name="icons">
        <item>@drawable/idea1</item>
        <item>@drawable/idea2</item>
    </array>
</resources>

这个文件包含了两个 item:@drawable/idea1 以及 @drawable/idea2,把它们写在一个 array 里面。这里,我们导入的两张图片的名字分别是 idea1.pngidea2.png,存放于 res/drawable/ 路径下。

从上面两张照片我们可以看到,我们希望通过 TransitionDrawable 呈现出灯泡的开关效果。

2 activity_main.xml

这里例子涉及到的前端由三部分组成,一个 TextView,一个 ImageView,以及一个 Switch,当我们点击了 Switch 按钮,图片的灯光就可以实现亮暗之间的变化,以及字体背景的渐变。

<TextView
    android:id="@+id/textView2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_marginTop="100dp"
    android:text="案例2:灯泡颜色渐变"
    android:textSize="20dp"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/pushButton" />
<ImageView
    android:id="@+id/iv_light"
    android:layout_width="80dp"
    android:layout_height="80dp"
    android:src="@drawable/idea"
    app:layout_constraintBottom_toBottomOf="parent"
    app:layout_constraintHorizontal_bias="0.498"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    app:layout_constraintTop_toBottomOf="@+id/textView2"
    app:layout_constraintVertical_bias="0.218" />
<Switch
    android:id="@+id/switchView"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    app:layout_constraintLeft_toLeftOf="parent"
    app:layout_constraintRight_toRightOf="parent"
    android:layout_marginTop="20dp"
    android:showText="true"
    android:textOff="关"
    android:textOn="开"
    app:layout_constraintTop_toBottomOf="@+id/iv_light"
    tools:ignore="UseSwitchCompatOrMaterialXml" />

3 MainActivity.kt

@SuppressLint("ClickableViewAccessibility", "ResourceType")
override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_main)
    val resources: Resources = resources
    val icons: TypedArray = resources.obtainTypedArray(R.array.icons)
    val drawable = icons.getDrawable(0) // ending image
    val drawableTwo = icons.getDrawable(1) // starting image
    val iconDrawables = arrayOf(drawable,drawableTwo)
    var transitionDrawableIcon = TransitionDrawable(iconDrawables);
    val colorDrawables = arrayOf(ColorDrawable(Color.RED),ColorDrawable(Color.GREEN) )
    var transitionDrawable = TransitionDrawable(colorDrawables)
    switchView.setOnCheckedChangeListener { buttonView, isChecked ->
        iv_light.setImageDrawable(transitionDrawableIcon)
        transitionDrawableIcon.reverseTransition(
            2000
        )
        transitionDrawable.isCrossFadeEnabled = false
        val transitionDrawableTextView = TransitionDrawable(colorDrawables)
        textView2.background = transitionDrawableTextView
        transitionDrawableTextView.startTransition(1000)
    }
}

我们先导入这两张图片,然后这个array作为输入给到 TransitionDrawable 函数:var transitionDrawableIcon = TransitionDrawable(iconDrawables);。对于文字背景也是一个道理,我们需要把需要渐变的颜色先放到一个array里面:val colorDrawables = arrayOf(ColorDrawable(Color.RED),ColorDrawable(Color.GREEN) ),然后再作为输入给到 TransitionDrawable 函数:var transitionDrawable = TransitionDrawable(colorDrawables)。当我们点击 Switch 按钮后,灯泡会变亮(实际上就是两张灯泡之间的颜色渐变),字体背景也会从红色变化到绿色。

到此这篇关于Kotlin使用TransitionDrawable实现颜色渐变效果流程讲解的文章就介绍到这了,更多相关Kotlin颜色渐变效果内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家!

相关文章

  • Android Hilt的使用以及遇到的问题

    Android Hilt的使用以及遇到的问题

    这篇文章主要介绍了Android Hilt的使用以及遇到的问题,帮助大家更好的理解和学习使用Android开发,感兴趣的朋友可以了解下
    2021-04-04
  • Android MotionEvent中getX()和getRawX()的区别实例详解

    Android MotionEvent中getX()和getRawX()的区别实例详解

    这篇文章主要介绍了Android MotionEvent中getX()和getRawX()的区别实例详解的相关资料,需要的朋友可以参考下
    2017-03-03
  • Android 使用地图时的权限请求方法

    Android 使用地图时的权限请求方法

    今天小编就为大家分享一篇Android 使用地图时的权限请求方法,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
    2018-07-07
  • Flutter桌面开发windows插件开发

    Flutter桌面开发windows插件开发

    这篇文章主要为大家介绍了Flutter桌面开发windows插件开发示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-11-11
  • Android仿微信图片点击全屏效果

    Android仿微信图片点击全屏效果

    这篇文章主要为大家详细介绍了Android仿微信图片点击全屏效果的相关资料,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2016-04-04
  • Android视图绑定viewBinding的使用介绍

    Android视图绑定viewBinding的使用介绍

    最近这段时间在学习Kotlin,突然发现谷歌已经把kotlin-android-extensions插件废弃,目前推荐使用ViewBinding来进行替代,接下来通过本文给大家分享Android使用ViewBinding的详细步骤,感兴趣的朋友一起学习吧
    2023-01-01
  • Flutter UI如何使用Provide实现主题切换详解

    Flutter UI如何使用Provide实现主题切换详解

    这篇文章主要给大家介绍了关于Flutter UI如何使用Provide实现主题切换的相关资料,文中通过示例代码介绍的非常详细,对大家学习或者使用Flutter具有一定的参考学习价值,需要的朋友们下面来一起学习学习吧
    2019-04-04
  • Android自定义View之边框文字、闪烁发光文字

    Android自定义View之边框文字、闪烁发光文字

    这篇文章主要为大家详细介绍了Android自定义View之边框文字、闪烁发光文字,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-01-01
  • AndroidStudio图片压缩工具ImgCompressPlugin使用实例

    AndroidStudio图片压缩工具ImgCompressPlugin使用实例

    这篇文章主要为大家介绍了AndroidStudio图片压缩工具ImgCompressPlugin使用实例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2022-08-08
  • Android Studio进行APP图标更改的两种方式总结

    Android Studio进行APP图标更改的两种方式总结

    这篇文章主要介绍了Android Studio进行APP图标更改的两种方式总结,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2020-06-06

最新评论