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

相关推荐
Libraeking1 小时前
破壁行动:在旧项目中丝滑嵌入 Compose(混合开发实战)
android·经验分享·android jetpack
市场部需要一个软件开发岗位1 小时前
JAVA开发常见安全问题:Cookie 中明文存储用户名、密码
android·java·安全
JMchen1233 小时前
Android后台服务与网络保活:WorkManager的实战应用
android·java·网络·kotlin·php·android-studio
crmscs4 小时前
剪映永久解锁版/电脑版永久会员VIP/安卓SVIP手机永久版下载
android·智能手机·电脑
localbob4 小时前
杀戮尖塔 v6 MOD整合版(Slay the Spire)安卓+PC端免安装中文版分享 卡牌肉鸽神作!杀戮尖塔中文版,电脑和手机都能玩!杀戮尖塔.exe 杀戮尖塔.apk
android·杀戮尖塔apk·杀戮尖塔exe·游戏分享
机建狂魔4 小时前
手机秒变电影机:Blackmagic Camera + LUT滤镜包的专业级视频解决方案
android·拍照·摄影·lut滤镜·拍摄·摄像·录像
hudawei9964 小时前
flutter和Android动画的对比
android·flutter·动画
lxysbly6 小时前
md模拟器安卓版带金手指2026
android
儿歌八万首6 小时前
硬核春节:用 Compose 打造“赛博鞭炮”
android·kotlin·compose·春节
消失的旧时光-19439 小时前
从 Kotlin 到 Dart:为什么 sealed 是处理「多种返回结果」的最佳方式?
android·开发语言·flutter·架构·kotlin·sealed