2015년 2월 6일 금요일

안드로이드 merge 와 include 레이아웃 기법

목차


merge태그와 include태그 소개

안드로이드의 레이아웃의 멋진 기법으로
include와 merge 라는 것이 존재한다
공식홈피와 블로그에서도 소개해놨따
http://developer.android.com/training/improving-layouts/reusing-layouts.html
http://android-developers.blogspot.kr/2009/02/android-layout-tricks-2-reusing-layouts.html

또한 요런 사이트도 있다
안드로이드 merge의 단점 (일어)
일어지만 중국어나 아랍어가 아닌게 어딘가

몰라도 상관없지만 알면 매우 편리한 기법이라고나 할까..
나 같은 귀차니즈머한테는 특히나..

include 태그

똑같은 태그를 또 쓰는 걸 좋아하는 사람은 없을 것이다
그래도 메뉴라거나 할려면 어쩔 수 없다
리스트뷰라면 뷰를 복제복제 해주니 나름 편한데 그런 방법이 없을까

라면 뭐.. 뻔하게도 include 다

마구 써야할 뷰를 하나 정의해주고
그것을 include 태그에 넣어주면 쿠킹완성

예를들어보자

설명이피료해
이런 화면을 만들어 줄려면
TextView를 여섯개나 도배해야한다. 근데 패턴이 있다
시작과 끝 시간.. 그럼 저것을 따로 만들어 보자

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    >
 
    <TextView
        android:id="@+id/txt_startTime"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="30dp"
        android:text="공부 시작 시간"
        android:textSize="20dp"
        />
 
    <TextView
        android:id="@+id/txt_endTime"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@id/txt_startTime"
        android:layout_marginBottom="30dp"
        android:text="공부 끝 시간"
        android:textSize="20dp"
        />
</RelativeLayout>

custom_timeset.xml
설명이피료해
이렇게 된다.

이걸 include를 사용해서 마구 붙여주면된다

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="vertical"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:padding="100dp"
    >
    <include
        android:id="@+id/include_layout"     <!-- 아이디 설정 가능 -->
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        layout="@layout/custom_timeset"      <!-- xml을 적는데 주의점 android빼고 -->
        />
    <include
        android:id="@+id/include_layout2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        layout="@layout/custom_timeset"
        />
    <include
        android:id="@+id/include_layout3"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        layout="@layout/custom_timeset"
        />
</LinearLayout>

올ㅋ
설명이피료해
이렇게 되었다

결국.. ViewGroup을 따로 만들어놓고는 재활용하는 것이다
여기서 id가 어떻게 되는 것인지 궁금할 수가 있다

1
2
3
4
5
6
7
8
9
10
View include01 = findViewById(R.id.include_layout);
View include02 = findViewById(R.id.include_layout2);
View include03 = findViewById(R.id.include_layout3);
 
TextView tv1 = (TextView) include01.findViewById(R.id.txt_startTime);
TextView tv2 = (TextView) include01.findViewById(R.id.txt_endTime);
TextView tv3 = (TextView) include02.findViewById(R.id.txt_startTime);
TextView tv4 = (TextView) include02.findViewById(R.id.txt_endTime);
TextView tv5 = (TextView) include03.findViewById(R.id.txt_startTime);
TextView tv6 = (TextView) include03.findViewById(R.id.txt_endTime);

이런식으로 사용하면 된다
id가 겹치지만 윈도우에서 A폴더 B폴더 이름만 다르면 각 폴더안 내용물의
이름이 같아도 상관없는 것처럼 상위 뷰계층의 id안에서 findViewById를 하기에
문제가 없다

하지만 위에 보는것과 같이 코드가 더 추가되며
include 를 함으로써 뷰계층이 깊어진다

merge 태그

include를 쓸려면 반드시 감싸줄 ViewGroup이 존재해야만 한다
하지만 그것은 한편으론 뷰계층을 더 깊게하여 부하를 가중 시킨다

항상 레이아웃 디자인에 있어서 레이아웃의 중복은
좋지 않다.

그것을 위해서 나온것이 merge 태그로써
위에서 RelativeLayout 대신에 merge를 사용할 수 있다

1
2
3
4
5
6
7
8
9
10
11
12
13
<?xml version="1.0" encoding="utf-8"?>
<merge
    >
    <TextView
        android:id="@+id/txt_startTime"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginBottom="30dp"
        android:text="공부 시작 시간"
        android:textSize="20dp"
        />
