본문 바로가기
블록코딩/ㆍ코듈라

보이는 컴포넌트와 보이지 않는 컴포넌트 - visible component non-visible component

by diMik 2021. 6. 24.

컴포넌트의 두가지 종류를 구분해봐요

 

 

컴포넌트의 종류는 크게 두가지로 나뉜다.

 

보이는(visible) 컴포넌트

보이지 않는(non-visible) 컴포넌트

 

처음에는 이 둘이 무슨 차이인지 감이 잘 오지 않지만 이렇게 생각해보면 쉽다.

 

 

보이는 컴포넌트는 말그대로 실제 사용자에게 보여지는 것들이다.

예를 들면 버튼, 레이블, 이미지, 리스트뷰 등이 있다. 이 컴포넌트들은 색이나 크기 폰트 등을 우리가 자유롭게 조정하며 사용자에게 어떤 모습으로 보일 지 정할 수 있다.

 

 

보이지 않는 컴포넌트사용자가 직접 눈으로 볼 수는 없지만 앱의 작업을 수행하는 것들이다.

예를 들면 소리, 시계, 저장소, 네트워크 연결확인, 익스텐션 등이 있다.

 

 

이 개념을 식당에 비유하여 생각해보면 쉽다. 식당 손님을 앱 사용자라고 생각해보자.

 

 

식당에 들어온 손님이 직접 눈으로 보는 인테리어, 테이블, 메뉴, 웨이터 등은 보이는 컴포넌트라고 생각하고,

 

 

손님에게 직접 노출되지 않는 요리, 설거지, 재료정리 등 업무를 수행하는 뒤편의 주방공간보이지 않는 컴포넌트라고 보면 될 것이라고 생각한다.

 

 

모든 것이 식당운영을 위해 움직이는 것임은 같지만, 그것이 손님에게 직접적으로 보이는 것인지 여부에 따른 차이다. 모든 기능이 내가 만든 어플의 목적을 위해 일을 하고 있는 것은 같지만, 그것이 사용자에게 보여지는지 여부에 따라 나뉘는 것이다.

 

 

코듈라 우측 상단에서는 이 두 종류의 컴포넌트를 추려서 볼 수 있다.

 

컴포넌트 구분해서 보는 방법

 

All Components : 모든 컴포넌트 보기

Visible Components : 보이는 컴포넌트만 보기

Non-visible Components : 보이지 않는 컴포넌트만 보기

 

 

컴포넌트를 추가하면 보이는 컴포넌트는 보이지 않는 컴포넌트보다 위쪽에 추가되고, 보이지 않는 컴포넌트는 아래쪽으로 추가된다. 그러므로 이 기능을 사용하지 않는다면, 보이는 컴포넌트는 위쪽부분에서, 보이지 않는 컴포넌트는 아래쪽부분에서 찾아보면 된다.

 

위의 3개는 보이는 컴포넌트, 아래 3개는 보이지 않는 컴포넌트

댓글