//jQueryとprototypeの競合を避ける jQuery.noConflict(); Swift Life

[Swift][動画説明付き] アクション接続の作成

今回はアクション接続の方法について動画で説明します。

アクション接続とは、ウィンドウに配置されているUI部品に対し、何かしらのアクションを行ったことをコード側に伝える接続のことです。

例えば、ウィンドウ上にUIButtonが貼り付けてあり、「ユーザーがタッチした」という情報をコード側で認識して何らかの処理を行いたい場合に作成します。

アクション接続の作成について、以下の動画で説明します。

UIButtonのアクション接続を作成します。

[Swift][動画説明付き] アウトレット接続の作成

ウィンドウ上の貼り付けたUI部品とコードを結びつけるには、

  • アウトレット接続
  • アクション接続

の2種類があります。

今回はアウトレット接続の方法について説明します。

アウトレット接続とは、コードからウィンドウ上のUI部品に対して操作を行うための結びつけのことです。

例えば、ウィンドウ上にUILabelが貼り付けてあり、コードから「HIRO」の文字列を表示できるようにするには、アウトレット接続を作成する必用があります。

アウトレット接続の作成については以下の動画を参考にしてください。

myLabelという名前でアウトレット接続を作成します。

アウトレット接続を作成できたら、後はコードからUI部品の操作を行うことができます。

UILabel に文字を表示するには以下のようにします。

import UIKit

class ViewController: UIViewController {


    @IBOutlet weak var myLabel: UILabel!
    

