UILabelで文字列を表示する – Xcodeの使い方3 | 沖縄人がサラリーマンからの独立を目指すブログ

はじめに

どんどんiPhoneプログラミングの解説を続けていきたいと思います。目標はプログラミング文法、Xcodeの使い方、実践テクニックを網羅したブログにしたいですね〜

今回からiPhoneで利用できるオブジェクトの説明をします。今回はUILabelの機能を紹介します。

UILabelとは？

UILabelとは主に画面に文字を表示されたい時に利用します。まずは以下のようにLabelとButtonを配置しましょう。オブジェクトの配置方法などXcodeも基本については以下のページを参照してください。

UILabelの主なプロパティ(設定項目)

UILabelの主なプロパティ(設定項目)は以下の通りです。UILabelなどのオブジェクトの設定はプロパティと呼ばれます。

プロパティ名	説明
text	Labelに表示するテキストを設定する
textColor	テキストの色を設定する
backgroundColor	背景色を設定する
textAlignment	文字の横を揃える左揃え、中央揃え、右揃えがある
numberOfLines	Labelに表示する最大行数を設定する。
font	Labelの文字のフォントを設定する

ユーティリティエリアからUILabelのプロパティを変更しましょう〜まずはInterface BuilderからLabelを選択します。

ユーティリティエリアからText、textColor、backgroundColorを変更してみましょう。ユーティリティエリアから以下のように変更します。

プロパティを変更後、UILabelが以下のようになれば成功です！

プログラムからUILabelのプロパティを変更する

以下の図のようにUILabelのOutletとButtonのActionを追加します。OutletとActionについては以下を参照してください。

Xcodeの基本的な開発の流れ – Xcodeの使い方1

「TouchButton」と名前をつけたAction関数で「Label」と名付けたのOutlet変数を利用してプロパティを変更します。プロパティの変更は以下の形式で記述します。

Outlet変数名.プロパティ名 = 設定値

実際にUILabelのテキストの内容、テキスト色、背景色をプログラムから変更してみます。実際には以下のように記述します。

//UILabelのテキストを Hello に変更する
Label.text = "Hello"
        
//文字色を赤に変更する
Label.textColor = UIColor.redColor()

//背景色を青に変更する
Label.backgroundColor = UIColor.blueColor()

textColorとbackgroundColorのプロパティの設定はUIColorで設定しています。UIColorは色を管理しており色の設定はUIColorを通じて設定することが多いです。

ViewController.swiftの全コードは以下のようになります。

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var Label: UILabel!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
    }

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


    //Buttonをタップした時
    @IBAction func TouchButton(sender: AnyObject) {

        //UILabelのテキストを Hello に変更する
        Label.text = "Hello"
        
        //文字色を赤に変更する
        Label.textColor = UIColor.redColor()
        
        //背景色を青に変更する
        Label.backgroundColor = UIColor.blueColor()
    }
}

あとはプログラムを実行して以下のようにButtonを押したらタイミングでUILabelの表示が変われば成功です！お疲れ様でした！