Swift

Auto Layoutをコードから使おう

Auto LayoutによるビューのレイアウトはStorybordのGUIで設定できますが、もちろんコードからもAuto Layoutは設定できます。 コードでAuto Layoutができるようになれば、コンテンツをサーバーから取得して動的にレイアウトができるようになり、アプリ制作の幅がさらに広がります。 ただStoryboardでGUIからレイアウトするのとは異なり、コード特有の設定がいくつかありますので1つずつ見ていきましょう。 コードでAuto Layout コードでAuto Layoutを設定する流れは以下です ビューを生成する translatesAutoresizingMaskIntoConstraintsをオフにする ビューを他のビューに配置 ビューの制約を設定する 今回作るレイアウト 今回作るレイアウトは、以下のように赤いビューと黄色いビューを水平に並べるものを作りたいと思います。 設定しようとしている制約もここでまとめておきます。 赤のビュー 上部と親ビューの上部の距離が88 左側と親ビューの左側の距離が10 下部と親ビューの下部の距離が20 幅が親ビューの幅の40% 黄色ビュー 上部と親ビューの上部の距離が88 右側と親ビューの右側の距離が10 下部と親ビューの下部の距離が20 幅が赤色ビューと同じ

  • 佐藤 剛士
5 min read
Swift

[Swift]クロージャーについてまとめてみたよ

