How to make different drawed views out of one UIView Class? - ios

Question

im making a iOS app/game that is like the game "Set".
for that I need to make multiple views so I made this class:
class CardSubview: UIView {
private let partsOfSpace:CGFloat = 12
private let occurenceOfForms: CGFloat = 3
private let color1:UIColor = someColor1
private let color2:UIColor = someColor2
private let color3:UIColor = somecolor3
private let attributeIdentifiers = [1,2,3]
private var openCardUp = false
public var isSelceted = false {
didSet {
if isSelceted == true {
self.backgroundColor = #colorLiteral(red: 0.5791940689, green: 0.1280144453, blue: 0.5726861358, alpha: 0.52734375)
self.layer.borderWidth = 5.0
self.layer.borderColor = #colorLiteral(red: 0.7450980544, green: 0.1568627506, blue: 0.07450980693, alpha: 1)
}
else {
self.backgroundColor = #colorLiteral(red: 0, green: 0, blue: 0, alpha: 1)
self.layer.cornerRadius = 0
self.layer.borderWidth = 0
}
}
}
public func makePath() {
openCardUp = true
let path = coloreAndFill(path: self.occurenceOfForm(form: **index1**, occurence: **index2**, viewWidth: self.bounds.width, viewHeigth: self.bounds.height), chosenColor:**index3**, fillIdentifier: **index4**)
path.stroke()
}
override func draw(_ rect: CGRect) {
if openCardUp == true {
makePath()
}
}
....
so all you need to know that this makes an View with an rectangle or triangle or circle etc etc...
now I want to put 80 different of them into the CardBoardView
this is my CardBoardView
import UIKit
#IBDesignable
class CardBoardView: UIView {
static var index1 = 1
static var index2 = 1
static var index3 = 1
static var index4 = 3
public var cells = 12
let values = Values()
var card: CardSubview = CardSubview() {
didSet {
let tabRecognizer = UITapGestureRecognizer(target: self, action: #selector(tab))
card.addGestureRecognizer(tabRecognizer)
}
}
struct Values {
public let ratio:CGFloat = 2.0
public let insetByX:CGFloat = 3.0
public let insetByY:CGFloat = 3.0
public let allAvailableCards = 81
}
#objc private func tab (recognizer: UITapGestureRecognizer) {
switch recognizer.state {
case .ended:
card.isSelceted = !card.isSelceted
default: break
}
}
override func layoutSubviews() {
super.layoutSubviews()
var grid = Grid(layout: .aspectRatio(values.ratio), frame: self.bounds)
grid.cellCount = 12
for index in 0..<12 {
card = CardSubview(frame: grid[index]!.insetBy(dx: values.insetByX, dy: values.insetByY))
card.makePath()
addSubview(card)
}
}
}
so if I change one of the static indexes the drawing in the CardSubview will change.
thats my idea but it doesn't work because every time I change the index every card will get changed and draws the new form not only one.
how would you do that can anybody give me some thoughts to my code and some tipps?

Answer 1

There's no need for your card property in CardBoardView. You are creating a whole set of CardSubview instances so it makes no sense to have a property that only stores the last one.
You need to make several changes to your code.
Completely remove your card property and its didSet block.
Put the creation of the tap gesture in the loop that creates each CardSubview instance.
Use a local variable in the loop.
Update the tab method to get the card view from the gesture recognizer.
Here's the updated code:
class CardBoardView: UIView {
static var index1 = 1
static var index2 = 1
static var index3 = 1
static var index4 = 3
public var cells = 12
let values = Values()
struct Values {
public let ratio:CGFloat = 2.0
public let insetByX:CGFloat = 3.0
public let insetByY:CGFloat = 3.0
public let allAvailableCards = 81
}
#objc private func tab (recognizer: UITapGestureRecognizer) {
if recognizer.state == .ended {
if let card = recognizer.view as? CardBoardView {
card.isSelected = !card.isSelected
}
}
}
override func layoutSubviews() {
super.layoutSubviews()
var grid = Grid(layout: .aspectRatio(values.ratio), frame: self.bounds)
grid.cellCount = 12
for index in 0..<12 {
let card = CardSubview(frame: grid[index]!.insetBy(dx: values.insetByX, dy: values.insetByY))
let tapRecognizer = UITapGestureRecognizer(target: self, action: #selector(tab))
card.addGestureRecognizer(tapRecognizer)
card.makePath()
addSubview(card)
}
}
}
It's possible that you may need to access each of the CardBoardView instances through some other code you haven't posted. So you may need a property to store all of the cards.
var cards = [CardBoardView]()
Then in the loop that creates each card, add:
cards.append(card)