</merge>

이렇게 되면 include 되는 순간 merge 태그는 사라지고
그안의 내용물만 바로 붙여지게 된다
include의 최대 단점이 사라지게 되는 것이다
대신 merge의 슈퍼울트라 단점이 있는데
merge는 뷰 그룹을 생성하지 않음으로써 include와 달리 id 사용이 제한적이다
무슨 소리냐면
View include01 = findViewById(R.id.include_layout);
여기서 include01 이 NULL로 떨어진다는 것이다
아까 말했듯이 merge 태그가 사라짐으로써 include 할때 붙여주는 id도 함께
날아간다. 그렇게 되면 붙여주는 include 마다의 구분이 사라지게됨으로써
각 merge 의 내용물 뷰 역시 같은 id로 둘 수 없게된다
결국 include와 똑같은 효과를 볼려면
merge 로 만드는 뷰도 3개 만들어야한다는거..
노가다를 줄인답시고 하는건데 노가다가 배로 늘어버린다 -_-

그럼 왜 이런 정신나간 태그가 존재하는가

이 경우는 같은 xml이 아니라 각각의 xml에서
똑같은 형식이 딱 1개! 만 필요할때 써주면 편하다
즉, 액티비티가 5개 있는데
각 액티비티마다 무시무시한 분량의 태그가 있는데 그것이 똑같이 생겼다면
merge로 만들어두고 각각 하나씩 붙여주면 되는 것이다

여기서 또하나 ViewStub 이라는게 있는데 걍 없는셈 치자 ^^
잘 쓰지도 않는거…

Written with StackEdit.

Related Posts:

  • 컴퓨터와 프로그래밍의 개념원리목차 반도체 아날로그와 디지털 프로그래밍은.. 컴퓨터와 프로그래밍은 긴밀하게 묶여있지만 그것이 어떻게 묶여있는지는 잘모르는 사람이 많다. 원래부터 흥미가 있었던 사람이나 전공에서 일정부분 진행하지 않는 이상 그 실체가 드러나지않기 때문이기도 하지만 근본적으론 한국교육 방식이 글러먹었기 때문이다 왜 그런가로 흥미 유발을 하고 그것을 해결해나가게 한후 그 이후에 더 쉽게 해결… Read More
  • 유니티 - Time.deltaTime델타의 용어뜻 delta : an incremental change in a variable불행히도 네이버 사전에는 없고 그냥 구글을 뒤져보면 여러뜻중에 저런 것이 있다 사실 우리도 지겹게 보아온 단어다 수학에서.. 델타가 어쩌구.. 간단히 변화값이다. 혹은 경과값이라고 할 수 있다유니티의 Time.deltaTime여기서 유니티의 문서를 보면 Time.deltaTime을 이렇게 정의해놨다 … Read More
  • 유니티 - 카메라 컴포넌트 설명목차Clear Flags Skybox Solid Color Depth Only Don’t Clear Background Culling Mask Projection Clipping Planes Viewport Rect Depth Rendering Path Target Texture (Unity Pro only) HDR Clear Flags 화면의 어디를 클리어 시킬 것인지를 정한다 라고… Read More
  • Git 시작하기 4 - reset목차 git reset 명령어 다시 원상태로 reflog git reset 명령어 저번에는 git commit으로 백업을 진행시켰다 (무려 1년도 넘은 저번편이지만..) 백업을 하는 이유 중 하나는 바로 되돌리기를 위해서이다 그 되돌리기를 하는 명령어가 바로 reset 이다 명령어부터 대놓고 쉽다 이걸로 끝이면 좋겠지만 불행해도 쪼끔 더 복잡하다 reset은 3가지 영… Read More
  • 유니티 Mathf.Lerp Mathf.LerpAngle목차Mathf.Lerp 선형보간법 Mathf.LerpAngle Mathf.Lerp 선형보간법Interpolation 이라는 용어가 있는데 보간법(補間法)이라고 한다본인은 수학도 잼병이고 이런 용어도 너무 약하다 거기다 검색해보니 너무 고차원적이라 간신히 흰것은 웹페이지 바탕화면이고 검은것은 글씨라는 것 정도만 해석 가능했다 그래도 어쩌랴 궁금한걸..;;;일단 용어부터 시작하겠다 보간.. 간… Read More

댓글 3개 :