Android描边外框stroke边线、rotate旋转、circle圆形图的简洁通用方案,基于Glide与ShapeableImageView,Kotlin

Android描边外框stroke边线、rotate旋转、circle圆形图的简洁通用方案,基于Glide与ShapeableImageView,Kotlin

利用ShapeableImageView专门处理圆形和外框边线的特性,通过Glide加载图片装载到ShapeableImageView。注意,因为要描边,在xml定义ShapeableImageView时候,padding值与stroke值要保持一直,否则,圆图会在某些边缘地方被切边。

旋转的话,可以在上层Kotlin代码设置rotation(动态设置,灵活),旋转ShapeableImageView;也可以在xml里面写死rotation值(静态配置,不灵活)。

ShapeableImageView通过配置shapeAppearance改造成圆形图。

XML 复制代码
<?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"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <com.google.android.material.imageview.ShapeableImageView
        android:id="@+id/image1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:background="@drawable/ic_launcher_background"
        android:padding="30px"
        android:src="@drawable/ic_launcher_foreground"
        app:shapeAppearance="@style/rounded_style"
        app:strokeColor="@android:color/holo_red_dark"
        app:strokeWidth="30px" />

    <com.google.android.material.imageview.ShapeableImageView
        android:id="@+id/image2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:background="@drawable/ic_launcher_background"
        android:padding="30px"
        android:src="@drawable/ic_launcher_foreground"
        app:shapeAppearance="@style/rounded_style"
        app:strokeColor="@android:color/holo_red_dark"
        app:strokeWidth="30px" />

    <com.google.android.material.imageview.ShapeableImageView
        android:id="@+id/image3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:background="@drawable/ic_launcher_background"
        android:padding="30px"
        android:src="@mipmap/pic1"
        app:shapeAppearance="@style/rounded_style"
        app:strokeColor="@android:color/holo_red_dark"
        app:strokeWidth="30px" />

    <com.google.android.material.imageview.ShapeableImageView
        android:id="@+id/image4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:background="@drawable/ic_launcher_background"
        android:padding="30px"
        android:rotation="-30"
        android:src="@mipmap/pic1"
        app:shapeAppearance="@style/rounded_style"
        app:strokeColor="@android:color/holo_red_dark"
        app:strokeWidth="30px" />

    <com.google.android.material.imageview.ShapeableImageView
        android:id="@+id/image5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:background="@drawable/ic_launcher_background"
        android:padding="30px"
        android:rotation="-30"
        android:scaleType="centerCrop"
        android:src="@mipmap/pic1"
        app:shapeAppearance="@style/rounded_style"
        app:strokeColor="@android:color/holo_red_dark"
        app:strokeWidth="30px" />

</LinearLayout>

styles.xml:

XML 复制代码
<?xml version="1.0" encoding="utf-8"?>
<resources xmlns:xliff="urn:oasis:names:tc:xliff:document:1.2">

    <style name="rounded_style">
        <item name="cornerFamily">rounded</item>
        <item name="cornerSize">50%</item>
    </style>
</resources>
Kotlin 复制代码
import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import com.bumptech.glide.load.resource.bitmap.CenterCrop
import com.google.android.material.imageview.ShapeableImageView


class MainActivity : AppCompatActivity() {
    companion object {
        const val DEGREE = -60
        const val SIZE = 500
    }

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val iv1 = findViewById<ShapeableImageView>(R.id.image1)
        GlideApp.with(this)
            .load(R.mipmap.pic1)
            .transform(CenterCrop())
            .error(android.R.drawable.stat_notify_error)
            .override(SIZE)
            .into(iv1)

        val iv2 = findViewById<ShapeableImageView>(R.id.image2)
        iv2.rotation = DEGREE.toFloat()
        GlideApp.with(this)
            .load(R.mipmap.pic1)
            .transform(CenterCrop())
            .error(android.R.drawable.stat_notify_error)
            .override(SIZE)
            .into(iv2)
    }
}

Android Glide加载transform CenterCrop, CircleCrop ShapeableImageView圆形图并描边,Kotlin-CSDN博客文章浏览阅读446次。Android RoundedBitmapDrawable:Android官方的圆角图形图象实现方案RoundedBitmapDrawable是Android在support v4的扩展包中新增的实现圆角图形的关键类,借助RoundedBitmapDrawable的帮助,可以轻松的以Android标准方式实现圆角图形图象。现在结合他人的代码加以修改,给出一个以原始图形中心为原点,修剪图片为头像的工具类,此类可以直接在布局文件中加载使用,比。所实现的在Kotlin动态代码中绘制的描边效果。https://blog.csdn.net/zhangphil/article/details/134297059

相关推荐
千里马学框架1 天前
一起学 Android 14:ShellTransition 屏幕旋转过程深度剖析
android·智能手机·性能优化·framework·性能·屏幕旋转·rotation
美狐美颜SDK开放平台1 天前
开发直播APP时如何接入视频美颜SDK?开发流程与注意事项
android·人工智能·计算机视觉·音视频·直播美颜sdk
AFinalStone1 天前
Android7 SystemUI源码解析(七)Keyguard锁屏模块深度解析
android·systemui
致远ccc1 天前
Google Play 上架前如何测试 App?多国家 Android 环境测试
android·app测试·googleplay·多国家应用测试
ttyyttemo1 天前
Kotlin 协程中的 Job 结构化并发与取消
android
sun0077001 天前
tbox 4g/5g切换,导致wan ip 改变,导致车机旧网络不可用。需要重启车机才行
android
ai2work1 天前
ch23 综合复刻:从零做一个最小可用版本(capstone)
kotlin
其实防守也摸鱼1 天前
内网穿透与反向代理:原理、工具与实战指南
android·大数据·运维·安全·网络安全·自动化·渗透
ai2work1 天前
ch21 签名、校验与发版
kotlin
AFinalStone1 天前
Android7 SystemUI 源码解析(四)NavigationBar 导航栏与 SystemBars
android·systemui