    override func viewDidLoad() {
        super.viewDidLoad()

        // Labelにテキストを表示
        myLabel.text = "今日はいい天気ですね"
        
        // Labelの前景色を青に設定
        myLabel.textColor = UIColor.blueColor()
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

}

[Swift] Segue(セグエ)を使用した画面遷移

今回はSegue(セグエ)を使用して、画面遷移をしてみましょう。

はじめにXcodeを起動してプロジェクトを作成します。ここではSingle View Applicationを選択します。

Product Nameを入力してSingle View Applicationを作成します。

Product Nameを入力する

続いてView Controllerを追加します。この追加したView Controllerが遷移先の画面になるように設定していきます。

View Controllerを配置

続いて、元々あったView Controllerと新しく追加したView Controllerにボタンを1つずつ配置して、「Button」の文字をそれぞれ「次へ」と「戻る」に変更します。

[Control]キーを押しながら[次へ]ボタンを新しく追加したView Cotrollerへドラッグ&ドロップするとメニューが表示されるの(これがSegue(セグエ)です)で「Modal」を選択します。

Segueの作成

これで[次へ]ボタンを押すと、新しく追加したView Controllerの画面へ遷移するようになります。

デザイナは以下の図のようになり、はじめにあったView Controllerから新しく追加したView Cotrollerへの遷移を表す線が表示されます。

画面遷移ができるようになる

今度は[戻る]を押したときに元のView Controllerへ戻るようにします。

先ほどと同様の手順でSegueを作成します。

[Control]キーを押しながら、[戻る]ボタンを[次へ]ボタンのある画面へドラッグ&ドロップします。

[戻る]ボタンのSegueを作成する

Segueが作成されると、画面遷移を表す線が表示されます。

[戻る]ボタンによる遷移を表す線が表示される

以上で画面遷移の作成が完了です。

実行して確認すると、[次へ]と[戻る]で画面遷移することができます。

 

 

 

[Mac] スクリーンショットの設定

ブログの記事や、本の原稿などを書いているとスクリーンショットをよく撮ります。

そこで、Macのスクリーンショット設定を覚え書きとして残しておきます。

以下に紹介するコマンドは、Macのターミナルから実行をします。

ターミナルは、Finderから[アプリケーション]-[ユーティリティ]-[ターミナル]を起動します。

なお、以下に記述するコマンドの中で「$ killall SystemUIServer」が頻繁に出てきますが、システムの再起動を表しています(Macの再起動ではありません)。これをしないと設定が反映されないので注意してください。

■スクリーンショットのショートカット

基本的なショートカットコマンドは以下表の通りです。

キーボードショートカット 説明
[Command]+[Shift]+[3] デスクトップ全体の撮影
[Command]+[Shift]+[4] 選択範囲の撮影
[Command]+[Shift]+[4]  + [Space] [Command]+[Shift]+[4] でカーソルが表示されたあとに[Space]を押すことで、特定のウィンドウやメニューなどを撮影できる

■既定のファイル名を変更する

スクリーンショットを撮影すると、「スクリーンショット 2016-02-21 8.38.49」のように保存されます。この「スクリーンショット」の部分の文字列を変更するには以下のコマンドを実行します。

$ defaults write com.apple.screencapture name ファイル名
$ killall SystemUIServer

元に戻す場合は、以下のコマンドを実行します。

$ defaults delete com.apple.screencapture name
$ killall SystemUIServer

■保存ファイル名に日時が含まれないようにする

スクリーンショットのファイル名には、撮影した日時が含まれます。日時を含まないファイル名にするには、以下のコマンドを実行します。

$ defaults write com.apple.screencapture include-date -bool false
$ killall SystemUIServer

元に戻すには以下のコマンドを実行します。

$ defaults write com.apple.screencapture include-date -bool true
$ killall SystemUIServer

■保存場所を変更する

保存場所は既定でデスクトップになっています。これを変更するには以下のコマンドを実行します。

$ defaults write com.apple.screencapture location 保存先のパス
$ killall SystemUIServer

元に戻すには以下のコマンドを実行します。

$ defaults delete com.apple.screencapture location
$ killall SystemUIServer

■影をなくす

スクリーンショットを撮影すると、既定で影が付いてしまいます。この影が不要な場合は以下のコマンドを実行します。

$ defaults write com.apple.screencapture disable-shadow -boolean true
$ killall SystemUIServer

元に戻すには以下のコマンドを実行します。

$ defaults write com.apple.screencapture disable-shadow -boolean false
$ killall SystemUIServer

■保存形式を変更する

既定ではPNGとして保存されます。保存形式BMP、GIF、JPG、PDF、PNG、TIFFに変更することが可能です。

例えばBMP形式で保存する場合は以下のコマンドを実行します。

$ defaults write com.apple.screencapture type bmp
$ killall SystemUIServer

 

[Swift] データ型

swiftには、C#やJavaといった言語と同様にデータ型があります。

データ型とは、変数にどのような値を保存することができるかを表す種類のことです。

たとえば、整数の値を保存できる変数にしたい場合はIntという種類のデータ型になります。IntはInteger(整数の意)から来ています。

Int型の変数を宣言する場合は以下のように記述します。

var kazu: Int = 7   // Int型変数を7で初期化

以下のように記述することも可能です。今度はデータ型を表すIntがないことがわかります。このようにデータ型を省略して記述した場合は、初期値である「7」という値からデータ型を推測して変数のデータ型が決まります。これを型推論と呼びます。

var kazu = 7   // Int型変数を7で初期化

さて、kazuはInt型の変数となりました。ここに文字を代入したらどうなるのかを実験してみましょう。

Int型変数への文字代入

みてわかるとおり、赤でハイライトされエラーとなっていることがわかります。「Cannot assign value of type ‘String’ to type Int」と表示されています。これはInt型にはString型は代入できない というメッセージです。

代入しようとした「テスト」は文字列で、こちらはString型の変数でなければ代入することができません。

このようにSwiftでの変数は、代入する値のデータ型に合わせて変数を準備する必要があります。

Swiftで使用可能な主なデータ型を以下に示します。

データ型 説明
Int 整数を代入できる
Int8, Int16, Int32, Int64というデータ型もあります。
String 文字列を代入できる
bool trueとfalseのいずれかを代入できる
Float 32ビット浮動小数点
Double 64ビット浮動小数点

[Playground] リッチコメントにサンプルコードを記載する

今回はリッチコメントにサンプルコードを記載する例を示します。

たとえば下図のようにサンプルコードを記載することが可能です。

リッチコメントにサンプルコードを記載する

サンプルコードを記載するには、コメントブロック内で、サンプルコードを挿入する位置の上下に空白行を挿入します。

また、サンプルコードの記載場所は[Tab]でインデントを付けます。

/*: 
## if文のサンプル

    var i: Int = 3

    if i == 3 {
        print("i = \(i)")
    }

*/

 

[Playground] リッチコメントに引用テキストを挿入する

リッチコメントには引用コメントを挿入することができます。

引用コメントは、以下の図の水辺線のしたの部分のテキストです。

引用コメントの例

引用コメントを作成するには「>」記号を使用します。

「>」記号の右にスペースを入れ、引用コメントを記載します。

複数行にわたって記載することが可能です。

上に示した図のコードは以下の通りです。

//: タイトル: ブロック引用の例
//:
//:> ここに引用してきたテキストを記載
//:> 複数行にわたって記載できる
//:

[playground] リッチコメントの箇条書きリストに段落を付ける

前回の記事で、箇条書きリストと段落リストの説明をしました。

今回は箇条書きリストの中で段落を付ける方法について見ていきます。

段落を付けた例を以下に示します。

「リンゴ」の箇所は段落が付き、「ふじ」と「王林」があります。

箇条書きに段落を付ける例

コード例は以下の通りです。

段落を付ける場合は、段落を付ける「*」記号の前で[Tab]キーを押して空白を挿入します。

//: ## 箇条書きに段落を付ける例
//: * リンゴ
//:     * ふじ
//:     * 王林
//: * バナナ
//: * ミカン

 

[Playground] リッチコメントで箇条書きと段落リストを表現する

リッチコメントを使用すると、箇条書きや段落リストを表現することができます。

例を以下に示します。

箇条書きと段落リストの例

箇条書き

箇条書きのリッチコメントを作成するには以下のようにします。

//: ## 箇条書きの例
//: * リンゴ
//: * バナナ
//: * ミカン

段落リスト

段落リストのリッチコメントを作成するには以下のようにします。

/*:
## 段落リスト
1. リンゴ
2. バナナ
3. ミカン
*/

[Playground] リッチコメントの基礎

Playgroundでは、リッチコメントを付けることができます。

今回から何回かに分けて説明します。

リッチコメントとは以下のように、装飾された説明のことです。

リッチコメントの例

 

リッチコメントの基本はMarkupフォーマットです。

決められた書式を使用してコメントを書くことでリッチコメントを作成します。

1行のリッチコメント

まずは、1行のリッチコメントを作成してみましょう。

1行のリッチコメントは「//:」の後にコメントとなる文字列を記述します。

//: これはリッチコメントの例です

上記をPlaygroundで入力したら、メニューの[Editor]-[Show Raw Markup]をクリックします。

すると、以下のようにリッチコメントとして表示されます。

リッチコメントの表示例

リッチコメントを元の文字列として表示するには、メニューの[Editor]-[Show Raw Markup]をクリックします。

見出し用リッチコメント

今度は、見出し用のリッチコメントを作成してみましょう。

見出し用のリッチコメントは「#」記号で始めます。

見出しの大きさは3段階あり、#の数で決まります。

#が1個の場合が一番大きく、#が3個の場合が一番小さな見出しになります。

以下に例を示します。

//: # 見出し1
//: ## 見出し2
//: ### 見出し3
//: 通常のリッチコメント

見出し用リッチコメント