9日目のアプリ
インタラクティブ的なストーリー分岐
画面キャプチャ
MVCの形で作成。
以下の流れで作りました。
- オブジェクトを配置して、Viewcontrolerに紐付け
- MVCに分割して作ることを目的に作成
できたこと
- 配列作成
- label、ボタンの文字要素を差し替え表示
- 答えによる分岐
- ##書いたコードを共有します！
▼▼▼Model(Story.swift)
```
import Foundation
struct Story {
let title: String
let choice1: String
let choice1Destination: Int //choice1 を選択したときの次のストーリー番号
let choice2: String
let choice2Destination: Int //choice2 を選択したときの次のストーリー番号
}
▼▼▼Model(Story.swift)
import Foundation
struct StoryBrain {
var storyNumber = 0
let stories = [
Story(
title: "Your car has blown a tire on a winding road in the middle of nowhere with no cell phone reception. You decide to hitchhike. A rusty pickup truck rumbles to a stop next to you. A man with a wide brimmed hat with soulless eyes opens the passenger door for you and asks: 'Need a ride, boy?'.",
choice1: "I'll hop in. Thanks for the help!", choice1Destination: 2,
choice2: "Better ask him if he's a murderer first.", choice2Destination: 1
),
Story(
title: "He nods slowly, unfazed by the question.",
choice1: "At least he's honest. I'll climb in.", choice1Destination: 2,
choice2: "Wait, I know how to change a tire.", choice2Destination: 3
),
Story(
title: "As you begin to drive, the stranger starts talking about his relationship with his mother. He gets angrier and angrier by the minute. He asks you to open the glovebox. Inside you find a bloody knife, two severed fingers, and a cassette tape of Elton John. He reaches for the glove box.",
choice1: "I love Elton John! Hand him the cassette tape.", choice1Destination: 5,
choice2: "It's him or me! You take the knife and stab him.", choice2Destination: 4
),
Story(
title: "What? Such a cop out! Did you know traffic accidents are the second leading cause of accidental death for most adult age groups?",
choice1: "The", choice1Destination: 0,
choice2: "End", choice2Destination: 0
),
Story(
title: "As you smash through the guardrail and careen towards the jagged rocks below you reflect on the dubious wisdom of stabbing someone while they are driving a car you are in.",
choice1: "The", choice1Destination: 0,
choice2: "End", choice2Destination: 0
),
Story(
title: "You bond with the murderer while crooning verses of 'Can you feel the love tonight'. He drops you off at the next town. Before you go he asks you if you know any good places to dump bodies. You reply: 'Try the pier.'",
choice1: "The", choice1Destination: 0,
choice2: "End", choice2Destination: 0
)
]
//ストーリーを表示するメソッド
func getQuestionText() -> String { //型はstringを返す
return stories[storyNumber].title
}
//ボタン内に選択肢1を表示する
func getAnswer1() -> String {
return stories[storyNumber].choice1
}
//ボタン内に選択肢2を表示する
func getAnswer2() -> String {
return stories[storyNumber].choice2
}
//ボタンの文字と選択肢を比較して、同じなら（⇦同じになる）設定したシナリオ番号を返す
mutating func nextStory(userChoice: String) {
//今のシナリオ番号を取得する
let currentStory = stories[storyNumber]
if userChoice == currentStory.choice1 {
storyNumber = currentStory.choice1Destination
} else if userChoice == currentStory.choice2 {
storyNumber = currentStory.choice2Destination
}
}
}
```
▼View(Main.Storyboard)
ストーリーボード
▼Controller(ViewController.swift)
```
import UIKit
class ViewController: UIViewController {
//ボタンの紐付け
@IBOutlet weak var storyLabel: UILabel!
@IBOutlet weak var choice1Button: UIButton!
@IBOutlet weak var choice2Button: UIButton!
//Modelを読み込む。使うため。swiftのファイル名と同じ名称をつける。変数も文字列同じだが、最初は小文字。
var storyBrain = StoryBrain()
override func viewDidLoad() {
super.viewDidLoad()
//初期画面を表示する
updateUI()
}
@IBAction func choiceMade(_ sender: UIButton) {
//Modelに書かれているメソッド nextStory（次のストーリー）を呼び出す。
//引数にボタンのcurrentTitleを持たせる
// let userChoice = sender.currentTitle!
// storyBrain.nextStory(userChoice: userChoice)
//
storyBrain.nextStory(userChoice: sender.currentTitle!)
//画面に表示する
updateUI()
}
func updateUI() {
//はじめの文言表示と更新時の表示項目設定
storyLabel.text = storyBrain.getQuestionText() //ラベルの文字
//ボタンの文字を表示。Modelのメソッドを読み込んで使う。Modelにメソッドを作成する。
choice1Button.setTitle("\(storyBrain.getAnswer1())", for: .normal)
choice2Button.setTitle("\(storyBrain.getAnswer2())", for: .normal)
}
}
```
感想
MVCのパターンをまた少し覚えました！
繰り返しやると地味に覚えてきますね。