* 해당 포스팅은 커넥트 재단의 edwith-[부스트 코스] 안드로이드 프로그래밍의 강의 자료를 바탕으로 작성되었습니다.
1. View속성
뷰는 안드로이드 기본 화면을 구성하는 모든 기본 화면 구성요소를 말한다. 뷰 중에서도 눈에 보이는 것은 위젯, 보이지 않는 것은 레이아웃을 나눌 수 있다. 레이아웃은 그 안에 다른 뷰들을 담아둘 수 있는데 레이아웃도 뷰를 상속하여 정의되었기 때문에 레이아웃 안에 레이아웃도 담을 수 있다.
2. View의 크기 속성
뷰의 크기 속성을 살펴보면 가로, 세로의 크기가 필수 속성이므로 layout_width, layout_height 속성을 반드시 넣어주어야 한다. "match_parent"는 상위 뷰의 크기에 맞게 구성 요소를 확장하고, 뷰 안에 들어있는 내용물의 크기에 딱 맞게 크기를 결정하는 wrap_content를 사용할 수도 있고 원하는 크기를 숫자로 지정할 수도 있다.
3. LinearLayout(리니어 레이아웃)
레이아웃들 가운데서 가장 많이 쓰이며 프로젝트를 진행할 때도 내가 가장 많이 쓴 레이아웃이다. 리니어 레이아웃은 상자를 쌓듯이 뷰를 하나씩 쌓을 수 있는 레이아웃이며, 화면에서 뷰가 차지하는 영역을 상자라고 보고 이 상자를 한쪽 방향으로 쌓을 수 있게 해 준다. 방향 속성인 orientation 속성을 이용해 가로 방향은 Horizontal, 세로 방향은 Vertical로 지정하고, 그다음에는 단순히 쌓기만 하면 된다.
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="@drawable/thumbnail"
android:orientation="horizontal">
<ImageView
android:layout_width="150dp"
android:layout_height="200dp"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:src="@drawable/image11" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="20dp"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:layout_marginBottom="10dp"
android:text="군도"
android:textSize="24dp"
android:textStyle="bold" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginTop="20dp"
android:layout_marginBottom="10dp"
android:src="@drawable/ic_15" />
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="2014.07.23 개봉"
android:textSize="20dp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="액션 / 137 분"
android:textSize="20dp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Button
android:id="@+id/likeButton"
android:layout_width="40dp"
android:layout_height="40dp"
android:background="@drawable/thumb_up" />
<TextView
android:id="@+id/likeCountView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="30dp"
android:text="15"
android:textSize="20dp" />
<Button
android:id="@+id/hateButton"
android:layout_width="40dp"
android:layout_height="40dp"
android:background="@drawable/thumb_down" />
<TextView
android:id="@+id/hateCountView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:text="3"
android:textSize="20dp" />
</LinearLayout>
</LinearLayout>
첫 리니어 레이아웃 orientation 속성을 horizontal로 주어서 가로로 배치하며 그안에 orientation 속성을 vertical로 주어서 세로로 배치함으로 인해 레이아웃안에 레이아웃 배치로 세심하고 다양한 레이아웃 표현이 가능하다.
4. View의 마진, 패딩
마진은 뷰의 테두리선 바깥쪽 공간을 얼마나 띄울 것인지를 지정하는 속성이며, 패딩은 뷰 안에 들어있는 내용물을 테두리 선과 얼마나 띄울 것인지를 지정하는 속성이다.
<ImageView
android:layout_width="150dp"
android:layout_height="200dp"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:src="@drawable/image11" />위의 군도 포스터를 보면 붙어있는것이 아니고 테두리선과 미세하게 떨어져 있는데, layout_margin을 이용하여 보기좋은 배치가 가능하다.
참고로 두 개가 나란히 영역을 차지하는 경우 수치적인 값으로 영역을 할당할 때 layout_width 속성의 값이 0dp이고 layout_weight 속성이 각각 1이라면 이 두 개의 버튼은 공간을 반반씩 나누어 가진다. 왼쪽 버튼이 2/3, 오른쪽 버튼이 1/3씩 공간을 차지하도록 하고 싶다면 layout_width 속성의 값이 0dp이고 layout_weight 속성이 각각 2와 1이 되도록 만들면 된다.
5. 기본 위젯들
(1) 텍스트뷰(TextView) 텍스트뷰에 글자를 표시할 때는 text 속성에 직접 글자를 넣어줄 수도 있지만 /res/values 폴더 안에 들어있는 strings.xml 파일 안에 넣어둔 태그의 값으로 설정할 수도 있다.
(2) 버튼(Button) 버튼은 텍스트뷰의 속성을 모두 가지고 있으면서 추가적인 기능이나 속성을 더 가지고 있습니다.
<Button
android:id="@+id/likeButton"
android:layout_width="40dp"
android:layout_height="40dp"
android:background="@drawable/thumb_up" /><?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:drawable="@drawable/ic_thumb_up_selected" />
<item android:drawable="@drawable/ic_thumb_up" />
</selector>버튼에 background속성을 사용해서 drawble폴더 내에 thumb_up이라는 xml을 만들어 기능을 부여하고 버튼의 모양을 바꿀수 있다.
(3) 에디트 텍스트(EditText) 에디트텍스트는 입력 상자의 역할을 한다. 사용자가 입력한 글자를 받고 처리하는 기능을 제공하므로 상당히 많이 사용된다. hint 속성을 설정하면 글자를 입력하지 않았을 때 희미하게 보이는 안내글을 표시해준다.
(4) 이미지 뷰(ImageView) 이미지뷰는 이미지를 보여준다. 프로젝트의 res 폴더 안에는 drawable 폴더가 들어있는데 이 폴더 안에 이미지 파일을 넣고 이미지 뷰에 설정할 수 있다.
<ImageView
android:layout_width="150dp"
android:layout_height="200dp"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:src="@drawable/image11" />
6. 상태 드로어블
상태 드로어블은 뷰의 상태에 따라 뷰에 보여줄 그래픽을 다르게 지정할 수 있도록 한다. /res/drawable 폴더 안에 새로운 XML 파일을 만들면 최상위 태그는 <selector>가 된다. 그 안에 <item> 태그를 넣을 수 있으며 drawable 속성에는 이미지나 다른 그래픽을 설정하여 화면에 보이도록 할 수 있다.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true"
android:drawable="@drawable/ic_thumb_up_selected" />
<item android:drawable="@drawable/ic_thumb_up" />
</selector>버튼부분에서도 간단하게 보여줬지만, <item>태그를 이용하여 많은 기능을 추가할수 있고, android:state_pressed="true"를 이용하여 버튼이 눌렸을때를 나타내고 이때 thumb_up_selected 그림으로 바뀐다.
7. 쉐이프 드로어블
쉐이프 드로어블은 XML로 도형을 그릴 수 있도록 한다. /res/drawable 폴더 안에 XML 파일을 만들고 최상위 태그를 <shape>로 바꾸면 도형 하나를 정의할 수 있다.
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<gradient
android:startColor="#7288DB"
android:centerColor="#3250B4"
android:endColor="#254095"
android:angle="90"
android:centerY="0.5"
/>
</shape>도형을 정의할수 있는데 graident속성을 사용하여 도형의 시작, 중간, 끝 색깔을 부여하고, 색깔을 부여하는 각도, centerY를 이용하여 y축의 가운데 즉 정가운데를 기준으로 함을 의미한다.
'안드로이드' 카테고리의 다른 글
| [안드로이드] final을 쓰는 이유 (0) | 2023.01.13 |
|---|
댓글