Blog

2つのTableViewのサイズを動的に変更する

やりたいこと。

上下に並んだTableViewサイズを動的に変更する。

https://gyazo.com/61d3c6ed2c5bacef6345d76bcd969fc5

まずStackViewにそれぞれの要素を入れる。横向きの制約はつける。一番上は高さの制約をつける。
ここがポイント。要素の一つのサイズが変わったときに、StackViewが自動で再計算してくれる。

1-2

Pan Gestureは、viewにしか設定できないので、間にviewを配置する。

これでイベントをgetする

2-1

一番上の高さの制約を紐付ける。StoryBoardのconstraintsもひも付け可能。

   
       //真ん中に挟んでいるView だよ。
    @IBOutlet weak var uiView: UIView!
        //そこにはpangesutreを配置しようね
    @IBOutlet var pan: UIPanGestureRecognizer!
    //上のテーブルです
    @IBOutlet weak var upTable: UITableView!
    //上のテーブルの高さの制約を引っ張ってきてます。storyboardでグクっっと引っ張ってくるあれね,,,
    @IBOutlet weak var upTable_height: NSLayoutConstraint!
    

    override func viewDidLoad() {
        super.viewDidLoad()
        //はじめにpangestureを設定しよう!
        pan.addTarget(self, action: #selector(panGesture(sender:)))
    }   

//ここでpangestureの動きをlogにてチェック!
 @objc func panGesture(sender:UIPanGestureRecognizer) {
        switch (sender.state) {
        //PanGestureは beganとendの要素を持っている
*******ここからアップルの説明
public enum UIGestureRecognizerState : Int {
    case possible // the recognizer has not yet recognized its gesture, but may be evaluating touch events. this is the default stat    
    case began // the recognizer has received touches recognized as the gesture. the action method will be called at the next turn of the run loop
  case ended // the recognizer has received touches recognized as the end of the gesture. the action method will be called at the next turn of the run loop and the recognizer will be reset to UIGestureRecognizerStatePossible
*********ここまで
    case ended //

        case .began:
            print("pan start")
            break
        case .ended:
            print("pan end")
            
            let translation = sender.translation(in: sender.view)
            //ここに配置を変更する関数を書く
            move_split(translation)
            print(translation)
            break
        default:
            break
        }
    }
    //高さを変更する関数
    func move_split(_ translation: CGPoint){
           //上のテーブルの高さの制約                移動量を足してあげてね。画面のframeはCGFloat型なのでキャストします。
              //ほしいのは高さだけなのでyだけがいいです。xもとるとエラーになります。CGPoint型なので
        upTable_height.constant = upTable_height.constant + CGFloat(translation.y)
        //レイアウトの更新が保留中の場合は、すぐにサブビューをレイアウトしてくれる便利なメッソッド
        self.view.layoutIfNeeded()
    }

一つ前の記事 営業くん2リリースです
次の記事 サワディー辞書 タイ語