UIImageViewを識別する方法

Question

実現したいこと

SwiftでStoriyBoardを使わずに神経衰弱のようなアプリを作成しています。

発生している問題

UIImageを25個Viewに表示させ、それぞれにタグを設定しました。
gestureTapメソッドというのを作り、UIImageをタップしたときに１回目タップした時のタグを変数num01に代入し,
num01と２回目にタップしたUIImageViewのタグの合計が25になったときに、カードが揃った時の判定にしようと思っているんですが、
最後にタップしたUIImageしか処理することができません。
１回目にタップしたUIImageViewを識別して処理する方法がわかりません。

かいつまんで、無理やり書くと下のような処理がしたいです。

var vw: UIImageView! // UIImageViewインスタンス生成
num01 = 1　// 
vw.tag = num01　// タグを取得
vw.num01(tagのこと).image = nil // 取得したタグで判別してimageをnilにする

なにか、良い方法があればご教授願います。

該当のソースコード

import UIKit

class ViewController: UIViewController {
    
    // UIImageViewインスタンス作成
    var vw: UIImageView!
    // カード１枚目のタグを保持
    var num01 = 0
    // 1枚目の選択: true 2枚目: false
    var flg = true
    // タグを配列に格納
    var tgArray: [Int] = []
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        makeImage()
    }
    
    
    // カードの生成
    func makeImage() {
        
        let length = 65
        var tg: Int = 1
        
        // カードを25枚生成
        for y in 0...4 {
            
            let ay = 150 + (length * y)
            
            for x in 0...4 {
                
                let ax = 38 + (70 * x)

                // イメージビューの設定
                vw = UIImageView(frame: CGRect(x: ax, y: ay, width: length, height: length))
                vw.image = UIImage(named: "mum01_shadow")
                vw.tag = tg
                tgArray.append(tg)
                tg += 1
                view.addSubview(vw)
//                print(tg, vw.tag, tgArray)
                
                // タップジェスチャーの設定
                vw.isUserInteractionEnabled = true
                
                let ges = UITapGestureRecognizer(
                    target: self,
                    action: #selector(gestureTap(sender:)))
                vw.addGestureRecognizer(ges)

            }
            
        }
    }
    
    
    // カードをタップした時の処理
    @objc func gestureTap(sender: UITapGestureRecognizer) {
        // vwでnilをreturnしつつUIImageViewを取り出している
        guard let vw = sender.view as? UIImageView else { return }
        
        // 1枚目の選択
        if flg {
            num01 = vw.tag
            vw.image = UIImage(named: "mum01")
            flg = false
        } else {
            // ２枚目の選択
            print("なむ(num01), たぐ(vw.tag)", num01 + vw.tag)
            
            if num01 + vw.tag == 25 {
                // カードが揃った時の処理
                vw.image = UIImage(named: "mum01")
                                
                /*------------------------------------------
                 ここで１枚目に選択したUIImageViewをnilにしたい！
                ------------------------------------------ */

                vw.image = nil
                flg = true
            } else {
                // カードが揃わなかった時の処理
                vw.image = UIImage(named: "mum01_shadow")
                flg = true
            }
        }
        print(vw.tag)
    }
    
}

Comments

[popai306]

この質問に回答して直すよりcollection viewつかって書き直したほうが今後のためになると思います。。。

参考：
https://qiita.com/Queue0412/items/0984c8d1a757935f140f

[mum]

回答ありがとうございます。
Collection Viewというものがどういうものなのか知らないので、まず参考記事読んでみます。

[hameji]

確かにcollectionViewにしたら、やろうとしていることもっと楽に実現できますよ。

[mum]

回答ありがとうございます！
プログラミング学習中で、どういう風に動いているかを確認しながら作りたいと思っていまして。
そんなに便利な部品なんですねcollectionView。
ひと段落着いたら触ってみようと思います。

Answer 1

仕様は少し違うかもしれません。二番目のタップ周りのロジックをサンプルにてください。
基本的にマスターデーターを生成して、タップする時にこのデーターと比べて、結果によって分岐します。
一番目のタップをベットに管理する必要もありますね。

//
//  ViewController.swift
//  mindGame
//
//  Created by リヴォーフ　ユーリ on 2019/12/12.
//  Copyright © 2019 リヴォーフ　ユーリ. All rights reserved.
//

import UIKit

class ViewController: UIViewController {
    
    //マスターデーター
    var pairData: [Int] = []
    //カード配列
    var vws: [UIImageView] = []
    // UIImageViewインスタンス作成
    var vw: UIImageView!
    // カード１枚目のタグを保持
    var num01 = 0
    // 1枚目の選択: true 2枚目: false
    var flg = true
    //First tap value
    var firstTapValue: Int = 0
    //First tap tag
    var firstTapTag: Int? = nil
    
    //画像名
    var imageOne: String = "lomonosov"
    var imageTwo: String = "lovedeathrobots"

