ios - ビューのドラッグ/パンを 2 つの CGPoints 間で制限する方法 (スライダーのように)

Question

私は2つの独立したデータセットを持っています。1つは線を描くために使用され、もう1つは線Pathのどこかに小さなビューを配置するために使用されます(Circle)。

スライダーのように想像できます（実際、UXはそのようなものでなければなりません）

赤い円のビューにドラッグ ジェスチャを追加して、ユーザーが線の端点の間の任意の場所にスライドできるようにしたいと考えました。しかし、私が実装または考えた方法は、まったく機能していないか、かなり悪いです。

既知のデータセットは次のとおりです。

• StartのLine- CGPoint

• EndのLine- CGPoint

• PositionのCircle View- CGPoint

例を簡単にするために、Top&といういくつかの単純なポイントを追加しましBottomたが、実際に達成しようとしているのは、緯度/経度座標を取得してスクリーン座標に変換することにより、マップレイヤーに境界を確立することですスペースとPathこれらの 2 点の (線) をプロットし、その後、ユーザーが周囲にラベルを付ける機能を提供し、ユーザーの必要に応じて周囲の線に沿って自由にドラッグできるようにします。(1 行に 1 つのラベル、複雑なことはありません)。

そうは言っても、スライダーはオプションではありませんでした。

次のようになります。

サンプルコード:

struct TestView: View {
    @State var position = CGPoint(x: 60, y: 60)

    let top = CGPoint(x: 50, y: 50)
    let bottom = CGPoint(x: 300, y: 300)

    var body: some View {
        ZStack {
            Path { path in
                path.move(to: self.top)
                path.addLine(to: self.bottom)
            }
            .stroke(Color.red, lineWidth: 5)

            Circle()
                .foregroundColor(.red)
                .frame(width: 20)
                .position(self.position)
                .gesture(
                    DragGesture(minimumDistance: 0, coordinateSpace: .global)
                        .onChanged { drag in
                            print(drag.location)
                            if
                                self.top.x <= drag.location.x,
                                self.bottom.x >= drag.location.x,
                                self.top.y <= drag.location.y,
                                self.bottom.y >= drag.location.y,
                                self.pointOnLine(point: drag.location)
                            {                               
                                self.position = drag.location
                            }
                        }
                )
        }
    }   
}

ポイントがオンラインかどうかを確認するヘルパー メソッド:

func pointOnLine(point: CGPoint) -> Bool {
        let dxc = point.x - top.x
        let dyc = point.y - top.y

        let dxl = bottom.x - top.x
        let dyl = bottom.y - top.y

        let cross = dxc * dyl - dyc * dxl
        return cross == 0
    }

どんな助けでも感謝します。前もって感謝します。