팀 프로젝트 시작!

부트캠프가 시작되고, 처음으로 개인과제가 아닌 팀 프로젝트를 접하게 되었다!

주제는 "커피 주문 키오스크"를 만드는 것이다!!!

해당 프로젝트도 필수 구현 기능과 선택 구현 기능으로 구분되어 있으며, 혼자서 프로젝트를 빌드하는 것이 아닌 파트를 나누어 팀원과 함께 설계하는 프로젝트이기에 매우 기대된다! 🙉

---

프로젝트 요구 사항

필수 구현 기능

• 메인 페이지
• 상단 메뉴 카테고리 바
  • UIStackView , UICollectionView 등을 활용
• 메뉴 화면
  • UICollectionView 등을 활용
• 주문 내역 화면
  • UITableView 등을 활용하여 화면을 구성
• 취소하기 / 결제하기 버튼 화면

선택 구현 기능

• 부가 기능 추가
  • ex. 돋보기 와 같은 부가적인 기능 구현
  • ex. 오늘의 제일 잘 팔린 메뉴 보기
  • ex. 직원호출 → alert창 띄우기
• 다크 모드 구현
• 페이징 기능

아직 시작도 안했는데... 머리가 아파온다...... 🙈

---

시작하자 말자 🐶같이 멸망...

우선 필수 구현 기능부터 설계를 하기 위해, App의 UI를 그려야 했다.

이전에 졸업작품을 마치고 우연히 Figma를 접할 수 있는 기회가 있어서, 이를 통해 UI를 디자인해 보았다.

이후, 이를 토대로 Xcode의 StoryBoard에 UI를 그렸다!

이때까지만 해도 순조로웠다...

지난 과제를 하며 UITableView는 어느정도 적응이 되었지만, UICollection은 처음 접하다 보니 기능 구현에 어려움이 있었다.

한참동안 찾아보니 UITableView와 유사한 듯 하였지만, 쉽게 구현하지 못하였다...

import UIKit

class ViewController: UIViewController {
    @IBOutlet weak var CoffeListCollection: UICollectionView!
    @IBOutlet weak var CoffeeListSelector: UISegmentedControl!
    
    
    let coffeeDataSet = [
        "아메리카노": "2500",
        "카페라떼": "4000",
        "에스프레소": "2000"
    ]
    
    let teaDataSet = [
        "케모마일티": "4000",
        "아이스티": "3500",
        "레몬티": "4000",
        "그린티": "3500"
    ]
    
    let cakeDataSet = [
        "블루베리치즈케익": "6000",
        "바스크 치즈케익": "5500",
        "당근 케익": "6500"
    ]
    
    var currentDataSet: [String: String] = [:]
    
    
    override func viewDidLoad() {
        super.viewDidLoad()
        
        CoffeeListSelector.addTarget(self, action: #selector(segmentedControlValueChanged(_:)), for: .valueChanged)
        
        CoffeListCollection.isHidden = false
        
        currentDataSet = coffeeDataSet
    }
    
    
    @objc func segmentedControlValueChanged(_ sender: UISegmentedControl) {
        switch sender.selectedSegmentIndex {
        case 0:
            currentDataSet = coffeeDataSet
        case 1:
            currentDataSet = teaDataSet
        case 2:
            currentDataSet = cakeDataSet
        default:
            break
        }
        CoffeListCollection.reloadData()
    }
}

그래서 UISegmentedControl만 일단 적용시켜 보았다.

해당 선택 요소는 StoryBoard에서 설정하였으며, 선택된 값이 0 ~ 2인지를 입력받아 currentDataSet라는 Dictionary 타입의 빈 배열에 알맞는 DataSet으로 초기화시킨다.

이때, DataSet은 총 3 종류이며 coffeeDataSet, teaDataSet, cakeDataSet으로 상품 정보와 가격을 포함하고 있다.

UICollectionView만 해결되면, 각 Cell에 이미지를 넣어보는 작업을 진행할 예정이다!

---

일단 마무리하며...

오늘 하루 실질적인 성과가 없다해도 UICollectionView을 어떤 방식으로 구현하고, 프로젝트를 전반적으로 어떻게 설계하면 되겠다는 청사진이 머리속에서 그려졌다!!

그나마 다행일지도..

가능하면 오늘 중으로 UICollectionView을 마무리하고, UITableView를 추가하고 싶다. 😅