Swift でメモリーカードゲームを書く

この記事では、私がとても気に入っているシンプルな記憶力トレーニング ゲームの作成プロセスについて説明します。 それ自体が優れていることに加えて、学習を進めていくうちに Swift のクラスとプロトコルについてさらに学ぶことになります。 しかし、始める前に、ゲーム自体を理解しましょう。

リマインダー： 「Habr」のすべての読者が対象 - 「Habr」プロモーション コードを使用してスキルボックス コースに登録すると 10 ルーブルの割引。

スキルボックスは次のことを推奨します。 教育オンラインコース 「職業 Java 開発者」.

メモリーカードの遊び方

ゲームはカードのセットのデモンストレーションから始まります。 彼らはうつ伏せに寝ます（それぞれ、イメージを下に向けます）。 いずれかをクリックすると、画像が数秒間開きます。

プレイヤーの仕事は、同じ絵柄のカードをすべて見つけることです。 最初のカードを開いた後、XNUMX 番目のカードをめくって絵が一致した場合、両方のカードは開いたままになります。 一致しない場合、カードは再び閉じられます。 目標はすべてをオープンにすることです。

プロジェクトの構造

このゲームの簡易バージョンを作成するには、次のコンポーネントが必要です。

• XNUMX つのコントローラー: GameController.swift。
• ワンビュー: CardCell.swift。
• XNUMX つのモデル: MemoryGame.swift と Card.swift。
• Main.storyboard を使用して、コンポーネントのセット全体が利用可能であることを確認します。

ゲームの最も単純なコンポーネントであるカードから始めます。

カードスイフト

カード モデルには XNUMX つのプロパティがあります。それぞれを識別する ID、カードのステータス (非表示またはオープン) を指定するために表示されるブール変数、およびカード上の画像のアートワーク URL です。

class Card {        
    var id: String    
    var shown: Bool = false    
    var artworkURL: UIImage!
}

ユーザーによるマップとの対話を制御するには、次のメソッドも必要になります。

カード上に画像を表示する方法。 ここでは、すべてのプロパティをデフォルトにリセットします。 id については、NSUUIS().uuidString を呼び出してランダムな ID を生成します。

init(image: UIImage) {        
    self.id = NSUUID().uuidString        
    self.shown = false        
    self.artworkURL = image    
}

IDカードを比較する方法。

func equals(_ card: Card) -> Bool {
    return (card.id == id)    
}

各カードのコピーを作成する方法 - 同じものをより多く入手するため。 このメソッドは、同様の値を持つカードを返します。

func copy() -> Card {        
    return Card(card: self)    
}
 
init(card: Card) {        
    self.id = card.id        
    self.shown = card.shown        
    self.artworkURL = card.artworkURL    
}

そして、最初にカードをシャッフルするには、もう XNUMX つの方法が必要です。 これを Array クラスの拡張子にします。

extension Array {    
    mutating func shuffle() {        
        for _ in 0...self.count {            
            sort { (_,_) in arc4random() < arc4random() }        
        }   
    }
}

ここでは、すべてのプロパティとメソッドを備えた Card モデルのコードの実装を示します。

class Card {
    
    var id: String
    var shown: Bool = false
    var artworkURL: UIImage!
    
    static var allCards = [Card]()
 
    init(card: Card) {
        self.id = card.id
        self.shown = card.shown
        self.artworkURL = card.artworkURL
    }
    
    init(image: UIImage) {
        self.id = NSUUID().uuidString
        self.shown = false
        self.artworkURL = image
    }
    
    func equals(_ card: Card) -> Bool {
        return (card.id == id)
    }
    
    func copy() -> Card {
        return Card(card: self)
    }
}
 
extension Array {
    mutating func shuffle() {
        for _ in 0...self.count {
            sort { (_,_) in arc4random() < arc4random() }
        }
    }
}

先に行く。

4 番目のモデルは MemoryGame で、ここでは 4*XNUMX グリッドを設定します。 モデルには、カード (グリッド上のカードの配列)、すでに開いているカードを含むcardShown配列、ゲームのステータスを追跡するためのブール変数isPlayingなどのプロパティがあります。

class MemoryGame {        
    var cards:[Card] = [Card]()    
    var cardsShown:[Card] = [Card]()    
    var isPlaying: Bool = false
}

また、グリッドとユーザーの対話を制御する方法を開発する必要もあります。

カードを格子状にシャッフルする方法。

func shuffleCards(cards:[Card]) -> [Card] {       
    var randomCards = cards        
    randomCards.shuffle()                
 
    return randomCards    
}

新しいゲームを作成する方法。 ここでは、最初のメソッドを呼び出して初期レイアウトを開始し、isPlaying 変数を true に初期化します。

