[iOS/UIKit] 테이블 뷰 셀에서 속성이 유지되지 않는 버그 해결 2 - Delegate 사용

테이블 뷰를 구성할 때 셀 안에 UI나 속성들이 내가 설정한 대로 저장되지 않고 제멋대로 움직이는 경우가 있다 

 

원인 

테이블 뷰를 구성하면서 사용하는 dequeueReusableCell(withIdentifier:for:) 메서드는 셀을 재사용 한다!!!

셀을 재사용 하게되면 메모리는 딱 화면에 보이는 만큼의 셀만을 갖고있게 되는데,

그런 셀들이 재사용 되면서 안에 내용들이 중첩되는 것 

 

해결 방법

나는 두가지 방법으로 해결을 해보았는데 

1) prepareForReuse()를 사용하여 셀을 초기화 -> MVC 패턴을 이용해 값을 저장 [블로그]

2) custom delegate를 이용해서 값이 변화하는 것을 ViewController에게 전달 -> MVC 패턴을 이용해 값을 저장 

 

그 중에서도 이 포스팅에서는 첫번째 방법을 정리하고자한다.

 

✔️ 데이터를 구성하는 구조체 (Model)를 사용한다 

struct Setting{
  	let name: String 
	var onOff: Bool
}

 

✔️ (주석으로 설명 써둠..) 

- 셀에서 Delegate와 인덱스 변수를 선언 

- 셀에서 스위치가 작동될 때 그 값과 인덱스를 Delegate(대리자)의 구현부 메서드에 넘겨준다 (여기서 대리자는 ViewController)

- ViewController에서 전달 받은 스위치 여부를 저장한다 (위에서 만들어둔 구조체 모델에)

//MainTableViewCell.swift 
protocol SwitchOffDelegate {
	//스위치를 전환할 때 호출할 함수를 정의한다.
	func switchChange(index: Int, switchIs: Bool)
}

class MainTableViewCell: UITableViewCell {
	//delegate 정의
    var switchOffDelegate: SwitchOffDelegate?
    var Index: Int = 0
    @IBOutlet weak var switchBtn: UISwitch!
    
	// ... 생략 
    
    //셀 내용 채워넣음 (전달받은 data로)
    public func get(data: Setting) {
        cellTitleLabel.text = data.name
        switchBtn.isOn = data.onOff
    }
    
    @IBAction func switchChanged(_ sender: UISwitch) {
    	if self.switchBtn.isOn {
        	//나의 delegate(대리자)에게 이 일을 대신해주라고 알린다!!!!(값을 바꿀 것)
        	self.switchOffDelegate.switchChange(index: Index, switchIs: true)
       	}else{
        	sself.switchOffDelegate.switchChange(index: Index, switchIs: false)
        }
    }
}


//ViewController.swift
//Delegate를 위임 -> 이건 내가(ViewController) 대신할거임!!
Class ViewController: SwitchOffDelegate {

	//싱글톤 패턴 
	private var service: SettingService = SettingService.shared
    
	// ... 생략
    
    //정의되어있던 Delegate(protocol에서 정의한 함수)의 구현부 -> 이 내용대로 실행된다 
    func switchChange(index: Int, switchIs: Bool){
    	//싱글톤 패턴을 이용하여 Model(Setting 구조체)의 값을 바꾼다
    	service.settingList[index].onOff = switchIs
    }
    
    //테이블 뷰 셀 구성하는 부분 tableView(_:cellForRowAt:) 
    cell.Index = indexPath.row
    cell.switchOffDelegate = self
    cell.get(data: cellData)
    
    
}

 

끝!!

 

📱 시연 영상

https://drive.google.com/file/d/1Pt4vPHjjgXKhs8ZqY7-BAUM9EcrlOTsp/view?usp=sharing

셀 재사용 오류.mov

 

💡 비고

• 싱글톤 패턴 -> 세팅 내용 공유 

🔗 깃허브

https://github.com/yujeong-kwon/RisingCamp/tree/main/RC_week3-2

 

왕왕 초보때의 공부 내용이라 허술할 수 있습니다..! !

양해 부탁드리며 부족한 부분에 대한 설명을 남겨주신다면 정말 감사링..