UISlider with increased slider size but no thumb d

2019-06-14 11:08发布

I need to increase size of slider in the iOS app created using Xamarin Forms. I tried with following custom renderer that overrides LayoutSubviews. It increases the size but there is an unacceptable size increase for the thumb. How to reduce the size of the thumb keeping the increased height of the slider?

It is possible in Android as shown here: Increase height of slider without affecting thumb in Android App

iOS References:

  1. Custom UISlider - Increase "hot spot" size

  2. Increasing a thumbs "click area" in UISlider

C# Custom Renderer

[assembly: ExportRenderer(typeof(MySlider), typeof(MySliderRenderer))]
namespace CustomRenderer.iOS
{
    class MySliderRenderer : Xamarin.Forms.Platform.iOS.SliderRenderer
    {
        protected override void OnElementChanged(ElementChangedEventArgs<Slider> e)
        {
            base.OnElementChanged(e);   
            Control.MinimumTrackTintColor = UIColor.FromRGB(0xE6, 0x00, 0x06);
            Control.ThumbTintColor = UIColor.Red;
            Control.MinimumTrackTintColor = UIColor.Orange;
            Control.MaximumTrackTintColor = UIColor.Yellow;
            //Control.SetThumbImage(UIImage.FromFile("myicon.png"), UIControlState.Normal);
        }

        public override void LayoutSubviews()
        {
            base.LayoutSubviews();
            CGAffineTransform transform = CGAffineTransform.MakeScale(1f, 12.0f);
            transform.TransformSize(this.Frame.Size);
            this.Control.Transform = transform;            
        }
    }
}

enter image description here

UPDATE - REFERENCES - Renderer

  1. Customizing Control Rendering in Xamarin.Forms

  2. Implementing a View - Rendering a platform-specific view

  3. iOS range slider for Xamarin and Xamarin.Forms

  4. Fullscreen Video Background Control for Xamarin.Forms

1条回答
Deceive 欺骗
2楼-- · 2019-06-14 11:36

Override TrackRectForBounds to change its height instead of changing transform .

In MySliderRenderer

class MySliderRenderer : SliderRenderer
{
    protected override void OnElementChanged(ElementChangedEventArgs<Slider> e)
    {
        SetNativeControl(new MySlideriOS());
        base.OnElementChanged(e);
    }
}

Create a subclass of UISlider

public class MySlideriOS : UISlider
{
    public MySlideriOS() {
        this.MinimumTrackTintColor = UIColor.FromRGB(0xE6, 0x00, 0x06);
        this.ThumbTintColor = UIColor.Red;
        this.MinimumTrackTintColor = UIColor.Orange;
        this.MaximumTrackTintColor = UIColor.Yellow;
    }

    public override CGRect TrackRectForBounds(CGRect forBounds)
    {
        CGRect rect =  base.TrackRectForBounds(forBounds);
        return new CGRect(rect.X, rect.Y, rect.Width, 20);
    }
}

My test

enter image description here

Here is Sample

查看更多
登录 后发表回答