技術メモ

技術的なメモを載せていきます。

swift3 storyboard で UIScrollviewを実装

swift3 storyboard で UIScrollviewを実装

Objective-Cのころからも使っているUISCrollviewですが、swift3になってどうにも うまくいかなくなったので、うまくいった方法を載せておきます。 (AutoLayoutでクチャクチャにならないようにmix Layoutにします)

具体的な流れとしては、ググるとたくさん出てくる例よりも可能な限り省略します(^^; 特にAutoLayoutはハマるので基本使いません。 AutoresizingMaskだけで頑張ります。 f:id:unkillonline:20170626183507p:plain

■ 手順

下準備: もとのviewcontroller のサイズを広げる

1. Storyboard のスクロールさせたいview controllerにUISrollviewを貼る
2. UIScrollviewの下にScrollviewと同じサイズで、viewを貼りその中に必要な部品を配置。
3. UIScrollviewのAutoresizingMaskを全部チェックして自動伸長にする
4. 該当のviewcontroller.swiftに IBOutlet を設定
5. scrollview の contentOffsetとcontentSizeを設定
6. IBoutlet を Storyboard とつなぐ

■ 詳細

下準備: もとのviewcontroller のサイズを広げる

f:id:unkillonline:20170626190640p:plain

ここでは縦900に。

2. UIScrollviewの下にScrollviewと同じサイズで、viewを貼りその中に必要な部品を配置。

f:id:unkillonline:20170626192152p:plain f:id:unkillonline:20170626191323p:plain

3. UIScrollviewのAutoresizingMaskを全部チェックして自動伸長にする

f:id:unkillonline:20170626191443p:plain

4. 該当のviewcontroller.swiftに IBOutlet を設定
class ViewController: UIViewController,UIScrollViewDelegate {

    @IBOutlet weak var myScrollView: UIScrollView!
    
    override func viewDidLoad() {
5. scrollview の contentOffsetとcontentSizeを設定
        myScrollView.contentOffset = CGPoint.zero
        myScrollView.contentSize = CGSize(width: self.view.frame.size.width, height: 900)

ここでは、横幅はviewサイズで縦900とした。

6. IBoutlet を Storyboard とつなぐ

f:id:unkillonline:20170626191853p:plain

※ contentSizeだけ定義すると、ズレちゃうので、contentOffsetで初期化しておくこと。 てかいつになったら storyboardだけで完結できるんだろうか・・・・・・。

サンプル github.com