UISlide实例学习

UISlider的使用之前还真的很少见，要是真使用也是最简单的使用系统的即可。

这里也就不具体说UISlider的一些使用方法，就记录下自己项目中遇到的一些问题吧。

项目中的实现效果如下：

image.png

先说看到这效果你是用什么方法实现？
自定义View？还是UISlider？

我们都知道UISlider的滑块什么的都是可以设置图片的哈，所以这里直接让UI给切图就好了，是不是觉得其实挺简单的，我也觉得，但是我设置之后出现以下这种情况，甚至我还以为和我项目有关系，最后自己还写了一个Demo。

image.png

看到没？拖动滑块居然分节了。。。。。。

一直以为这种效果不能这么切图，甚至觉得是图片的问题，最后发现还真是图片问题。只是这种问题是我没想到的~~

看UI小哥哥给我切的图片：

image.png

image.png

看出问题没，两个一样876*79的图片，红色的要短？原因就是人家直接给我把后面的加了透明像素，也原谅我有点菜，看了两天才发现问题。

最后重新切图实现了。

重点代码如下所示：

private func setupSlider(maxWidth: Float, tasteId: String) {
        let slideImageName = tasteIdDic[tasteId] ?? "button_sliding"
        slider.setThumbImage(UIImage(named: slideImageName), for: .normal)
        slider.setMinimumTrackImage(UIImage(named: "personal_btn_selected")?.resizableImage(withCapInsets: UIEdgeInsets(top: 10, left: 10, bottom: 10, right: 10)), for: .normal)
        slider.setMaximumTrackImage(UIImage(named: "personal_btn_normal")?.resizableImage(withCapInsets: UIEdgeInsets(top: 10, left: 10, bottom: 10, right: 10)), for: .normal)
        slider.isContinuous = false
        slider.maximumValue = maxWidth
        slider.minimumValue = 0
        slider.addTarget(self, action: #selector(trackSlider(_:)), for: .valueChanged)
    }

这里可以拉伸一下哈，防止图片变形。

class CustomSlider: UISlider {
    // 控制slider的宽和高，这个方法才是真正的改变slider滑道的高的
    override func trackRect(forBounds bounds: CGRect) -> CGRect {
        let rect = super.trackRect(forBounds: bounds)
        return CGRect.init(x: rect.origin.x, y: (bounds.size.height-15)/2, width: bounds.size.width, height: 15)
    }
//    // 改变滑块的触摸范围
//    override func thumbRect(forBounds bounds: CGRect, trackRect rect: CGRect, value: Float) -> CGRect {
//        let rect = super.thumbRect(forBounds: bounds, trackRect: rect, value: value)
//        return CGRect(x: rect.origin.x, y: rect.origin.y, width: rect.size.width + 5, height: rect.size.height + 5)
//    }
}

还有一个切片小知识点哈，也是我今天才学会的，话说之前还真是没用过呢，如下图所示：

image.png

我所知道就是可以设置拉伸之类的，反正我试了用那个错误的切图，设置拉伸也是可以使用的，不过代码里使用图片就不能设置拉伸了，效果也是可以实现的，本来就想将就下的，最后发现在iOS13的系统上还是不行，没办法，最后还是让UI帮忙切图了哈~~

反正最后效果是实现了咯。

不过，我有一个疑问：UI给的一张图片怎么知道这是@2x图还是@3x图呢？

知道的告诉我哈，听说是没法知道的

因为这个切图真的是耽误我很长时间呀，突然发现有个专业的UI真的是一件很幸福的事情哈~~

好了，吐槽到此为止~~