Писање игре меморијских картица у Свифт-у

Овај чланак описује процес креирања једноставне игре за обуку памћења која ми се заиста свиђа. Осим што је добар сам по себи, научићете нешто више о Свифт класама и протоколима док будете пролазили. Али пре него што почнемо, хајде да разумемо саму игру.

Подсећамо: за све читаоце „Хабра“ – попуст од 10 рубаља при упису на било који курс Скиллбок користећи промотивни код „Хабр“.

Скиллбок препоручује: Образовни онлајн курс „Професија Јава програмер“.

Како играти меморијску картицу

Игра почиње демонстрацијом сета карата. Леже лицем надоле (односно, слика надоле). Када кликнете на било коју, слика се отвара на неколико секунди.

Задатак играча је да пронађе све карте са истим сликама. Ако након отварања прве картице окренете другу и слике се поклопе, обе картице остају отворене. Ако се не поклапају, карте се поново затварају. Циљ је да се све отвори.

Структура пројекта

Да бисте направили једноставну верзију ове игре, потребне су вам следеће компоненте:

• Један контролер: ГамеЦонтроллер.свифт.
• Један поглед: ЦардЦелл.свифт.
• Два модела: МемориГаме.свифт и Цард.свифт.
• Маин.сторибоард како би се осигурало да је цео скуп компоненти доступан.

Почињемо са најједноставнијом компонентом игре, картама.

Цард.свифт

Модел картице ће имати три својства: ид за идентификацију сваке од њих, приказану логичку променљиву која одређује статус картице (скривена или отворена) и УРЛ за слике на картицама.

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

Такође ће вам требати ове методе за контролу интеракције корисника са мапама:

Метода за приказивање слике на картици. Овде смо ресетовали сва својства на подразумевана. За ид, генеришемо насумични ИД позивањем НСУУИС().ууидСтринг.

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)    
}
 
init(card: Card) {        
    self.id = card.id        
    self.shown = card.shown        
    self.artworkURL = card.artworkURL    
}

И још један метод је потребан за мешање карата на почетку. Направићемо га проширењем класе Арраи.

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

А ево имплементације кода за модел картице са свим својствима и методама.

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*4. Модел ће имати својства као што су картице (низ карата на мрежи), низ цардсСховн са већ отвореним картицама и логичка променљива исПлаиинг за праћење статуса игре.

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    
}

Метода за креирање нове игре. Овде позивамо први метод да покренемо почетни распоред и иницијализујемо исПлаиинг променљиву на труе.

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

Ако желимо да поново покренемо игру, затим постављамо променљиву исПлаиинг на фалсе и уклањамо почетни изглед картица.

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
}

Овај метод чита последњи елемент у низу **цардсСховн** и враћа картицу која се не подудара.

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()        
    }    
}

Маин.сторибоард и ГамеЦонтроллер.свифт

Маин.сторибоард изгледа отприлике овако:

У почетку, морате да подесите нову игру као виевДидЛоад у контролеру, укључујући слике за мрежу. У игри, све ово ће бити представљено 4*4 цоллецтионВиев. Ако још нисте упознати са цоллецтионВиев-ом, ево га можете добити информације које су вам потребне.

Конфигурисаћемо ГамеЦонтроллер као роот контролер апликације. ГамеЦонтроллер ће имати цоллецтионВиев који ћемо референцирати као ИБОутлет. Друга референца је на дугме ИБАцтион онСтартГаме(), ово је УИБуттон, можете га видети у сториборду под називом ПЛАИ.

Мало о имплементацији контролера:

• Прво, иницијализујемо два главна објекта - мрежу: игра = МемориГаме() и скуп картица: картице = [Картица]().
• Почетне променљиве постављамо као виевДидЛоад, ово је први метод који се позива док игра ради.
• цоллецтионВиев је подешен на скривен јер су све картице скривене док корисник не притисне ПЛАИ.
• Чим притиснемо ПЛАИ, почиње онСтартГаме ИБАцтион одељак, а својство цоллецтионВиев исХидден постављамо на фалсе тако да картице могу да постану видљиве.
• Сваки пут када корисник изабере картицу, позива се метод дидСелецтИтемАт. У методи коју зовемо дидСелецтЦард да имплементирамо главну логику игре.

Ево коначне имплементације ГамеЦонтроллер-а:

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)
    }
}

Хајде сада да причамо мало о важним протоколима.

Протоколи

Рад са протоколима је срж Свифт програмирања. Протоколи пружају могућност дефинисања правила за класу, структуру или набрајање. Овај принцип вам омогућава да пишете модуларни и прошириви код. У ствари, ово је образац који већ примењујемо за цоллецтионВиев у ГамеЦонтроллер-у. Хајде сада да направимо сопствену верзију. Синтакса ће изгледати овако:

protocol MemoryGameProtocol {
    //protocol definition goes here
}

Знамо да нам протокол омогућава да дефинишемо правила или упутства за имплементацију класе, па хајде да размислимо шта би требало да буду. Укупно вам треба четири.

• Почетак игре: мемориГамеДидСтарт.
• Морате да окренете картицу лицем надоле: мемориГамеСховЦардс.
• Морате да окренете картицу лицем надоле: мемориГамеХидеЦардс.
• Крај игре: мемориГамеДидЕнд.

Све четири методе се могу имплементирати за главну класу, а то је ГамеЦонтроллер.

мемориГамеДидСтарт

Када се овај метод покрене, игра треба да почне (корисник притисне ПЛАИ). Овде ћемо једноставно поново учитати садржај позивањем цоллецтионВиев.релоадДата(), који ће измешати карте.

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

мемориГамеСховЦардс

Овај метод позивамо из колекцијеСДВиевСелецтИтемАт. Прво приказује изабрану картицу. Затим проверава да ли постоји неупарена картица у низу цардсСховн (ако је број цардсСховн непаран). Ако постоји, изабрана картица се пореди са њом. Ако су слике исте, обе картице се додају на картице приказане и остају окренуте нагоре. Ако је другачије, картица оставља приказане картице и обе су окренуте лицем надоле.

мемориГамеХидеЦардс

Ако се картице не поклапају, позива се овај метод и слике картица су скривене.

приказано = нетачно.

мемориГамеДидЕнд

Када се позове овај метод, то значи да су све карте већ откривене и да се налазе на листи цардсСховн: цардсСховн.цоунт = цардс.цоунт, тако да је игра завршена. Метод се посебно позива након што смо позвали ендГаме() да поставимо исПлаиинг вар на фалсе, након чега се приказује порука о завршетку игре. Такође алертЦонтроллер се користи као индикатор за контролер. виевДидДисаппеар се позива и игра се ресетује.

Ево како све то изгледа у ГамеЦонтроллер-у:

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()
    }
}

У ствари, то је све. Можете користити овај пројекат да креирате сопствену верзију игре.

Срећно кодирање!

Скиллбок препоручује:

• Практични курс „Програмер за мобилне уређаје“.
• Примењени онлајн курс „Питхон аналитичар података“.
• Двогодишњи практични курс „Ја сам ПРО веб програмер“.

Извор: ввв.хабр.цом