Xcode의 기본 위젯에는 SliderBar가 있습니다.
이 세워진 녀석의 설치가 필요하기 때문에 그 설치 방법을 남겨 두세요.

완료 이미지

개발 환경

Xcode: 10.2.1
iOS: 12.2
Swift: Swift5

실시

나는 실제로 실시하고 싶다

Storyboard

이번에는 다음과 같이 View를 구성합니다.

- baseView
- 슬라이더의 다이얼 버튼의 움직이는 영역 부분
- sliderView
- 슬라이더의 스위치 부분
베이스뷰에 슬라이더뷰가 없다는 게 포인트예요.
sliderView가 baseView에 들어가면 다음 드래그 처리가 실행될 때
좌표의 계산이 이상해질 수 있으니 주의하세요

ViewController

import UIKit

class ViewController: UIViewController {
    /// スライダーの可動域
    @IBOutlet weak var baseView: UIView!
    /// スライダーのつまみ部分
    @IBOutlet weak var sliderView: UIView!

    override func viewDidLoad() {
        super.viewDidLoad()
        setupSlider()
    }

    /// スライダーのつまみをドラッグしたのを検知
    override func touchesMoved(_ touches: Set<UITouch>, with event: UIEvent?) {
        guard let touch = touches.first,
            let movedView = touch.view else {
                return
        }
        // ドラッグした view がつまみ（sliderView）ではなければ何もしない
        guard movedView == sliderView else {
            return
        }
        moveSliderView(to: touch.location(in: view))
    }

    /// スライダーの描画設定
    private func setupSlider() {
        let baseViewHalfWidth = baseView.frame.width / 2.0
        let sliderViewHalfWidth = sliderView.frame.width / 2.0
        // baseView の角を丸めたり、つまみを円形にするための処理
        baseView.layer.cornerRadius = baseViewHalfWidth
        sliderView.layer.cornerRadius = sliderViewHalfWidth
    }

    /// つまみを移動させる処理
    private func moveSliderView(to point: CGPoint) {
        // 今回は縦方向のみに動かしたいため、x 座標は sliderView.center.x に固定する
        var movePoint = CGPoint(x: sliderView.center.x,
                                y: point.y)
        // sliderView の center の位置を変更することでドラッグの動きに合わせて移動させる
        sliderView.center = movePoint

    }
}

이렇게 하려면 위아래 운동을 설치할 수 있을까!
하지만 현재 상태라면 가동 구역을 초과해도 드래그할 수 있기 때문에 이 부분을 수정해야 한다

활성 영역 수정

class ViewController: UIViewController {

    ...

    /// スライダー可動域の Y 座標の上限値
    private var baseViewMaxY: CGFloat! //  <--- 追加
    /// スライダー可動域の Y 座標の下限値
    private var baseViewMinY: CGFloat! //  <--- 追加

    ...

    /// スライダーの描画設定
    private func setupSlider() {
        let baseViewHalfWidth = baseView.frame.width / 2.0
        let sliderViewHalfWidth = sliderView.frame.width / 2.0
        /* 
         上限値を baseView.frame.maxY or minY で取得しており、
         sliderView を動かす際は sliderView.center の値を変更して動かしているため、
         可動域ぴったりに収まるよう調節
         */
        baseViewMaxY = baseView.frame.maxY - baseViewHalfWidth //  <--- 追加
        baseViewMinY = baseView.frame.minY + sliderViewHalfWidth //  <--- 追加
        baseView.layer.cornerRadius = baseViewHalfWidth
        sliderView.layer.cornerRadius = sliderViewHalfWidth
    }

    /// つまみを移動させる処理
    private func moveSliderView(to point: CGPoint) {
        var movePoint = CGPoint(x: sliderView.center.x,
                                y: point.y)
        //  <--- ここから追加 --->
        if movePoint.y > baseViewMaxY {
            // 上限値を超えた場合は上限値以上にならないようにする
            movePoint.y = baseViewMaxY
        }

        if movePoint.y < baseViewMinY {
            // 加減値より小さくなった場合は下限値以下にならないようにする
            movePoint.y = baseViewMinY
        }
        //  <--- ここまで追加 --->
        sliderView.center = movePoint
    }
}

위에서 말한 수정을 통해 가동 구역을 초과하지 않도록 제어할 수 있습니다!

견본

다음은 이번에 설치된 코드입니다. 가능하다면 참고하십시오.
https://github.com/nwatabou/VerticalSlider