func newGame(cardsArray:[Card]) -> [Card] {       
    cards = shuffleCards(cards: cardsArray)        
    isPlaying = true            
 
    return cards    
}

ゲームを再開したい場合は、 次に、isPlaying 変数を false に設定し、カードの初期レイアウトを削除します。

func restartGame() {        
    isPlaying = false                
    cards.removeAll()        
    cardsShown.removeAll()    
}

クリックされたカードを検証する方法。 彼については後で詳しく説明します。

func cardAtIndex(_ index: Int) -> Card? {        
    if cards.count > index {            
        return cards[index]        
    } else {            
        return nil        
    }    
}

特定のカードの位置を返すメソッド。

func indexForCard(_ card: Card) -> Int? {        
    for index in 0...cards.count-1 {            
        if card === cards[index] {                
            return index            
        }      
    }
        
    return nil    
}

選択したカードが規格に準拠しているかどうかを確認します。

func unmatchedCardShown() -> Bool {
    return cardsShown.count % 2 != 0
}

このメソッドは、**cardsShown** 配列の最後の要素を読み取り、一致しないカードを返します。

func didSelectCard(_ card: Card?) {        
    guard let card = card else { return }                
    
    if unmatchedCardShown() {            
        let unmatched = unmatchedCard()!                        
        
        if card.equals(unmatched) {          
            cardsShown.append(card)            
        } else {                
            let secondCard = cardsShown.removeLast()      
        }                    
    } else {            
        cardsShown.append(card)        
    }                
    
    if cardsShown.count == cards.count {            
        endGame()        
    }    
}

Main.storyboard と GameController.swift

Main.storyboard は次のようになります。

最初に、グリッドの画像を含めて、新しいゲームをコントローラーで viewDidLoad として設定する必要があります。 ゲームでは、これはすべて 4*4 collectionView で表されます。 collectionView にまだ慣れていない場合は、ここを参照してください。 必要な情報を得ることができます.

GameController をアプリケーションのルート コントローラーとして設定します。 GameController には、IBOutlet として参照する collectionView があります。 もう XNUMX つの参照は、IBAction onStartGame() ボタンです。これは UIButton であり、PLAY というストーリーボードで確認できます。

コントローラーの実装について少し説明します。

• まず、XNUMX つの主要なオブジェクト、つまりグリッド: ゲーム = MemoryGame() とカードのセット: カード = [Card]() を初期化します。
• 初期変数を viewDidLoad として設定します。これは、ゲームの実行中に呼び出される最初のメソッドです。
• ユーザーが PLAY を押すまですべてのカードが非表示になるため、collectionView は非表示に設定されます。
• PLAY を押すとすぐに、onStartGame IBAction セクションが開始され、カードが表示されるように collectionView isHidden プロパティを false に設定します。
• ユーザーがカードを選択するたびに、didSelectItemAt メソッドが呼び出されます。 このメソッドでは、didSelectCard を呼び出してメイン ゲーム ロジックを実装します。

最終的な GameController 実装は次のとおりです。

class GameController: UIViewController {
 
    @IBOutlet weak var collectionView: UICollectionView!
    
    let game = MemoryGame()
    var cards = [Card]()
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        game.delegate = self
        
        collectionView.dataSource = self
        collectionView.delegate = self
        collectionView.isHidden = true
        
        APIClient.shared.getCardImages { (cardsArray, error) in
            if let _ = error {
                // show alert
            }
            
            self.cards = cardsArray!
            self.setupNewGame()
        }
    }
    
    override func viewDidDisappear(_ animated: Bool) {
        super.viewDidDisappear(animated)
        
        if game.isPlaying {
            resetGame()
        }
    }
    
    func setupNewGame() {
        cards = game.newGame(cardsArray: self.cards)
        collectionView.reloadData()
    }
    
    func resetGame() {
        game.restartGame()
        setupNewGame()
    }
    
    @IBAction func onStartGame(_ sender: Any) {
        collectionView.isHidden = false
    }
}
 
// MARK: - CollectionView Delegate Methods
extension GameController: UICollectionViewDelegate, UICollectionViewDataSource {
    
    func numberOfSections(in collectionView: UICollectionView) -> Int {
        return 1
    }
    
    func collectionView(_ collectionView: UICollectionView, numberOfItemsInSection section: Int) -> Int {
        return cards.count
    }
    
    func collectionView(_ collectionView: UICollectionView, cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
        let cell = collectionView.dequeueReusableCell(withReuseIdentifier: "CardCell", for: indexPath) as! CardCell
        cell.showCard(false, animted: false)
        
        guard let card = game.cardAtIndex(indexPath.item) else { return cell }
        cell.card = card
        
        return cell
    }
    
