walkingmask’s development log

IT系の情報などを適当に書いていきます

MENU

Swift2で簡単な目覚まし時計(Alarm Clock)?を作る!

開発環境

Mac OS X El Capitan(10.11.1)
Xcode 7.1.1
Swift 2.1

Xcode projectの作成

まずはプロジェクトを作成!とりあえず起動!
f:id:walkingmask:20151120153830p:plain
今回はiOS ApplicationのSingle View Applicationを作る!楽だから!Next!
f:id:walkingmask:20151120153835p:plain
この辺は適当に!Next!
f:id:walkingmask:20151120153846p:plain
好きなディレクトリを選んでCreate!これでプロジェクトの作成は完了!

画面作成

Createを押した後こんな画面になるけどスルーして左上のファイル一覧からMain.storyboardを選択!
f:id:walkingmask:20151120153857p:plain
こんなのが出る!真ん中の白いスペースをドラッグするとグリグリ動く!
f:id:walkingmask:20151120153909p:plain
ってことでとりあえず何か貼り付ける!今回は目覚まし時計っぽいものを作るってことでまず必要なのは時間を設定するやつ!一番右下にある検索窓にDateと打ち込むとDate Pickerというのが出てくるからそれをドラッグして白いスペースにドロップ!
f:id:walkingmask:20151120153918p:plain
でかっ!
f:id:walkingmask:20151120153927p:plain
適当にいじって調整して真ん中に持ってくる!
f:id:walkingmask:20151120153936p:plain
このままだとアプリを動かした時にDate Pickerが真ん中に表示されない!なぜか!なので便利ツールを使う!下の方にある |-△-| みたいなやつをクリック!!!!するとメニューが出てくるのでAdd Missing Constraintsをクリック!!!!!!!
f:id:walkingmask:20151120154013p:plain
そうするとこんな感じに!??これでアプリを起動しても位置がずれない!!
f:id:walkingmask:20151120153944p:plain
同じ要領でButtanとLabelも貼り付けてく!
f:id:walkingmask:20151120153956p:plain
f:id:walkingmask:20151120154005p:plain
f:id:walkingmask:20151120154017p:plain
f:id:walkingmask:20151120154025p:plain
f:id:walkingmask:20151120154034p:plain
ここで起動!!!左上の再生ボタンみたいなのを押す!ちょっと待つ!...アプリっぽい!
f:id:walkingmask:20151120154042p:plain

Connect

とりあえず停止ボタンを押して元の画面へ!右上にあるメビウスの輪みたいに輪っかが2つ重なってるみたいなボタンをクリック!
多分こんな感じになる!ごちゃごちゃしすぎて見難い!
f:id:walkingmask:20151120154046p:plain
次はちょっとテクニックがいる!さっきスペースに貼り付けたDate Pickerやラベルやボタンをプログラム上に持っていかなくてはいけない!じゃないと使えな!けどどうやって!!!???それは...簡単!貼り付けたオブジェクトの上でcontrolキーを押しながらドラッグして右のViewController.swiftの画面上に持ってくだけ!何言ってるかわからなくてもとりあえずやってみる!
f:id:walkingmask:20151120154055p:plain
こんな感じのが出れば成功!適当に名前つけてあげてConnect!
f:id:walkingmask:20151120154105p:plain
続いてDate Picker!
f:id:walkingmask:20151120154113p:plain
次もDate Picker!今回はちょっと違う!Actionになってる!こうすることでDate Pickerが動いた時に呼び出される関数を作れる!
f:id:walkingmask:20151120154123p:plain
Buttonも同じくAction!!!
f:id:walkingmask:20151120154132p:plain
これで接続完了!!!!!
f:id:walkingmask:20151120154141p:plain

プログラミング

いよいよプログラミング!今度は右上のメビウスの輪を元に戻してViewController.swiftをいじる!
f:id:walkingmask:20151120154151p:plain
試しにボタンを押したらコンソールに何かプリントされるような機能をさっき作った関数に加えてみる!
f:id:walkingmask:20151120154200p:plain
コピペ用!