追記 構成を直して書き直しました。 こちらからご覧になれます。 Objective-CからSwiftに乗り換え中ですが、つまづく文法がいろいろあります。 その中の一つがクロージャー。 今回はクロージャーについてまとめてみました。 そもそもクロージャーって? wikiの説明を見てみます。 クロージャ(クロージャー、英語: closure)、関数閉包はプログラミング言語における関数オブジェクトの一種。いくつかの言語ではラムダ式や無名関数で実現している。引数以外の変数を実行時の環境ではなく、自身が定義された環境(静的スコープ)において解決することを特徴とする。 wiki-クロージャ クロージャーはざっくり言うと自分を囲むスコープにある変数を操作できる関数です。 以下のようにネストする関数を考えてみます。 func outer() -> () ->Void{ var x = 10 func

  • 佐藤 剛士
5 min read
Auto Layout

レイアウトの救世主Stack Viewを使ってみよう

Auto Layoutには実は重大な欠点がありました。 それは、、 レイアウトの修正が大変 ということです。 レイアウトする要素が増えれば振れるに従って隣のビューとの関係も複雑になってしまいます。 例えば、画面上にボタンを縦に3つ並べるレイアウトを考えてみましょう。 ボタンをそれぞれ同じ大きさに縦に3つ並べるレイアウトを作ってみます。 このとき3つのボタンと親ビューとの関係性はざっと数えた分でも10個できてしまいます。 設定によってはそれ以上になることも考えられるでしょう。 ここで、ボタンを4つに増やしたいと思ったらどうでしょう? 少なくとも垂直方向の関係性は見直す必要があるでしょう。 ボタンが3つから4つになったとこで、親ビューとボタン同士の隙間の幅が変わることになるからです。 これはもう一大事です。 制約を1つずつ見なおしてボタンを増やすか、いっそのこと全ての制約を一度全部解除して、もう一度設定し直すかをしなければいけません。 実際私はこのような場合は制約を全部解除して、全ての制約を設定しなおしていました。 この方が、制約を修正するよりもかえって早いことが多かったからです。 しかし、一度設定したものを毎回全てリセットしていくのもやりきれない思いがします。 しかも、レイアウトの変更などはしょっちゅう行われます。 あとでボタンが必要になったなんてことは日常茶飯事です。

  • 佐藤 剛士
4 min read
iOS

Auto Layoutを始める前に

数年前、iPhone4sが全盛期のころまでは、iOSアプリの開発者は各端末のレイアウトを考える必要はありませんでした。 初代iPhoneからiPhone4sまでは画面サイズは一緒だったからです。 その頃に端末サイズのレイアウトで苦労していたのはAndroidアプリのエンジニアでした。(今もそうですが。。) 各メーカーごとに端末のサイズが異なり、それに合わせてアプリをデザインしなければなりませんでした。 しかし、2010年にiOSで動くタブレット、iPadが発売され、2012年にiPhone5が発売され、iOSエンジニアも各端末ごとのレイアウトをそれぞれで設定しなければいけなくなりました。 以下は、2015年12月現在で発売されているiOS端末の画面サイズの一覧です。 ピクセル解像度は物理的なピクセルを計ったもので、ポイント解像度はプログラムからアクセスする座標系で計った解像度です。 各端末ごとに、異なっていることが一目瞭然です。 異なる画面サイズでも、うまい具合に画面レイアウトができるようにする機能がAuto Layoutです。 iOSエンジニアにとっては避けては通れない重要な機能となりつつあります。 これから何回か記事をわたって、Auto Layoutを解説していきたいと思います。 Auto Layoutの概要、仕組み、具体的な機能を網羅するつもりです。 この記事を通して、Auto

  • 佐藤 剛士
2 min read
Swift

[Swift]作業効率10倍アップ?フォーム作成ライブラリー「Eureka」チュートリアル

UITableViewはアプリを作る上で一番基本になるViewですね。 アプリの設定画面、フォームなどでよく使います。 しかし、作るとなったらいろいろめんどくさいのも事実です。 デリゲートを作って、カスタムセル作って、データソースを管理したり。。。 そんな、UITableViewの面倒なものを一掃する便利なライブラリーがあります。 Eurekaです。 これを使えば、作業効率10倍アップは間違いない、あっと言う間にUITableviewを使った画面が作れちゃいます。 ただ、DSL(ドメイン固有言語)でセルを定義していくので、始めのうちは戸惑うかもしれません。 今回はEurekaライブラリーの使い方をご紹介します。 Eurekaとは? Eurekaはウルグアイのアプリデザイン会社XMARTLABSが開発をしているオープンソースです。 Swift2で作製されているフォーム作製ライブラリーです。 もともとObjective-C製のXLFormというライブラリーがあったそうなのですが、それをSwiftで作りなおしたのがEurekaになります。 使用要件 現在Eurekaを使うには以下の条件が必要です。 iOS 8.0+ Xcode 7.0+

  • 佐藤 剛士
5 min read
Swift

UITableviewに文字列センターのフッターを作る

UITableviewに文字列センターのフッターを作るTipsです。 アプリを作っていく中で、UITableViewの一番最後のセルにセンタリングで、アプリ情報を表示しようと思いました。 UITableViewのデータを管理するプロトコルUITableViewDataSourceには` tableView:titleForFooterInSection:というメソッドがあって、文字列を指定するとフッターに文字を表示してくれます。 始めはこのメソッドで事足りるかなと思ったのですが、なんと- tableView:titleForFooterInSection:`文字のセンタリングはしてくれないんですね。 必ず左詰めになってしまいます。 でもセンター、中央揃えでテキストを表示したいときもあります。 そのやり方を見ていきましょう! 目次 実行環境 UITableviewを作る - tableView:titleForFooterInSection:を使ってみる - tableView:viewForFooterInSection:を使ってみる まとめ サンプルコード 実行環境 OSX

  • 佐藤 剛士
3 min read
Swift

[Swift]アプリ内で設定アプリを開く方法いろいろ

アプリから設定アプリを開く方法をまとめました。 アプリから設定アプリを直接開く方法はiOS5.0.1まで可能だったそうですが、iOS5.1から禁止になったそうです。 しかしiOS8から復活。直接アプリから設定アプリを開けるようになりました。 通知やモバイルデータ通信など、設定アプリで設定してもらう機会は意外と多いです。そんなとき直接アプリから開けるようになれば、ユーザビリティが向上するでしょう。 それでは見ていきましょう。 実行環境 Xcode7.2 OSX Yosemite 10.10.5 Swift 2.1.1 UIApplicationOpenSettingsURLString を使う UIApplicationクラスで定義されているUIApplicationOpenSettingsURLStringという定数を使うとアプリから設定アプリ呼び出せます。 遷移する設定アプリのページは、そのアプリにアプリ固有のプリファレンスがある場合はそのページヘ。プリファレンスがない場合は設定アプリトップに遷移します。 プリファレンスは 呼び出した設定アプリのページはトップになります。

  • 佐藤 剛士
2 min read
Swift

[swift]UITextFiledでキーボード以外タップでキーボードを非表示にする

細かなUIがUXを向上することはよくあります。 今日ご紹介するTipsはUITextFiledでキーボード以外の領域をタップしたときにキーボードを非表示にする方法です。 Lineなどのメッセンジャーアプリなどでは、キーボード以外の領域をタップした時にキーボードが非表示になるUIがしばしばあります。 このUIを作ってみましょう 実装方法 実装方法はとっても簡単。 ViewControllerのサブクラスにtouchesBeganメソッドをオーバーライドし、以下のコードを書くだけです。 今回はstoryboardからtextFieldというUITextFieldをつなげている想定です。 //ViewController.swift //TextFiledをstoryboardからつなげておく @IBOutlet weak var textField: UITextField! //MARK: キーボードが出ている状態で、キーボード以外をタップしたらキーボードを閉じる override func touchesBegan(touches: Set<UITouch>, withEvent event: UIEvent?) { //非表示にする。

  • 佐藤 剛士
1 min read
iOS

[Swift]ナビゲーションバーの色を変更する

Swiftでナビゲーションバーの色を変更するTipsをご紹介します。 実行環境 Xcode7.1.1 OSX Yosemite バージョン10.10.5 AppDelegateで変更する場合 ナビゲーションバーのアイテムの色、背景色、タイトル文字色を変更したい場合は、AppDelegate.swiftの``` application:didFinishLaunchingWithOptions:``` メソッドで以下のような指定をします。 //AppDelegate.swift func application(application: UIApplication, didFinishLaunchingWithOptions launchOptions: [NSObject: AnyObject]?) -> Bool { // Override

  • 佐藤 剛士
1 min read