2015年07月29日
7. Swift入門 UILabelで文字列の表示入門
キーワード
:Xcodeの使い方 Swift
UILabel 文字列表示

今回の記事では、
Macのプログラミング
統合開発環境
(IED:Integrated Development Environment)
のXcodeを使って、
Xcode
Swift言語の入門的な内容の記事を
まとめておきます。
動画では、
コード入力で、
「 UILabelクラス 」
を利用しながら、
IOSシミュレータ上に
文字列を表示させる方法
を解説しています。
Xcodeで、
iOSアプリ開発するための
設定方法がわからない方がいましたら、


などの記事もご活用ください。
「 Single View Application」の設定方法などを
解説しています。
また、
「 CGRectMake(x, y, width, height) 」
で、長方形領域を指定する際の
iOSデバイス(iPhone6)上の、
描画と表示位置・配置の関係については、

の記事もご活用ください。
Swift入門 UILabelで文字列の表示入門(動画)
[ 入力前のコード ](ViewController.swift)
import UIKit
class ViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
}
}
[ 動画で入力したコード例 ](ViewController.swift)
let sampleText = UILabel(frame: CGRectMake(20, 50, 300, 20))
sampleText.textColor = UIColor.blackColor()
sampleText.textAlignment = .Center
sampleText.text = "文字入力の練習"
view.addSubview(sampleText)
* 今回は、「 let:後から変更できない変数の作成 」を利用して
「 sampleText 」という名前の変数を作成しています。
自分でわかりやすいような変数を作成してみていただければと
思います。
[ 最終的なサンプルコード ](ViewController.swift)
import UIKit
class ViewController: UIViewController {
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view, typically from a nib.
let sampleText = UILabel(frame: CGRectMake(20, 50, 300, 20))
sampleText.textColor = UIColor.blackColor()
sampleText.textAlignment = .Center
sampleText.text = "文字入力の練習"
view.addSubview(sampleText)
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
// Dispose of any resources that can be recreated.
}
}
* コード内に全角スペースが含まれていると
エラーになりますので、
その際は、半角スペースに適宜修正してください。
UILabelクラスでは、
・フォントの指定
・テキストの色を指定
指定したい色はUIColorクラスで指定します。
黒色 :UIColor.blackColor()
明るい灰色:UIColor.lightGrayColor()
暗い灰色 :UIColor.darkGrayColor()
灰色 :UIColor.grayColor()
白色 :UIColor.whiteColor()
赤色 :UIColor.redColor()
緑色 :UIColor.greenColor()
黄色 :UIColor.yellowColor()
オレンジ色:UIColor.orangeColor()
など
今回の記事のサンプルコードを例にとると
sampleText.textColor = UIColor.redColor()
で実装できると思います。
・テキストの影の色を指定
今回の記事のサンプルコードを例にとると
sampleText.shadowtColor = UIColor.redColor()
などで実装できると思います。
・影のオフセットをCGSize構造体として、ポイント数で指定
今回の記事のサンプルコードを例にとると
sampleText.shadowOffset = CGSize(width: 3, height: 5)
などで実装できると思います。
・横の配置の指定(左寄せ・中央・右寄せ)
中央 :.Center
左側に寄せる:.Left
右側に寄せる:.Right
今回の記事のサンプルコードを例にとると
sampleText.textAlignment = .Right
などで実装できると思います。
・改行の指定
・表示可能な最大行数の設定
・文字列が指定した長方形領域を越した際の設定
(縮小設定 or 非表示)
・タッチの検知・非検知
など、
さまざまな指定ができるようですので
いろいろと試してみてください。
[ スポンサードリンク ]
by はじめてのコンピュータ・パソコン










タグ:Swift | プログラミング講座 Xcodeでアプリ開発講座 Swift programming language | Xcode入門 Xcode(Mac)で覚えるSwiftプログラミング入門講座
posted by HajimeteCPC at 16:22
| Xcode(Mac)で覚えるSwiftプログラミング