IT Knowledge Share

Padding과 Margin의 개념과 활용을 어떻게 하는지 알아봅니다. 이 두 개념은 웹 프로그래밍의 프론트엔드 부분에서도 많이 등장하는 개념입니다. 안드로이드 UI에서도 해당 개념은 거의 동일한 의미로 사용됩니다. 큰 도화지에 네모가 그려져 있고, 네모 안에 글자가 적혀있다고 가정해 봅시다. Padding은 네모를 기준으로 네모 안의 글자를 조정하는 역할을 합니다. Margin은 도화지를 기준으로 네모 자체를 조정하는 역할을 합니다. 코드와 에물레이션 결과를 통해서 자세히 확인합시다. 에물레이션 결과 Margin 사각형을 보면, android:layout_marginLeft="50dp", android:layout_marginTop="20dp", android:layout_marginRight="100..

모든 뷰에 고유한 이름을 부여할 수 있습니다. 이는 아래의 코드처럼, id값으로 지정합니다. 이름을 지정하면, 이름을 가진 뷰를 기준으로 다른 뷰의 위치를 옮길 수 있게 됩니다. android:id="@+id/원하는 이름" 이름을 지정하면, res - values - ids.xml 파일에 해당 이름이 기록되게 됩니다. * ids.xml 파일에 아래와 기록됩니다. 원하는 이름 그럼 아래의 코드와 에뮬레이터 결과를 살펴 봅니다. 에뮬레이터 결과 위의 코드와 결과 사진처럼, 9개의 블록이 위치해 있습니다. 중요한 부분만 짚고 넘어가자면, 블록5를 기준으로 나머지 블록을 배치해 줍니다. 블록5에 "five"라는 id값을 부여해줍니다. 앞으로 나머지 블록은 모두 블록5를 기준으로 정렬할 것입니다. 블록1의 경우 ..

이번에는 Relative Layout에 대해 알아봅니다. Relative Layout은 상대적인 위치에 하위 뷰를 나타내는 기능을 합니다. 우선 코드와 에뮬레이터 결과를 바로 확인합니다. 에뮬레이터 결과 우선 부모 뷰를 Relative Layout으로 설정하면, Orientation 속성을 부여할 필요가 없습니다. 어차피 상위 영역에 상대적으로 위치가 결정하기 때문에 해당 속성을 넣지 않습니다. 정 가운데에 있는 1번을 보면, android:layout_centerInParent="true" 해당 속성을 true값을 줌으로써, 부모 컨테이너를 기준으로 중간에 놓았습니다. 6번 또한 같은 맥락입니다. 4번 부터 차례대로 보면, 중요한 부분은 android:layout_alignParentLeft="true..

Linear Layout을 사용해서 6개의 블록을 만들어봅시다. 바로 코드를 확인합니다. 에뮬레이터 실행 결과 우선 부모 뷰의 Linear Layout 중에서 Orientation 속성을 Horizontal로 해주면, 수평 방향으로 전체적인 방향이 설정됩니다. 부모 뷰 안에 Linear Layout으로 이루어진 자식 뷰 하나를 생성합니다. 해당 자식 뷰가 전체적인 화면 UI를 차지하도록, width=0dp, height=match_parent으로 설정합니다. 만약 width="match_parent"로 설정하면, 두 번째 Linear Layout 자식 뷰에 포함된 블록 3~6이 보이지 않게 됩니다. weight은 1로 설정합니다. 첫 번째 Linear Layout 부모 뷰에 TextView 자식 뷰 3개..

부모 뷰가 될 수 있는 View Component 중 하나인 Layout 중에서 Linear Layout에 대해 알아봅니다. 우선 해당 코드를 먼저 확인합니다. 에뮬레이터 실행 결과 전체적인 레이아웃을 LinearLayout으로 잡아주고, 안에 자식 뷰인 TextView를 사용했습니다. 안드로이드에서 위치/방향을 움직이기 위해서는 Gravity라는 속성을 이용합니다. 여기서 Gravity와 Layout_Gravity 두 종류가 있습니다. Gravity는 부모 뷰 안에 있는 객체들을 움직일 수 있으며, Layout_Gravity는 해당 속성을 가진 자식 뷰에만 적용됩니다. 부모 뷰에서 전체적인 레이아웃을 잡을 때, Gravity 속성을 Center로 잡았습니다. 이는 모든 자식 뷰의 위치를 센터로 설정하는..

View Component에 대해 좀 더 자세히 알아봅시다! activity_main.xml 파일에서 직접 코드를 작성해 UI를 어떻게 구성할 수 있는지 살펴봅니다. 우선 레이아웃을 정하게 됩니다. 위의 예시에서는 LinearLayout으로 정했으며, 항상 태그를 닫을 때는 이렇게 닫아주도록 합니다. LinearLayout의 속성들을 적용해서 설정이 가능한데, orientation은 vertical로 해줍니다. 이는 자식 TextView의 방향을 수직으로 놓을지, 수평으로 놓을지 결정해줍니다. 속성은 정말 많은데, 어떤 속성이 있는지 알아보려면 Ctrl + SpaceBar를 동시에 눌러 보세요. 적용 가능한 모든 속성 리스트를 바로 확인할 수 있습니다. 여러 콤포넌트 중에 TextView를 사용하여, 텍..