- 效果图
- 资源引入
implementation 'com.google.android.material:material:1.4.0'
- 属性
属性 | 描述 |
---|---|
android:id | 控件id |
android:layout_width | 控件长度 |
android:layout_height | 控件高度 |
app:shapeAppearance | 控件外观样式 |
app:strokeWidth | 画笔粗度 |
app:strokeColor | 画笔颜色 |
android:src | 图像资源 |
- 源代码
xml布局代码:
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout 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">
<com.google.android.material.imageview.ShapeableImageView
android:id="@+id/shapeableImageView"
android:layout_width="300dp"
android:layout_height="300dp"
android:layout_gravity="center"
android:padding="2.5dp"
android:src="@mipmap/ic_upic"
app:shapeAppearance="@style/roundImg"
app:strokeColor="@color/black"
app:strokeWidth="5dp" />
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="@+id/bottomNavMenu"
android:layout_width="match_parent"
android:layout_height="56dp"
android:layout_gravity="bottom"
app:itemIconSize="25dp"
app:itemIconTint="@color/icon_color"
app:itemTextColor="@color/text_color"
app:labelVisibilityMode="labeled"
app:menu="@menu/bottom_menu" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
style: roundImg.xml
<style name="roundImg">
<item name="cornerFamily">rounded</item>
<item name="cornerSize">150dp</item>
</style>
- 使用注意
如果圆角图片需要加入边框线则需要设置android:padding 且padding的大小等于app:strokeWidth的一半,否则你将会看到上下左右 四个方向各有一段遮挡