    func collectionView(_ collectionView: UICollectionView, didSelectItemAt indexPath: IndexPath) {
        let cell = collectionView.cellForItem(at: indexPath) as! CardCell
        
        if cell.shown { return }
        game.didSelectCard(cell.card)
        
        collectionView.deselectItem(at: indexPath, animated:true)
    }
}

ここで、重要なプロトコルについて少し説明しましょう。

プロトコル

プロトコルの操作は Swift プログラミングの中核です。 プロトコルは、クラス、構造体、または列挙のルールを定義する機能を提供します。 この原則により、モジュール化された拡張可能なコードを作成できます。 実際、これは GameController の collectionView に対してすでに実装されているパターンです。 では、独自のバージョンを作成してみましょう。 構文は次のようになります。

protocol MemoryGameProtocol {
    //protocol definition goes here
}

プロトコルを使用すると、クラスを実装するためのルールや命令を定義できることはわかっているので、それらがどうあるべきかを考えてみましょう。 合計XNUMXつ必要です。

• ゲーム開始:memoryGameDidStart。
• カードを裏返す必要があります:memoryGameShowCards。
• カードを裏返す必要があります:memoryGameHideCards。
• ゲーム終了:memoryGameDidEnd。

XNUMX つのメソッドはすべて、メイン クラスである GameController に実装できます。

メモリゲームを開始しました

このメソッドが実行されると、ゲームが開始されます (ユーザーが PLAY を押します)。 ここでは、 collectionView.reloadData() を呼び出してコンテンツを再ロードするだけで、カードがシャッフルされます。

func memoryGameDidStart(_ game: MemoryGame) {
    collectionView.reloadData()
}

メモリゲームショーカード

このメソッドは collectionSDViewSelectItemAt から呼び出します。 まず選択したカードが表示されます。 次に、cardsShown 配列内に一致しないカードがあるかどうかを確認します (cardShown の数が奇数の場合)。 存在する場合は、選択したカードと比較されます。 写真が同じ場合、両方のカードがカード表示に追加され、表向きのままになります。 異なる場合、カードは表示されたカードを残し、両方とも裏向きになります。

メモリゲーム非表示カード

カードが一致しない場合、このメソッドが呼び出され、カードの画像が非表示になります。

表示 = false。

メモリゲーム終了

このメソッドが呼び出されると、すべてのカードがすでに公開され、cardsShown リスト (cardsShown.count =cards.count) に含まれていることを意味するため、ゲームは終了します。 このメソッドは、特に endGame() を呼び出して isPlaying 変数を false に設定した後に呼び出され、その後ゲーム終了メッセージが表示されます。 また、alertController はコントローラーのインジケーターとして使用されます。 viewDidDischaracter が呼び出され、ゲームがリセットされます。

GameController では次のようになります。

extension GameController: MemoryGameProtocol {
    func memoryGameDidStart(_ game: MemoryGame) {
        collectionView.reloadData()
    }
 
 
    func memoryGame(_ game: MemoryGame, showCards cards: [Card]) {
        for card in cards {
            guard let index = game.indexForCard(card)
                else { continue
            }        
            
            let cell = collectionView.cellForItem(
                at: IndexPath(item: index, section:0)
            ) as! CardCell
 
            cell.showCard(true, animted: true)
        }
    }
 
    func memoryGame(_ game: MemoryGame, hideCards cards: [Card]) {
        for card in cards {
            guard let index = game.indexForCard(card)
                else { continue
            }
            
            let cell = collectionView.cellForItem(
                at: IndexPath(item: index, section:0)
            ) as! CardCell
    
            cell.showCard(false, animted: true)
        }
    }
 
    func memoryGameDidEnd(_ game: MemoryGame) {
        let alertController = UIAlertController(
            title: defaultAlertTitle,
            message: defaultAlertMessage,
            preferredStyle: .alert
        )
 
        let cancelAction = UIAlertAction(
            title: "Nah", style: .cancel) {
            [weak self] (action) in
            self?.collectionView.isHidden = true
        }
 
        let playAgainAction = UIAlertAction(
            title: "Dale!", style: .default) {
            [weak self] (action) in
            self?.collectionView.isHidden = true
 
            self?.resetGame()
        }
 
        alertController.addAction(cancelAction)
        alertController.addAction(playAgainAction)
        
        self.present(alertController, animated: true) { }
    
        resetGame()
    }
}

実はそれだけです。 このプロジェクトを使用して、独自のバージョンのゲームを作成できます。

コーディングを楽しんでください!

スキルボックスは次のことを推奨します。

• 実践コース 「モバイルデベロッパーPRO」.
• オンラインコースの申し込み 「Pythonデータアナリスト」.
• XNUMX年間の実践コース 「私はプロのウェブ開発者です」.

出所： habr.com