记录一下,万一以后用到了呢?
导包
implementation 'com.google.android.material:material:1.2.1'
Slider
1633769669145.gif代码
<com.google.android.material.slider.Slider
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:layout_marginTop="40dp"
android:layout_gravity="center"
android:valueTo="100f"
android:valueFrom="0f"
android:value="20f"
app:haloColor="@color/mainColor"
app:haloRadius="20dp"
app:labelBehavior="withinBounds"
app:thumbColor="@color/ff666666"
app:thumbRadius="10dp"
app:thumbElevation="10dp"
app:trackColorActive="@color/mainColor"
app:trackColorInactive="@color/ff666666"/>
<com.google.android.material.slider.RangeSlider
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
app:values="@array/initial_slider_values"
android:valueTo="100f"
android:valueFrom="0f"
app:labelBehavior="withinBounds"/>
<com.google.android.material.slider.Slider
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_marginLeft="20dp"
android:layout_marginRight="20dp"
android:valueTo="100f"
android:valueFrom="0f"
android:stepSize="10"
app:labelBehavior="withinBounds"/>
总长度和当前长度代码
android:valueTo="100f"
android:valueFrom="0f"
android:value="20f"
拖动时出现的大圆提示
app:haloColor="@color/mainColor"
app:haloRadius="20dp"//如果不想要,就设置为0dp
圆圈上面的数字提示框设置
app:labelBehavior="withinBounds"
他有floating、withinBounds、gone三种,gone肯定是不展示,经过我的测试设置floating在个别手机上面会有显示bug,看下图:
1633770131231.gif
lable没有消失,出现问题的手机是华为p10,小米10是好的。所以这里都用withinBounds模式。
滑块的设置
app:thumbColor="@color/ff666666"
app:thumbRadius="10dp"//圆的半径
app:thumbElevation="10dp"//悬浮阴影
进度条背景颜色设置
app:trackColorActive="@color/mainColor"//以拖动的区域
app:trackColorInactive="@color/ff666666"//未覆盖的区域
RangeSlider的话注意app:values="@array/initial_slider_values"
<string-array name="initial_slider_values">
<item>0</item>
<item>100</item>
</string-array>
这样设置,默认从两端开始拖动
步长设置
android:stepSize="10"
每10的数字打个点。
ShapeableImageView
Screenshot_20211009_171046_com.example.demo.jpg代码
<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"
tools:context=".materialViews.image.ShapeableImageViewActivity">
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical"
android:gravity="center_horizontal">
<com.google.android.material.imageview.ShapeableImageView
android:layout_width="150dp"
android:layout_height="150dp"
android:src="@mipmap/test"
android:layout_marginTop="10dp"/>
<com.google.android.material.imageview.ShapeableImageView
android:layout_width="150dp"
android:layout_height="150dp"
android:src="@mipmap/test"
android:layout_marginTop="10dp"
app:shapeAppearance="@style/CircleStyle"/>
<com.google.android.material.imageview.ShapeableImageView
android:layout_width="150dp"
android:layout_height="150dp"
android:src="@mipmap/test"
android:layout_marginTop="10dp"
app:shapeAppearance="@style/CutStyle"/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical"
android:gravity="center_horizontal">
<com.google.android.material.imageview.ShapeableImageView
android:layout_width="150dp"
android:layout_height="150dp"
android:src="@mipmap/test"
android:layout_marginTop="10dp"
app:shapeAppearance="@style/RoundedStyle"/>
<com.google.android.material.imageview.ShapeableImageView
android:layout_width="150dp"
android:layout_height="150dp"
android:src="@mipmap/test"
android:layout_marginTop="10dp"
app:shapeAppearance="@style/CircleStyle"
app:strokeColor="@android:color/holo_orange_light"
app:strokeWidth="2dp"
android:padding="1dp"/>
<com.google.android.material.imageview.ShapeableImageView
android:layout_width="150dp"
android:layout_height="150dp"
android:src="@mipmap/test"
android:layout_marginTop="10dp"
app:shapeAppearance="@style/RhombusStyle"/>
</LinearLayout>
</LinearLayout>
<style name="RoundedStyle">
<item name="cornerFamily">rounded</item>
<item name="cornerSize">10dp</item>
</style>
<style name="CircleStyle">
<item name="cornerFamily">rounded</item>
<item name="cornerSize">50%</item>
</style>
<style name="CutStyle">
<item name="cornerFamily">cut</item>
<item name="cornerSize">10dp</item>
</style>
<!--ShapeableImageView 菱形 -->
<style name="RhombusStyle">
<item name="cornerFamily">cut</item>
<item name="cornerSize">50%</item>
</style>
当然这是简单的使用
主要注意cornerFamily,他有rounded和cut两种,如果需要圆角那就是rounded,如果需要多边形,那么需要cut。你可以把cornerFamily理解成设置这个属性控制图片的4个角,那么他肯定有单独设置某个角的功能
<item name="cornerFamilyBottomRight"/>
<item name="cornerFamilyBottomLeft"/>
<item name="cornerFamilyTopLeft"/>
<item name="cornerFamilyTopRight"/>
然后cornerSize可以设置具体数字,也能百分比。当然我们可以单独设置摸一个角。
<item name="cornerSizeBottomLeft"></item>
<item name="cornerSizeBottomRight"></item>
<item name="cornerSizeTopLeft"></item>
<item name="cornerSizeTopRight"></item>
网友评论