    // タグを配列に格納
    var tgArray: [Int] = []
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        makeImage()
        creataMasterData()
    }
    
    //マスターデーターを作成します
    func creataMasterData() {
        print(vws.count/2)
        while pairData.count < vws.count {
            let randomNum = Int.random(in: 1...(vws.count/2))
            let count = pairData.filter {$0 == randomNum}.count
            if count < 2 {
                pairData.append(randomNum)
            }
        }
        print(pairData.description)
    }
    
    // カードの生成
    func makeImage() {
        
        let length = 65
        var tg: Int = 0
        
        // カードを25枚生成
        for y in 0...5 {
            
            let ay = 150 + (length * y)
            
            for x in 0...3 {
                
                let ax = 38 + (70 * x)
                
                // イメージビューの設定
                vw = UIImageView(frame: CGRect(x: ax, y: ay, width: length, height: length))
                vw.image = UIImage(named: imageOne)
                vw.tag = tg
                tgArray.append(tg)
                tg += 1
                view.addSubview(vw)
                // タップジェスチャーの設定
                vw.isUserInteractionEnabled = true
                
                let ges = UITapGestureRecognizer(
                    target: self,
                    action: #selector(gestureTap(sender:)))
                vw.addGestureRecognizer(ges)
                vws.append(vw)
            }
            
        }
    }
    
    
    // カードをタップした時の処理
    @objc func gestureTap(sender: UITapGestureRecognizer) {
        // vwでnilをreturnしつつUIImageViewを取り出している
        guard let vw = sender.view as? UIImageView else { return }
        
        // 1枚目の選択
        if flg {
            vw.image = UIImage(named: imageTwo)
            flg = false
            firstTapValue = pairData[vw.tag]
            firstTapTag = vw.tag
        } else {
            // ２枚目の選択
            if pairData[vw.tag] == pairData[firstTapTag!] {
                // カードが揃った時の処理
                vw.image = UIImage(named: imageTwo)
                flg = true
            } else {
                // カードが揃わなかった時の処理
                vw.image = UIImage(named: imageOne)
                vws[firstTapTag!].image = UIImage(named: imageOne)
                firstTapTag = nil
                flg = true
            }
        }
    }
}

Comments

[mum]

ありがとうございます！
vanderlvovさんが書いてくれたコードを参考にいじってみます。
僕のコードにはUIImageView型の配列がないので、書いてみようと思います。

２枚目のタップの処理については、上のコードには書いていないんですが、カード25枚なので1〜25のタグ配列を用意しています。
それと別でimgの辞書型の配列も用意し、辞書のキーをカードのタグと合わせて使おうと思っています。

```
　　　　// タグの配列
var tgArray: [Int] =
[1, 2, 3, 4, 5, 6, 7, 8, 9, 10,
11, 12, 13, 14, 15, 16, 17, 18, 19,
20, 21, 22, 23, 24, 25]

// イメージの配列
let imgs = [1: "img1",2: "img2",3: "img3",4: "img4",5: "img5",
6: "img6",7: "img7",8: "img8",9: "img9",10: "img10",11: "img11",
12: "img12",13: "img12", 14: "img11", 15: "img10", 16: "img9",
17: "img8", 18: "img7", 19: "img6", 20: "img5", 21: "img4",
22: "img3", 23: "img2", 24: "img1", 25: "img13"]
```

タグ1とタグ24を同じ画像（img1） // tag1 + tag24 == 25
タグ2とタグ23を同じ画像(img2) // tag2 + tag23 == 25
タグ3とタグ22を同じ画像(img3) // tag3 + tag22 == 25
タグ4とタグ21を同じ画像(img4) // tag4 + tag21 == 25
タグ5とタグ20...
略....
タグ12とタグ13を同じ画像(img12) // tag12 + tag13 == 25
（タグ25だけあまるようにしていて、何かスペシャルカードにしようと思っています。）

なので、１枚目にタップしたタグと２枚目にタップしたタグの合計が25になったときにペアに
なるので、今は下のように書いています

```
// カードをタップした時の処理
@objc func gestureTap(sender: UITapGestureRecognizer) {
// vwでnilをreturnしつつUIImageViewを取り出している
guard let vw01 = sender.view as? UIImageView else { return }

// 1枚目の選択
if flg {

num01 = vw01.tag
vw01.image = UIImage(named: imgs[num01]!)
flg = false
} else {
// ２枚目の選択
if num01 + vw01.tag == 25 {
// カードが揃った時の処理
vw01.image = UIImage(named: imgs[vw01.tag]!)
vw01.removeFromSuperview()
flg = true
} else {
// カードが揃わなかった時の処理
vw01.image = UIImage(named: "mum01_shadow")
flg = true
}

```

わかりにくかったら申し訳ないですが、こんな感じです。

[vanderlvov]

1回目のタップをどうやって保管できるの部分だけで参考になったらOKです。
事例のゲームのルールは全然違うけど、アプローチは似ています。