[ App ] 전광판 앱 만들기

내가 아무 설명없이 완성물(.jpg)만 보고 만든 앱과 선생님이 만든 앱은 어떤 차이가 있었을까?

- 선생님의 액션 정리

1. UI그리기 (*Label 및 btn 추가 시, 위치를 드래그한게 아니라 AutoLayout을 활용)
2. EditViewController에 IBoutlet + Action 연결 [*방식이 다름.아래서술 ]
3. 버튼클릭 시, 버튼 색 알파값 변경
4. 프로토콜 추가 및 델리게이트 생성
5. '색상'버튼눌렀을 때, 각자(textColor,backColor)의 값이 프로토콜에 정의된 메서드에 저장되도록 한다.
6. '저장'버튼을 눌렀을 때, 델리게이트를 불러와 텍스트,텍스트컬러,백컬러의 색상을 넘겨준다. + 내비.팝뷰 사용해서 앞으로 넘기기
7. Viewcon에서 prepare함수 불러오고 EditViewcon과 연결 + EditViewcon에서 사용한 델리게이트 실행되도록 함. + Viewcon에 프로토콜 추가
8. Viewcon에서 changedSetting함수 불러오고 텍스트,텍스트색상,백컬러 색상 표기되도록 함.
9. 함수 만들어서 텍스트, 텍스트컬러, 백컬러의 색상을 prepare에서 정의되도록하고 Viewdidload에 함수를 추가해서 실행시킨다.

- 나의 액션 정리

1. UI그리기 (*드래그 활용, AutoLayout 안씀 ㅋㅋ)
2. EditViewController에 IBoutlet + Action 연결 [*방식이 다름.아래서술 ]
3. 새로운 swift파일을 만들어 텍스트,텍스트컬러,백컬러 타입프로퍼티를 포함하는 구조체를 만들어준다.
4. '색상'버튼눌렀을 때, swift파일의 타입프로퍼티가 변환되어 저장되도록 만든다.(색상)
5. '저장'버튼눌렀을 때, swfit파일의 타입프로퍼티가 변환되어 저장되도록 만든다.(텍스트) + 내비.팝뷰 사용해서 앞으로 넘기기
6. ViewwillAppear 함수 불러오고 텍스트, 텍스트색상, 백컬러는 swift 파일의 구조체의 타입프로퍼티 값으로 준비하도록 만든다.

차이

기능 :

1. UI그리기

일단, 내가 만든 앱에서는 그냥 드래그해서 배치했기 때문에 기종마다 위치가 모두 제각각..
하지만, 선생님코드에서는 stackView를 만들고 Add New Constraints로 위치를 결정해줬다. (라벨+컬러 스택뷰 1개 , 컬러 스택뷰 1개)

2. IBOutlet, Action함수 연결 방식

선생님 코드

Outlet부 : 텍스트필드, 색상 각각 1개 x 6개

class EditViewController: UIViewController {
    
    @IBOutlet weak var textField: UITextField!
    
    @IBOutlet weak var btnYellowStyle: UIButton!
    @IBOutlet weak var btnPurpleStyle: UIButton!
    @IBOutlet weak var btnGreenStyle: UIButton!
    
    @IBOutlet weak var btnBlackStyle: UIButton!
    @IBOutlet weak var btnBlueStyle: UIButton!
    @IBOutlet weak var btnOrangeStyle: UIButton!

Action함수 : tapTextColorbtn에 3개색상, tapBackgroundColorBtn에 3개색상을 줬음.

  @IBAction func tapTextColorBtn(_ sender: UIButton) {
       if sender == btnYellowStyle {
          changeTextColor(color: .yellow)
          textColor = .yellow
      }else if sender == btnPurpleStyle {
         changeTextColor(color: .purple)
         textColor = .purple
      }else {
         changeTextColor(color: .green)
         textColor = .green
      }

  @IBAction func tapBackgroundColorBtn(_ sender: UIButton) {
       if sender == btnBlackStyle {
          changeBackgroundColor(color: .black)
          backgroundColor = .black
      } else if sender == btnBlueStyle {
          changeBackgroundColor(color: .blue)
          backgroundColor = .blue
      }else{
          changeBackgroundColor(color: .orange)
          backgroundColor = .orange
        }
 }
  
  @IBAction func tapSaveBtn(_ sender: UIButton) {
        delegate?.changedSetting(
          text: textField.text!,
          textColor: textColor,
          backgroundColor: backgroundColor)
      navigationController?.popViewController(animated: true)
  
  }

색상의 선택을 sender에 어떤 값을 줬는가에 따라서 다르게 만들어줬다. 이런 경우는 처음봐서 신기함. 이렇게 만들어주면 코드가 훨씬 더 간결해서 보기좋을 것 같음!

나의코드

IBOutlet부 : 버튼 6개 + 텍스트필드 1개는 동일

class SettingViewController: UIViewController {

    
    @IBOutlet weak var btnYellowStyle: UIButton!
    @IBOutlet weak var btnPurpleStyle: UIButton!
    @IBOutlet weak var btnGreenStyle: UIButton!
    @IBOutlet weak var btnGrayStyle: UIButton!
    @IBOutlet weak var btnBlueStyle: UIButton!
    @IBOutlet weak var btnPinkStyle: UIButton!
    
    @IBOutlet weak var tfMessage: UITextField!

Action함수부 : 6개 각각의 버튼을 만들고 그것을 .swift 파일의 타입프로퍼티를 포함하는 구조체에 값이 저장되도록 만들었다.

    //MARK: 텍스트 색상 설정
    
    @IBAction func btnYellow(_ sender: UIButton) {
        Message.tColor = UIColor.yellow
    }
    @IBAction func btnPurple(_ sender: UIButton) {
        Message.tColor = UIColor.purple
    }
    @IBAction func btnGreen(_ sender: UIButton) {
        Message.tColor = UIColor.green
    }
    
    
    //MARK: 배경 색상 설정
    @IBAction func btnGray(_ sender: UIButton) {
        Message.bColor = UIColor.gray
    }
    @IBAction func btnBlue(_ sender: UIButton) {
        Message.bColor = UIColor.blue
    }
    @IBAction func btnPink(_ sender: UIButton) {
        Message.bColor = UIColor.systemPink

    }
    
    
    @IBAction func btnLoad(_ sender: UIButton) {
    
        Message.textMessage = tfMessage.text!
        navigationController?.popViewController(animated: true)
        
    }