안드로이드 어플리케이션 스타일

스타일과 테마 적용

스타일과 테마는 각종 UI 에 대한 같은 디자인을 쓸 때 유용하게 작용합니다.

▶ 스타일
스타일은 레이아웃 XML 에 있는 하나의 엘리먼트 단위로 적용 할 수 있는 속성들의 집합입니다. 예를들면 텍스트 컬러와 크기를 지정하는 스타일을 만들어 놓고, 특정 뷰 엘리먼트에 적용할 수 있지요.

▶ 테마
테마는 어플리케이션 내의 모든 액티비티 또는 하나의 액티비티 단위로 적용할 수 있는 속성들의 집합입니다. 예를들어 메뉴에 텍스트크기와 색상을 지정하는 테마를 만들어 놓고, 액티비티에 적용 할 수 있지요.

스타일과 테마 만들기

1. 스타일과 테마를 사용하기 위해선 우선 프로젝트의 'res/values' 디렉토리에 'styles.xml' 이라고 하는 XML 파일을 생성하고 <resources> 루트 노드를 추가합니다.

2. <style> 엘리먼트를 추가하여 고유한 name 속성과 선택사항인 parent 속성을 지정합니다. name 은 이 스타일의 이름이고, parent 는 스타일 리소스가 상속받은 것을 뜻합니다.

3. <style> 엘리먼트 내부에 <item> 엘리먼트를 정의하는데, 각각의 <item> 은 name 속성을 가지고 스타일을 속성을 구분하며, 엘리먼트에 그 값을 정의합니다.

스타일 만들기

<?xml version=”1.0” encoding=”utf-8”?> <resources>
<style name=”SpecialText” parent=”@style/Text”> 
<item name=”android:textSize”>18sp</item> <item name=”android:textColor”>#008</item>
</style> </resources>

view raw gistfile1.xml This Gist brought to you by GitHub.

<item> 의 name 속성에는 문자열, 16진수 색상값, 다른 리소스의 참조 등을 지정할 수 있습니다. <style> 엘리먼트의 parent 속성은 어떤 리소스로부터 스타일이 상속받는 역할을 합니다.
스타일은 어떠한 유형의 리소스도 상속할 수 있는데요, 일반적으로는 항상 표준 안드로이드의 스타일 리소스를 상속받은 뒤, 변경할 부분만 바꾸어주는 방식을 사용합니다.

<EditText id="@+id/text1" style="@style/SpecialText" 
android:layout_width="fill_parent"
android:layout_height="wrap_content" 
android:text="스타일 적용된 Text" />

view raw gistfile1.xml This Gist brought to you by GitHub.

이제 EditText 는 XML 에서 정의한 스타일에 따라 적용이 될 것 입니다 ㅎ

테마 만들기

테마도 XML 의 <style> 엘리먼트로 선언하고 ' 스타일 ' 과 같은 방법으로 설정하지만, 다른점이 있다면 매니페스트 파일 내의 <application> 과 <activity> 엘리먼트를 통해 추가를 해야합니다.

테마는 개별 뷰에는 적용할 수 없습니다.

우선 테마를 선언해야 겠죠?

<?xml version=”1.0” encoding=”utf-8”?> 
<resources>
<style name=”CustomTheme”> 
<item name=”android:windowNoTitle”>true</item>
<item name=”windowFrame”>@drawable/screen_frame</item> 
<item name=”windowBackground”>@drawable/screen_background_white </item> 
<item name=”panelForegroundColor”>#FF000000</item> 
<item name=”panelTextColor”>?panelForegroundColor</item> 
<item name=”panelTextSize”>14</item> 
<item name=”menuItemTextColor”>?panelTextColor</item> 
<item name=”menuItemTextSize”>?panelTextSize</item>
</style> 
</resources>

view raw gistfile1.xml This Gist brought to you by GitHub.

리소스 참조를 위한 '@' 와 '?' 가 있습니다. @는 이전에 미리 정의된 리소스를 참조한다는 의미이며, ?는 현재 로드된 테마에서의 리소스 값을 참조한다는 뜻입니다.

이것은 name 값에 의해 특정 <item> 을 참조하면서 수행되어 집니다. 예를들면 panelTextColor 는 panelForegroundColor 값을 사용한다는 의미가 됩니다. 이러한 방식은 XML 리소스에서만 사용할 수 있습니다.

매니페스트에 테마 추가하기

어플리케이션의 모든 액티비티에 테마를 설정하려면 <application> 태그에 android:theme 속성을 추가합니다.

<application android:theme=”@style/CustomTheme”>

만약 어느 하나의 액티비티에는 테마를 적용하고 싶다면 매니페스트의 <activiy> 태그에 테마 속성을 추가합니다. 또한 안드로이드에서 기본으로 제공되는 테마를 사용할 수도 있는데요, 예를들어 다이얼로그 박스처럼 디자인하기 원한다면 Dialog 테마를 사용할 수 있겠죠.

<activity android:theme=”@android:style/Theme.Dialog”>

그리고 어떠한 테마를 조금만 수정하여 사용하고 싶다면 커스텀 테마의 parent 속성에 해당 테마를 지정하여 상속을 받아야합니다.

<style name=”CustomDialogTheme” parent=”@android:style/Theme.Dialog”>

그 다음으로, 변경하고 싶은 상속받은 테마 각각의 item 에 값을 새로 정의하고, 매니페스트에선 커스텀 테마를 사용하면 되겠죠.

어플리케이션에 테마 추가

테마는 프로그램적으로 불러올 수도 있습니다. 이때, setTheme() 메소드를 사용하는데요, 이것은 컨텍스트 내에서 뷰를 인스턴스화 하기 전에 테마 설정이 되야 한다는 조건이 있습니다.
무슨 말인고 하니, setContentView() 나 inflate() 를 호출하기 전에 설정되야 한다는 뜻입니다

protected void onCreate(Bundle savedInstanceState) { 
super.onCreate(savedInstanceState); 
// 다른 구현부분 
setTheme(android.R.style.Theme_Light); 
setContentView(R.layout.linear_layout_3);
}

view raw gistfile1.java This Gist brought to you by GitHub.

하지만 대부분의 경우 화면에 테마적용을 하는 일은 XML 에서 하는 것이 유리하며 , 또 권고사항 입니다.