我正在尝试在 Xamarin.Forms 中创建一个自定义滑块,为此我创建了一个自定义渲染器
protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.Slider> e)
{
base.OnElementChanged(e);
if (e.NewElement != null)
{
// Set custom drawable resource
Control.SplitTrack = false;
Control.SetProgressDrawableTiled(
Resources.GetDrawable(
Resource.Drawable.custom_progressbar_style,
(this.Context).Theme));
Control.SetThumb(Resources.GetDrawable(
Resource.Drawable.custom_thumb,
(this.Context).Theme));
// Control.Bottom = 30;
}
}
在这里,我加载了两个 xml 文件,一个progress bar
用于滑块,另一个用于滑块的拇指。Progress bar
从中加载custom_progressbar_style
和Thumb
正在从它们中加载custom_thumb
它们都放置在Resource/drawable
.
Progress bar xml content:
<?xml version="1.0" encoding="UTF-8" ?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:id="@android:id/background" android:height="10dp">
<shape>
<corners android:radius="3dp"/>
</shape>
</item>
<item android:id="@android:id/secondaryProgress" android:height="10dp">
<clip>
<shape>
<corners android:radius="3dp"/>
</shape>
</clip>
</item>
<item android:id="@android:id/progress" android:height="10dp">
<clip>
<shape>
<corners android:radius="3dp"/>
</shape>
</clip>
</item>
</layer-list>
Thumb xml:
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android" android:layout_gravity="center_vertical">
<!-- Larger white circle in back -->
<item >
<shape android:shape="oval">
<solid android:color="#f0f0f0"/>
<size
android:width="30dp"
android:height="30dp"/>
</shape>
</item>
<!-- Smaller blue circle in front -->
<item>
<shape android:shape="oval">
<!-- transparent stroke = larger_circle_size - smaller_circle_size -->
<stroke android:color="@android:color/transparent"
android:width="10dp"/>
<solid android:color="#6766f6"/>
<size
android:width="15dp"
android:height="15dp"/>
</shape>
</item>
</layer-list>