web-dev-qa-db-ja.com

UIScrollViewでズームを有効にする方法

UIScrollViewでズーム効果を有効にするにはどうすればよいですか?

56
Ideveloper

答えは ここ

スクロールビューは、コンテンツのズームとパンも処理します。ユーザーがピンチインまたはピンチアウトジェスチャを行うと、スクロールビューがコンテンツのオフセットとスケールを調整します。ジェスチャが終了すると、コンテンツビューを管理するオブジェクトは、必要に応じてコンテンツのサブビューを更新する必要があります。 (ジェスチャが終了し、指がまだ下がっている可能性があることに注意してください。)ジェスチャの進行中、スクロールビューはサブビューに追跡呼び出しを送信しません。

UIScrollViewクラスには、UIScrollViewDelegateプロトコルを採用する必要があるデリゲートを含めることができます。ズームとパンを機能させるには、デリゲートはviewForZoomingInScrollView:とscrollViewDidEndZooming:withView:atScale :;の両方を実装する必要があります。さらに、最大(maximumZoomScale)と最小(minimumZoomScale)のズームスケールは異なる必要があります。

そう:

  1. UIScrollViewDelegateを実装し、delegateインスタンスでUIScrollViewに設定されているデリゲートが必要です。
  2. デリゲートでは、1つのメソッドviewForZoomingInScrollView:を実装する必要があります。これは、ズームに関心のあるコンテンツビューを返す必要があります)。オプションでscrollViewDidEndZooming:withView:atScale:を実装することもできます。
  3. UIScrollViewインスタンスで、minimumZoomScalemaximumZoomScaleを異なる値に設定する必要があります(デフォルトでは1.0です)。

注:これに関する興味深いことは、breakしたい場合ですズーミング。 viewForZooming...メソッドでnilを返すだけで十分ですか?ズームは解除されますが、ジェスチャの一部が乱れます(2本の指の場合)。したがって、ズームを解除するには、最小および最大ズームスケールを1.0に設定する必要があります。

195
Dan Rosenstark

this videoをご覧ください

ビデオからの説明:

  • UIScrollViewDelegateデリゲートを追加
  • UIScrollViewを取る
  • Scrollviewに追加されるUIImageViewを取得します
  • メインウィンドウにスクロールビューを配置する
  • デリゲートを接続する
  • セットアップimageView
  • 最大/最小ズームスケールの設定[ここで重要なこと]
  • ビューを返すデリゲートメソッドを実装する
9
Jigar Joshi

このRay Wenderlichチュートリアルを読んでください:

http://www.raywenderlich.com/76436/use-uiscrollview-scroll-zoom-content-Swift

「大きな画像のスクロールとズーム」セクションを実行すると、画像が表示され、ピンチとズームが可能になります。

リンクが変更された場合の主な情報は次のとおりです。ViewControllerにこのコードを配置します(これにより主な機能が設定されます)。

override func viewDidLoad() {
  super.viewDidLoad()

  // 1
  let image = UIImage(named: "photo1.png")!
  imageView = UIImageView(image: image)
  imageView.frame = CGRect(Origin: CGPoint(x: 0, y: 0), size:image.size)
  scrollView.addSubview(imageView)

  // 2
  scrollView.contentSize = image.size

  // 3
  var doubleTapRecognizer = UITapGestureRecognizer(target: self, action: "scrollViewDoubleTapped:")
  doubleTapRecognizer.numberOfTapsRequired = 2
  doubleTapRecognizer.numberOfTouchesRequired = 1
  scrollView.addGestureRecognizer(doubleTapRecognizer)

  // 4
  let scrollViewFrame = scrollView.frame
  let scaleWidth = scrollViewFrame.size.width / scrollView.contentSize.width
  let scaleHeight = scrollViewFrame.size.height / scrollView.contentSize.height
  let minScale = min(scaleWidth, scaleHeight);
  scrollView.minimumZoomScale = minScale;

  // 5
  scrollView.maximumZoomScale = 1.0
  scrollView.zoomScale = minScale;

  // 6
  centerScrollViewContents()
}

これをクラスに追加します。

func centerScrollViewContents() {
  let boundsSize = scrollView.bounds.size
  var contentsFrame = imageView.frame

  if contentsFrame.size.width < boundsSize.width {
    contentsFrame.Origin.x = (boundsSize.width - contentsFrame.size.width) / 2.0
  } else {
    contentsFrame.Origin.x = 0.0
  }

  if contentsFrame.size.height < boundsSize.height {
    contentsFrame.Origin.y = (boundsSize.height - contentsFrame.size.height) / 2.0
  } else {
    contentsFrame.Origin.y = 0.0
  }

  imageView.frame = contentsFrame
}

そして、ダブルタップジェスチャを認識したい場合はこれ:

func scrollViewDoubleTapped(recognizer: UITapGestureRecognizer) {
  // 1        
  let pointInView = recognizer.locationInView(imageView)

  // 2
  var newZoomScale = scrollView.zoomScale * 1.5
  newZoomScale = min(newZoomScale, scrollView.maximumZoomScale)

  // 3
  let scrollViewSize = scrollView.bounds.size
  let w = scrollViewSize.width / newZoomScale
  let h = scrollViewSize.height / newZoomScale
  let x = pointInView.x - (w / 2.0)
  let y = pointInView.y - (h / 2.0)

  let rectToZoomTo = CGRectMake(x, y, w, h);

  // 4
  scrollView.zoomToRect(rectToZoomTo, animated: true)
}

さらに詳細が必要な場合は、チュートリアルを読んでください。

9
lg365

ViewControllerをscrollViewsデリゲートとして設定し、実装してください:

func viewForZooming(in scrollView: UIScrollView) -> UIView? {
    return imageView
}
0
Menno

チェック tucan9389/ZoomableScrollView huynguyencong/ImageScrollViewから分岐。
ZoomableScrollViewを作成し、display(view:)を呼び出すだけです。

デモ

[〜#〜] demo [〜#〜]

使用法

import ZoomableScrollView

class ViewController: UIViewController

    @IBOutlet weak var zoomableScrollView: ZoomableScrollView!

    override func viewDidLoad() {
        super.viewDidLoad()

        let myView = MyCustomView()
        zoomableScrollView.display(view: myView)
    }
}
0
tucan9389