[iOS 앱 개발] FirstApp (3) - Swift 5 백그라운드 색상 적용 / set Background Color
안녕하세요. 개발하는 정주입니다.
오늘은 FirstApp 세 번째 이야기, 백그라운드 색상 적용에 대해 포스팅하려고 합니다.
입력한 색상 코드로 메인 이미지의 테두리 색깔을 변경하는 작업입니다.
쉬울 줄 알았지만 낯선 작업 환경에 당황한 스토리가 기다리고 있습니다.
맨 아래 오늘 작업한 내용의 완성 영상이 있으니 끝까지 봐주세요!
바로 시작합니다.
프로젝트 Git 링크
https://github.com/jeongju9216/firstApp
Outlet 선언하기
스토리보드의 뷰들을 코드에 옮겨야 합니다.
스토리보드에서 코드 창을 엽니다.
단축키는 control + option + command + enter입니다.
화면 버튼에서 여는 것은 아래 과정을 따라와 주세요.
우측 상단에 중앙 리스트 같은 모양의 버튼을 눌러줍니다.
그럼 이와 같은 팝업이 나옵니다.
여기에서 Assistant를 누르면 코드 창이 나옵니다.
그다음 control을 누르고 뷰를 코드 창으로 드래그하면 Outlet 추가가 됩니다.
뷰 이름을 정해주고 Storage는 Strong으로 해줍니다.
Strong과 Weak는 차차 알아가야 합니다.
Done Button 이벤트 추가
Outlet을 추가할 때 살펴보아야 하는 점은 UIButton과 UIImageView, UILabel은 추가 방식이 다르다는 것입니다.
UIButton은 Outlet으로 추가할 수도 있지만 바로 Action을 추가할 수 있습니다.
Type은 Any와 UIButton을 선택할 수 있는데 저는 UIButton으로 설정하겠습니다.
@IBAction func btnDone(_ sender: UIButton) {
}
버튼을 누를 때 발생하는 이벤트를 함수 안에 작성하면 됩니다.
저는 버튼을 누르면 색상 코드를 UILabel에 보여주고 메인 이미지의 테두리 색상을 변경해줄 것입니다.
@IBAction func btnDone(_ sender: UIButton) {
lbColor.text = "It's #" + tfColor.text!
changeBorderColor(tfColor.text!)
}
func changeBorderColor(_ colorString: String) {
borderView.backgroundColor = UIColor(hexString: "#" + colorString)
}
아직 추가할 작업이 많지만 기초 기능은 이 코드가 전부입니다.
다만, String을 UIColor로 바꾸기 위해서는 UIColor로 바꾸기 위해서는 UIColor를 상속하여 코드를 작성해야 합니다.
해당 코드는 따로 포스팅화 하겠습니다.
앱 시작 시 테두리 색깔 설정하기
앱을 시작할 때 테두리 색깔을 설정하겠습니다.
override func viewDidLoad() {
super.viewDidLoad()
// Do any additional setup after loading the view.
changeBorderColor("000000")
}
Swift 5에서 기본으로 생성되는 코드입니다.
// Do any additional setup after loading the view.
위 주석까지 모두 기본으로 생성되니 저 같은 초보자들도 한 번에 여기에서 작업하면 되겠구나라는 것을 알 수 있습니다.
일단은 테두리 색을 검은색으로 설정하기 위해 "000000"으로 설정하였습니다.
추후 종료하기 직전의 색상을 보여줄 예정입니다.
오늘 작업 영상
오늘까지 작업한 앱을 실행한 영상입니다.
마무리 잡담
iOS의 첫 번째 앱이라 여기까지 오는데도 많은 에러를 보았습니다.
더 열심히 해야할 듯합니다.
아자아자!
감사합니다!
아직은 초보 개발자입니다.
더 효율적인 코드 훈수 환영합니다!
공감과 댓글 부탁드립니다.