Seekbar拇指,左右两侧的填充/边距透明
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Seekbar拇指,左右两侧的填充/边距透明相关的知识,希望对你有一定的参考价值。
总结问题:
您好,我想在设计中创建像这样的Seekbar:
因此,拇指在左右两侧都有填充/边距,两侧的圆角都是圆形的。
到目前为止我尝试过的:
我已经尝试过创建这样的缩略图:
不幸的是,我无法使用这张图片,因为我需要以编程方式在绿色点周围更改此黑色光晕。
这就是为什么我完全用XML构建了搜索栏(没有png图像的原因:
Seekbar:
<SeekBar
android:id="@+id/player_seekbar"
android:layout_width="0dp"
android:layout_height="wrap_content"
style="@style/SeekBarPlayer"
local:MvxBind="Max Duration; Progress SliderPosition, Mode=OneWay; SecondaryProgress Downloaded; Visibility(LivePlaybackToVisibility(CurrentTrack))"
android:layout_marginTop="16dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/cardView" />
SeekbarBackground:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape>
<corners android:radius="5dp" />
<solid android:color="#3d4b58" />
</shape>
</item>
</layer-list>
SeekbarSecondaryProgress:
<?xml version="1.0" encoding="utf-8"?>
<layer-list
xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:id="@+id/progressshapesecondary" >
<clip>
<shape
android:shape="rectangle" >
<size android:height="5dp"/>
<corners
android:radius="5dp" />
<solid android:color="#8883e76b"/>
</shape>
</clip>
</item>
</layer-list>
SeekbarProgress:
<?xml version="1.0" encoding="utf-8"?>
<layer-list
xmlns:android="http://schemas.android.com/apk/res/android" >
<item
android:id="@+id/progressshape" >
<clip>
<shape
android:shape="rectangle" >
<size android:height="5dp"/>
<corners
android:radius="5dp" />
<solid android:color="#83e76b"/>
</shape>
</clip>
</item>
</layer-list>
它为我提供了这样的搜索栏:
摘要
从现在开始如何实现以下搜索栏设计?
答案
使用以下代码绘制缩略图:seekbar_thumb.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="oval">
<solid android:color="#8883e76b"/>
<stroke android:color="@color/black" android:width="3dp"/>
<size android:height="30dp" android:width="30dp"/>
</shape>
</item>
</selector>
将下面的代码用于搜索栏,只需更改所需的颜色:
<item android:id="@android:id/background">
<shape android:shape="rectangle">
<corners android:radius="20dp" />
<solid android:color="@color/fofo_grey" />
</shape>
</item>
<item android:id="@android:id/progress">
<clip>
<shape android:shape="rectangle">
<corners android:radius="20dp" />
<solid android:color="@color/signup_green" />
<stroke
android:width="6dp"
android:color="@color/fofo_grey" />
</shape>
</clip>
</item>
以上是关于Seekbar拇指,左右两侧的填充/边距透明的主要内容,如果未能解决你的问题,请参考以下文章