javaSEがiOSアプリデザイン、開発に挑む日記

本業java SEがswift、デザインの勉強したことを残しておくブログ

タップした時、枠が波紋のように広がるアニメーション

色々作ってるうちに、こういう細かいとこがUXというのかなと。

func anyTapGesture(sender: UITapGestureRecognizer){
    let tmpX:CGFloat = sender.view!.frame.origin.x
    let tmpY:CGFloat = sender.view!.frame.origin.y
    let tmpH:CGFloat = sender.view!.frame.height
    let tmpW:CGFloat = sender.view!.frame.width
        
    var clickActionV:UIView = UIView()
    clickActionV.frame = CGRectMake(tmpX, tmpY, tmpW, tmpH)
    clickActionV.layer.borderColor = UIColor(red: 0.7, green: 0.7, blue: 0.7, alpha: 0.5).CGColor
    clickActionV.layer.borderWidth = 2.0
    self.view.addSubview(clickActionV)
            
    UIView.animateWithDuration(0.2,
        delay: 0.1,
        options: UIViewAnimationOptions.CurveEaseOut,
        animations: { () in
            clickActionV.transform = CGAffineTransformMakeScale(1.6, 1.1)
            clickActionV.alpha = 0
        }, completion: { (Bool) in
            clickActionV.removeFromSuperview()
    })
}

 タップされたviewと同じサイズのviewを作って、枠線をつけて、アニメーションで拡大しながら透過させる。

 

 細かい広がり、遅延具合はお好みでどうぞ。

 

 丸く波紋が広がるようにしたいなぁ...

 難しそうだけど。