hiramatch's blog

iOSアプリ開発に目覚め、毎日勉強の日々です。

AutoLayoutを使わずに画面中央に図形表示

今日はAutoLayoutを使わずに画面中央での図形表示に挑戦してみました。
iOSデバイスには様々な画面サイズがありますがその画面サイズを
UIScreenクラスで画面サイズを取得し、その中心に円を表示させています。
また縦横の中央線も入れてみました。
(今回は縦向きのみ限定としています)
iPhone6
f:id:hiramatch:20150412221922p:plain

iPhone4S
f:id:hiramatch:20150412222052p:plain

以下がそのソースです。

今回は縦向きのみでしたが横向きでも中央表示出来るよう目指したいと思います。

SwiftでTableViewのデリゲート

今日はTableViewでのデリゲートの方法です。

iPhoneアプリでTableViewを実現する為には
「行数を返す」や「セクション数を返す」「セルを返す」といったデリゲートメソッドをViewControllerにデリゲートする必要があります。

※「デリゲート」とは「委譲」を意味し
PickerViewやTableViewなどでイベントをキャッチしてそのイベントに対する処理をViewControllerに任せる仕組みと理解しています。

pickerViewの場合はViewControllerクラスの宣言部の後ろにUIPickerViewDataSourceプロトコルやUIPickerViewDelegateプロトコルを追記し、ViewControllerに「ピッカービュー名.delegate=self」とすることでViewControllerにデリゲートしていました。

それに対しTableViewではViewControllerとIBOutletによりつながっていないため
StoryBourdで右クリックして以下のメニューを表示し、datasource, delegate
黄色のViewControllerまでドラッグして接続しています。

f:id:hiramatch:20150405224303p:plain


以下はViewControllerのソースです


以下は実行結果です
f:id:hiramatch:20150405224637p:plain

SwiftでAutoLayoutに挑戦(multiplier)

過去にSwiftでAutoLayoutを実現する記事を書いたのですがhiramatch.hatenablog.com

その中でよく分かっていなかったNSLayoutConstraintのイニシャライザに指定するmultipilierについての覚え書きです。

このmultipilierですがどうやらNSLayoutConstraintの中で指定するitemとtoItemとの比率を指定するもの様です。

以下はその確認です。

まずは確認に使った画像
f:id:hiramatch:20150330222017j:plain

次にViewController

画像の横幅をmultipilier=0.8と設定することで画面横幅の80%とし
画像の縦幅をmultipilier=0.2と設定することで画面縦幅の20%としています。

そして実行結果です。
f:id:hiramatch:20150330222254p:plain

テキスト入力するキーボードを非表示

今回はテキストフィールド編集時に表示されるキーボードを非表示にする方法の覚え書きです。

f:id:hiramatch:20150315162550p:plain

改行ボタンを押下したタイミングでキーボードを非表示にする為に

①ViewControllerにてテキストフィールドデリゲートプロトコルを指定
②テキストフィールドのデリゲート先にviewControllerに指定
③デリゲートプロトコルで定義された改行ボタン押下イベント時のメソッドtextFieldShouldReturnを実装
という手順を行いました。

テキストフィールドは2つ用意し
それぞれで処理が分かれることを確認できるようにしました。

キーボードの非表示にする処理は「表示中のView」(ここの例ではviewControllerのview)に対してendEditing(true)」を実施しています。



以下は実行結果です。(キーボード非表示直後)
f:id:hiramatch:20150315224454p:plain

文字列検索と置換

今日は文字列の検索、置換にはまっていましたのでその覚え書きです。

f:id:hiramatch:20150315091002p:plain

SwiftではString→NSStringに変換してからNSStringとして編集するのが一般的な様です。
(認識違いでしたらすみません )

ImageViewの表示モード(Scele to Fill, Aspect Fitなど)を試してみる

今日はImgeViewの表示モードを変えた時、画像がどう変わるか確認してみました。
以下は確認に使った画像です。
(以前iPhoneで撮影したものでサイズは3264 x 2468です。)

f:id:hiramatch:20150308124603j:plain

以下は上記の画像をサイズ200 x 200の正方形のImagViewで表示させたもので
それぞれの表示モードを「Scale to Fill」「Aspect Fit」「Aspect Fill」に設定しています。
f:id:hiramatch:20150308124803p:plain


まず「Scale to Fill」ですが横長の画像を縦横の比率を変え正方形の画像で
全体表示させています。

f:id:hiramatch:20150308212727p:plain

つづいて「Aspect Fit」ですが縦横の比率をそのままに長い横を基準に全体表示させています。
f:id:hiramatch:20150308213502p:plain

最後に「Aspect Fill」ですが縦横の比率をそのままに短い縦を基準に長い横の両端が切り取られた形で表示されています。
f:id:hiramatch:20150308213529p:plain

表示モードは他にいろいろあるようですが通常は上記の3つになるのではないかと思われます。

SizeクラスでiPhoneの縦横別でレイアウトの異なる画面を作る

今回はXcodeのSizeクラスでiPhoneの縦横別でレイアウトが異なる画面を作ってみました。
SizeクラスとはXcodeの機能で画面サイズ、画面の縦横別に画面のデザインを対応できるもので以下の画面のチェックボックスをONになっていると利用可能です(デフォルトはON)
f:id:hiramatch:20150307130749p:plain

まずは共通のレイアウト(Any Width Any Height)になります。
f:id:hiramatch:20150307124910p:plain

ここでは画像をAutoLayoutで画面中央に表示させる制約を追加しています。
f:id:hiramatch:20150307125148p:plain


次はiPhone横向きのレイアウト(Any Width Compact Height)です。
f:id:hiramatch:20150307125354p:plain

画面横向き時、画像を画面右下に表示させる制約を追加し、更に画面横向き時のみ表示させるラベルを追加しています。
f:id:hiramatch:20150307125557p:plain

以下はプレビューです。
iPhoneの縦向き,横向きでレイアウトが異なることを確認しました。
f:id:hiramatch:20150307125808p:plain