UI Component를 공부하며 궁금증 정리 (part 1)

7과11사이·2023년 8월 1일
2

스파르타코딩클럽

목록 보기
18/90
post-thumbnail

이제 코드를 넘어 Xcode로 어플을 구현할 때 사용하는 UI Components에 대해서 공부를 하고 있다.
그저 구글링해서 복붙하던 느낌과 달리 더 세세하게 배우고 있는 기분이라 좋다!

하지만 그만큼 궁금한 점들이 많이 생기고 있길래
머리 속에서 없어지기 전에 적어 내려가고 하나씩 해결해보고자 한다.

궁금증

1. IBAction && IBOutlet의 차이

  • Interface Builder Action과 Outlet의 가장 큰 차이점은 행동이 있는지, 속성을 부여할 수 있는지로 구분 될 것 같다. 대부분 IBOutlet은 있지만, Action은 별도로 연결해주어야 하는데, Outlet은 말그대로 보여지는 것에 대한 연결점이다.

    IBOutlet은 StoryBoard Layout에 UI Component를 연결하고,
    해당 Component의 속성을 바꿀 수 있도록 접근을 할 수 있다.


    반면, IBAction은 특정 코드를 실행할 수 있도록 (triggering code) 행동을 지정한다. [링크]

2. Button은 왜 touchUpInside인가?

  • 예전부터 있던 궁금증인데, button을 왜 touchUPInside인건지 모르겠다.
    엄밀히 말하면 사용자가 버튼을 누르는 거니까 touchDownInside가 아닌가..?

    단순하게 생각하면 그렇게 보일 수 있지만, 우리가 만드는 어플의 환경을 생각해보자. 모바일에서는 pressed와 touch의 차이점이 존재한다.

    touchDownInside는 말그대로 pressed를 의미하는데, 버튼처럼 한번 눌렀다가 손을 놓는 행동을 의미하지 않는다. 따라서 touchUpInside가 버튼을 눌렀다 때는 행동을 의미한다.
    [링크]

3. #selector의 역할

  • IBAction func 역할 대신 간간히 @objc func를 활용해서 버튼에 행동을 부여했다. IBAction이 생성되지 않거나 불가능했던 시점이 종종 있었는데, 자세히는 기억이 나지 않는다. 하지만, 항상 .addTarget을 할 때 #selector 라는 표현을 사용했는데, 이게 무엇을 의미하는지 궁금하다. objective c 언어로 생성된 함수를 호출할 때 지정하는 키워드일까?

    selector은 objective-c 언어의 메서드를 가르키는 타입이라고 한다. #selector 키워드를 통해 Selector 구조체를 만든다고 하는데, 우리가 알고 있는 것과 달리 Objective-c는 객체를 별도의 클래스 생성없이 만들 수 있다고 한다. 따라서 #selector(method)는 구조체로 Selector을 만들어 메서드를 실행하는 것과 같다. [링크]

    # 추가 서치 필요

4. objc와 IBAction의 차이점

  • 위의 궁금증과 이하동문

    간단하게 이해하기로는 둘 다 동일한 역할을 하는 것은 맞다.
    IBAction은 단순히 Interface Builder에게 '나 함수다!' 라는 것을 알리는 코드라고 한다. 다른 말로 eventHandler 역할 [링크]

    (여기서 Interface Builder란 스토리보드를 직접 보고 편집할 수 있도록 Xcode에서 제공하는 일종의 툴인 셈 [링크])

    결국 차이점은 IB에서 보이느냐 안 보이느냐의 차이점이다.
    IBAction 자체는 @Objc를 활용한다고 하니, @Objc가 더 큰 개념인셈 [링크]

5. segmentControl의 역할

  • 이전에 한번 사용해본 기억이 나는데, 정확하게 어떤 행동을 했는지 기억이 나지 않는다. TabBar처럼 보이던데, 완전 다른 역할을 하는 UIComponent인걸까?

    생김새는 tabBar과 비슷해보이지만 명확히 말하면, 구분된(segmented) 버튼이다. TabBar은 하단에 위치해서 새로운 View로 이동이 가능한 반면, SegmentControl은 단일~멀티 선택을 표시하는 모습을 가진다.
    익숙한 구조는 Keynote, Word, PowerPoint 같은 프로그램에서 Bold, Italic, Underline 등을 클릭했는지 확인할 때 보이는 구분된 버튼을 생각하면 될 것 같다. [링크]

6. Image ContentMode

  • - 정리가 필요해보인다. 이건 추가 예정
    일단 가장 많이 사용하면서 헷갈리는 요소 3개만 정리했다!

    1. scaleToFill
    UIImageView에 맞춰, 이미지의 넓이와 높이를 늘린다.
    따라서 ImageView 규격이 크거나 비율이 이상할 경우,
    사용되는 이미지 또한 강제적으로 비율을 늘려 맞춘다.


    2. aspectFit
    넓이 또는 높이 중, 가장 긴 쪽을 뷰와 일치하도록 한다.
    이럴 경우, 이미지의 크기는 커지면서 비율 또한 유지되는데,
    한 쪽을 기준으로 맞추다보니 imageView의 빈 영역은 검은색으로 채워진다.


    3. aspectFill
    aspectFit과 달리, 높이와 넓이 중 짧은 쪽을 기준으로 이미지를 늘린다.
    scaleToFill처럼 이미지가 늘어나지 않는다!


    위 내용들로 한번 구현을 해봐야겠다.

1개의 댓글

comment-user-thumbnail
2023년 8월 2일

세븐일레븐님, 저도 궁금했던 내용인데 ! 좋은글 감사합니다

답글 달기