print("test: myDP moved!")
print("test: myButton Pushed!")

これで再生ボタンを押してアプリを起動してからDate PickerやButtonを触ってみると...
f:id:walkingmask:20151120154209p:plain
Xcodeの方の画面になんか出力されてる!

目覚まし時計っぽい機能の実装

とりあえずコード!

import UIKit

class ViewController: UIViewController {
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        
        // 起動した時点の時刻をmyLabelに反映
        myLabel.text = getNowTime()
        // 時間管理してくれる
        _ = NSTimer.scheduledTimerWithTimeInterval(60, target: self, selector: "update", userInfo: nil, repeats: true)
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
    
    @IBOutlet weak var myLabel: UILabel!
    @IBOutlet weak var myDPvar: UIDatePicker!
    
    private var tempTime: String = "00:00"
    private var setTime: String = "00:00"
    
    @IBAction func myDPfunc(sender: AnyObject) {
        // test print
        print("test: myDP moved!")
        // DPの値を成形
        let format = NSDateFormatter()
        format.dateFormat = "HH:mm"
        // 一時的にDPの値を保持
        tempTime = format.stringFromDate(myDPvar.date)
    }
    
    @IBAction func myButtonfunc(sender: AnyObject) {
        // アラームをセット
        setTime = tempTime
        // test print
        print("test: myButton Pushed!")
    }
    
    func getNowTime()-> String {
        // 現在時刻を取得
        let nowTime: NSDate = NSDate()
        // 成形する
        let format = NSDateFormatter()
        format.dateFormat = "HH:mm"
        let nowTimeStr = format.stringFromDate(nowTime)
        // 成形した時刻を文字列として返す
        return nowTimeStr
    }
    
    func update() {
        // 現在時刻を取得
        let str = getNowTime()
        // myLabelに反映
        myLabel.text = str
        // アラーム鳴らすか判断
        myAlarm(str)
    }
    
    func myAlarm(str: String) {
        // 現在時刻が設定時刻と一緒なら
        if str == setTime{
            alert()
        }
    }
    
    // アラートの表示
    func alert() {
        let myAlert = UIAlertController(title: "alert", message: "ring ding", preferredStyle: .Alert)
        let myAction = UIAlertAction(title: "dong", style: .Default) {
            action in print("foo!!")
        }
        myAlert.addAction(myAction)
        presentViewController(myAlert, animated: true, completion: nil)
    }


}

使い方

起動!Date Pickerに現在時刻が表示されてると思うので1分後くらいにスクロールする!(ドラッグ)そしてButtonをクリック!1分待つとダイアログが表示される!
f:id:walkingmask:20151120154220p:plain

色々説明

詳しくはコメント読んで!ググって!!!

  • まずアプリ起動時にviewDidLoadが呼び出されるはず!
  • myLabelにgetNowDateで取得した現在時刻を渡す!
  • NSTimer.〜が設定した時間ごとに選択した関数を呼び出してくれてるはず!!
  • 60秒毎に設定してるためちょっと起動が遅れてる(1とか1/60とかも可能!その際myAlarmがそのままだと大変なことに!?)
  • NSDateFormatterは日付時刻なんかのデータを指定した形式にしてくれる感じ!
  • NSDateは現在時刻を教えてくれる!年月日から秒まで教えてくれる!!
  • UIAlert〜はダイアログ出すためのもの!

こんな感じで!

最後に

プロジェクトの作り方もわからない・アラームっぽいものを作ってみたい人用の超簡単実践式チュートリアルを書いたつもり.誰かと将来の自分の役に立てばいいな.余談ですが,Swiftのversion調べようと思ってとりあえずterminalでswift -vって打ったらインタープリタ?が起動した.なんか使い道ありそう.あとは,Xcodeの起動画面でごちゃごちゃと最近いじったプロジェクトが表示されて煩わしい場合はFile->Open Recent->Clear Menuでいける.