試行錯誤 ７ （ボタンを光らせる）

「春の縁側」のアプリではボタンの位置を知らせるために光の点滅を用いましたが、その際ボタンの大きさや用途によって方法を使い分けました。
以前の記事と重複する部分もありますが、もう一度まとめてみます。

１　大きなボタン全体を光らせたり、特定の形のボタンを光らせたい場合
ボタンそのものは光らせず、imageViewを使います。
下記では、青いボタンの上に白いimageViewを置き、アニメーションで透明にしたり半透明にしたりを繰り返しています。
ボタン全体が点滅しているように見せることができます。

２　ボタンの中心だけを光らせたい場合
青いimageViewの上に透明なボタンを置き、ボタンそのものを点滅させています。
ボタンの中心が、丸くスポットライト風に光ります。
ボタンそのものに青く色をつけて光らせても同様の効果は得られますが、ボタンに画像をセットしてしまうと光らなくなるようです。
今回のアプリのように、タッチしてほしい画像を光らせる場合はどうしたら良いか考えて、この方法を使うことにしました。

実際のアプリに使用した場面です。
光っているところ各々に、画像の大きさに合わせたボタンが貼ってあります。

前回・前々回は１について触れましたので、今回は２についてコードを書いてみたいと思います。
今回もSwiftで書いています。
あ、シンタックスハイライトの使い方を教えていただいたので、使ってみました。
ちょっと見やすくなって、ホッとしています(^^)

import UIKit

class SecondViewController: UIViewController {
    
    var imageView:UIImageView!
    var flickeringButton:UIButton!

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
        
        //サイズ変換のメソッドを使って、サイズと位置を設定
        let rect:CGRect = CGRectMake2(60, y: 100, width: 200, height: 100)
        
        //imageViewを作成
        self.imageView = UIImageView(frame: rect)
        self.imageView.backgroundColor = UIColor.blueColor()
        self.view.addSubview(imageView)
        
        //flickeringButtonを作成
        self.flickeringButton = UIButton(frame: rect)
        self.flickeringButton.showsTouchWhenHighlighted = true
        self.view.addSubview(flickeringButton)
        
        //ボタンを点滅させるメソッドを呼ぶ
        light(self.flickeringButton)
    }
    
    /**
     ボタンの点滅
     - parameter button: 光らせるボタン
     */
    func light(button:UIButton){
        
        UIView.animateWithDuration(1.8, delay: 0, options: [UIViewAnimationOptions.Autoreverse, UIViewAnimationOptions.Repeat], animations: { () -> Void in
            
            button.highlighted = true
            
            }) { (finished:Bool) -> Void in
        }
    }
    
    /**
     サイズ変換を行うメソッド
     - parameter x: x座標
     - parameter y: y座標
     - parameter width: 幅
     - parameter height: 高さ
     - returns: 上記で規定された位置とサイズを返す
     */
    func CGRectMake2(x: CGFloat, y: CGFloat, width: CGFloat, height: CGFloat) ->CGRect{
        
        let r:CGRect = UIScreen.mainScreen().bounds
        var returnRect:CGRect!
        
        if(r.size.height == 480 && r.size.width == 320){//4
            returnRect = CGRectMake(x, y*480/568, width, height)
        }else if(r.size.height == 667 && r.size.width == 375){//6
            returnRect = CGRectMake(x*375/320, y*667/568, width*375/320, height*667/568);
        }else if(r.size.height == 736 && r.size.width == 414){//6+
            returnRect = CGRectMake(x*414/320, y*736/568, width*414/320, height*736/568);
        }else{
            returnRect = CGRectMake(x, y, width, height);//5
        }
        return returnRect
    }
 
    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
}

色々な形に対応できる１の方法を使ったり、点滅の間隔を調節したりすると応用が利きそうです。
ボタンはイベントの始まりなので、思わず押したくなるような楽しいボタンを作りたいなと思います(^^)