[#8] chipViewController 생성

[jysuhr]

📌 Summary

• chip 상태에 따른 색상 변경 (enable / disable)
• chip isSelected에 따른 색상 변경
• chip Size에 따라 height 값 차이 구현 (large / small)
• chip 에 작성되는 글자수 10자로 제한

✍️ Description

• 이슈 티켓 : [feat] Component - chip #8
• 피그마 :
• 관련 문서 :

💡 PR Point

• chip size와 통일하여, chip의 상태를 지정할 때 변수의 이름을 state로 지정하고 싶었지만 UIControl에서 state를 사용중이어서 chipState로 지정하였습니다.
• icon 은 figma에서 icon을 PNG파일로 Export하여 사용했습니다.

📚 Reference

🔥 Test

사용방법

// enabled 상태(기본), Large(기본), isSelected X
let unTappedLargeChip: HandyChip = {
    let chip = HandyChip()
    chip.chipState = HandyChip.ChipState(type: .enabled)
    chip.size = HandyChip.ChipSize(type: .large)
    chip.isSelected = false
    chip.text = "Label"
    chip.leftIcon = UIImage(named: "icInfoCircle")
    chip.rightIcon = UIImage(named: "icClose")
    chip.addTarget(self, action: #selector(firstChip), for: .touchUpInside)
    chip.translatesAutoresizingMaskIntoConstraints = false
    return chip
}()

[kimsoomin20221789]

첫 이슈! 수고하셨습니다!

[hye0njuoo]

수고하셨습니다.
몇가지 추가되어야 할부분이 있는 것 같아요

• icon 추가
• 좌우 icon on/off 기능 추가

[lygon55555]

@Invalidating을 사용한 이유가 궁금합니다!

[jysuhr]

@Invalidating을 통해 HandyChip의 text와 leftIcon, rightIcon 프로퍼티를 선언함으로서 HandyChip에서 해당 프로퍼티를 지정했을 때 HandyChip 레이아웃을 다시 그리도록 하기 위해 사용했습니다. 프로퍼티 값이 변경되었을 때 setNeedsLayout()을 직접 호출하지 않아도 되어서 코드를 간결화할 수 있었습니다.

[wjdalswl]

Suggested change

	override func setViewHierarchies() {
	view.addSubview(unTappedLargeChip)
	view.addSubview(unTappedSmallChip)
	view.addSubview(tappedLargeChip)
	view.addSubview(tappedSmallChip)
	view.addSubview(disabledLargeChip)
	view.addSubview(disabledSmallChip)
	}
	override func setViewHierarchies() {
	[unTappedLargeChip,
	unTappedSmallChip,
	tappedLargeChip,
	tappedSmallChip,
	disabledLargeChip,
	disabledSmallChip
	].forEach {
	view.addSubview($0)
	}
	}

view.addSubviews(unTappedLargeChip, unTappedSmallChip, tappedLargeChip, tappedSmallChip, disabledLargeChip, disabledSmallChip) 이런식으로도 사용하실 수 있어요~