LoginSignup
4
2

More than 5 years have passed since last update.

単語当てゲーム、ハングマン(Hangman)作ってみた

Last updated at Posted at 2018-12-03

Swift楽しいです。
初心者です。
うぇい!

Hangmanとは

海外で育った子供なら一度は英語の授業で遊んだであろう文字遊びのゲーム。
「単語を出す側」と、「単語を当てる側」の二人でやる。
最後まで当てられなかったら前者の勝ち、途中で当てられたら後者の勝ち。

進め方

単語を出す側:
頭の中で単語を思い浮かべ、単語の文字数だけアンダーバーを書く。
(考えた単語がAppleなら _ _ _ _ _と紙に書く)

単語を当てる側:
単語に入ってると思ったアルファベットを言って行く。
 ①当たっている場合
 Appleがお題で、「A」と答えたのなら、
  A _ _ _ _
 と書く。

 ②ハズレた場合
 Appleがお題で「B」と答えたのなら
 _ _ _ _ _ のまま。
 そして答えを外すたびに、Hangmanに一筆加える。
alt

画像引用元 http://crfday.jugem.jp/?eid=309

単語を見事当てられたら、「単語を当てる側の勝利」
単語を当てられる前に、Hangmanの絵が完成してしまったら「単語を出す側の勝利」

Swift4でHangmanを作ってみた

スクリーンショット 2018-12-03 23.01.35.png
↑画面↑

「単語を出す側」が最初のスクリーンのTextFieldで単語を書く。
画面にある「START」と書かれたボタンを押すと、次の画面に遷移する。

遷移先で今度は「単語を当てる側」がUIPickerViewを使って単語を当てていく。
そんな感じのゲームです。

プレイしてる感じ

単語はAppleだとします。
UIPickerViewで「a」を選択し、「check」と書かれたボタンを押す。
あたっていると、アンダーバーの上に「a」が映る。
スクリーンショット 2018-12-03 23.06.09.png
間違っていると、Labelに「1」と間違った回数が表示され、Hangmanが出来ていく。
スクリーンショット 2018-12-03 23.06.23.png
ちなみに一度「check」ボタンで試したアルファベットは左下に赤字で表示される。
スクリーンショット 2018-12-03 23.06.47.png
単語を当てると「Congratulations!!」と出る。
スクリーンショット 2018-12-03 23.07.00.png

コード 

2つViewControllerを使います。
まず、最初の画面(単語を出す側が使う方)

EntryViewController.swift
import UIKit

class EntryViewController: UIViewController {    
    // テキストフィールド
    @IBOutlet weak var gameWord: UITextField!

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
    }

    // segue
    @IBAction func startGame(sender: AnyObject?){
        self.performSegue(withIdentifier: "toGame", sender: self.gameWord.text)
    }

    // Segue時の値渡し
    override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
        if segue.identifier == "toGame" {
            let viewController:ViewController = segue.destination as! ViewController
            viewController.guessingWord = sender as! String
        }
    }
}

今度は「単語を当てる側」で使うViewController

ViewController.swift
import UIKit

class ViewController: UIViewController, UIPickerViewDelegate, UIPickerViewDataSource  {

    var guessingWord : String = ""
    var mappedWord : Array = [""]
    var count = 0
    @IBOutlet var label: UILabel!
    @IBOutlet var guessingField: UITextField!
    @IBOutlet var letterPickerView: UIPickerView!
    let alphabetList = ["a","b","c","d","e","f","g","h","i","j","k","l","m","n","o","p","q","r","s","t","u","v","w","x","y","z"]

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.

        // Delegate設定
        letterPickerView.delegate = self
        letterPickerView.dataSource = self

        createWords()
    }

    // UIPickerViewの列の数
    func numberOfComponents(in pickerView: UIPickerView) -> Int {
        return 1
    }

    // UIPickerViewの行数、要素の全数
    func pickerView(_ pickerView: UIPickerView,
                    numberOfRowsInComponent component: Int) -> Int {
        return alphabetList.count
    }

    // UIPickerViewに表示する配列
    func pickerView(_ pickerView: UIPickerView,
                    titleForRow row: Int,
                    forComponent component: Int) -> String? {
        return alphabetList[row]
    }

    // UIPickerViewのRowが選択された時の挙動
    func pickerView(_ pickerView: UIPickerView,
                    didSelectRow row: Int,
                    inComponent component: Int) {
        // 処理
    }

//アンダーバー作るための関数
    func createWords(){
        let mappedWord = guessingWord.map { String($0) }
        let guessingWordLength = mappedWord.count

        for i in 0..<guessingWordLength {
        let TestView = UIView.init(frame: CGRect.init(x: 30+i*30, y: 200, width: 20, height: 2))
            // 30 , 60 , 90, 120...
        let bgColor = UIColor.black
        TestView.backgroundColor = bgColor
        self.view.addSubview(TestView)
        }

        self.mappedWord = guessingWord.map { String($0) }

    }

//PickerViewで選択したアルファベットが当たってるかCheckする
    @IBAction func checkWord(){
        //間違えた回数のカウンター貯めるためのやつ
        let selectedLetter = alphabetList[letterPickerView.selectedRow(inComponent: 0)]

        let letterIndex = mappedWord.index(of: selectedLetter)

        if letterIndex == nil {
            count += 1
            label.text! = String(count)

            let correspondingLabel = self.view.viewWithTag(99+count) as? UILabel
            correspondingLabel?.textColor? = UIColor.red

        }
        //ここまでカウンター用

        //10回するのは、複数回重なってるやつ用
        var i = 0
        while i < 10 {

        //both same
        // let first = guessingWord[guessingWord.startIndex]
        //let first = guessingWord.prefix(1)

        //選択したアルファベット
        let selectedLetter = alphabetList[letterPickerView.selectedRow(inComponent: 0)]
        // print(selectedLetter) -> a

        let letterIndex = mappedWord.index(of: selectedLetter)

        if letterIndex != nil {
            let correspondingLabel = self.view.viewWithTag(letterIndex!+27) as? UILabel
            correspondingLabel?.text = mappedWord[letterIndex!]
            correspondingLabel?.textColor? = UIColor.red

            mappedWord.remove(at: letterIndex!)
            mappedWord.insert("done", at: letterIndex!)

        } else {
        let alphabetNumber = alphabetList.index(of: selectedLetter)
        let correspondingLabel = self.view.viewWithTag(alphabetNumber!+1) as? UILabel
        correspondingLabel?.textColor? = UIColor.red
        }

            i += 1
    }

        //祝杯用
        let dones = Array(repeating: "done", count: guessingWord.count)
        if mappedWord == dones {
            label.textColor = UIColor.red
            label.text = "Congratulations!!"
        }
    }
}

振り返り

作っていて気づいた。UIPickerViewでアルファベット選択するのめんどうくさい!
左下のアルファベットをタップしたほうが100倍楽!とか他にもいろいろ至らないことだらけです。

自分用なのでコード雑だったり、説明なかったりです。ごめんなさい。
これからは他の人が読んでもわかるようにコードを書いていきます。

4
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
4
2