Applying Styles and Themes

When designing your application, you can use styles and themes to apply uniform formatting to its various screens and UI elements.

애플리케이션을 디자인할 때, 여러분은 그것의 각종 스크린 및 UI 엘리먼트에 단일한 포맷을 적용하기 위해 스타일과 테마를 사용할 수 있다.

  • A style is a set of one or more formatting attributes that you can apply as a unit to single elements in your layout XML file(s). For example, you could define a style that specifies a certain text size and color, then apply it to instances of a certain type of View element.
  • A theme is a set of one or more formatting attributes that you can apply as a unit to all activities in an application or just a single activity. For example, you could define a theme that sets specific colors for the window frame and the panel foreground and background, and sets text sizes and colors for menus, then apply it to the activities of your application.
  • 스타일은 여러분의 레이아웃 XML 파일에 있는 하나의 엘리먼트 단위로 적용할 수 있는 하나 또는 그 이상의 포맷팅 애트리뷰트의 집합이다. 예를 들어 여러분은 특정 텍스트 크기와 그리고 컬러를 지정하는 스타일을 정의할 수 있고, 그런 다음 그것을 특정 유형의 뷰 엘리먼트의 인스턴스에 적용할 수 있다.
  • 테마는 여러분이 애플리케이션 내의 모든 액티비티 또는 단지 하나의 액티비티 단위로 적용할 수 있는 하나 또는 그 이상의 포맷팅 애트리뷰트의 집합이다. 예를 들어 여러분은 윈도우 프레임과 패널 포어그라운드foreground와 백그라운드background에 대해 특정 색깔을 지정하고, 메뉴에 대해 텍스트 크기와 색을 지정하는 테마를 정의할 수 있으며, 그런 다음 여러분의 애플리케이션의 액티비티들에 그것을 적용할 수 있다.

Styles and themes are resources. Android provides some default style and theme resources that you can use, or you can declare your own custom style and theme resources.

스타일과 테마는 리소스들이다. 안드로이드는 여러분이 사용할 수 있는 약간의 디폴트 스타일과 테마 리소스들을 제공한다. 또한 여러분은 자신의 커스텀 스타일과 테마 리소스들을 정의할 수 있다.

To create custom styles and themes:

커스텀 스타일과 테마를 만들기 위해서는,

  1. Create a file named styles.xml in the your application's res/values directory. Add a root <resources> node.
  2. For each style or theme, add a <style> element with a unique name and, optionally, a parent attribute. The name is used for referencing these styles later, and the parent indicates what style resource to inherit from.
  3. Inside the <style> element, declare format values in one or more <item> element(s). Each <item> identifies its style property with a name attribute and defines its style value inside the element.
  4. You can then reference the custom resources from other XML resources, your manifest or application code.
  1. 여러분의 애플리케이션의 res/values 디렉토리에 styles.xml 라는 이름의 파일을 생성하라. 그리고 파일 안에 <resources> 루트root 노드를 추가하라.
  2. 각 스타일 또는 테마에 대해, 고유한 name 과 선택 사항으로 parent 애트리뷰트를 가지는 <style> 엘리먼트를 추가하라. name은 나중에 이 스타일을 레퍼런스하기 위해 사용되며, parent는 스타일 리소스가 상속받을 것을 가리킨다.
  3. <style> 엘리먼트 내부에, 하나 또는 그 이상의 <item> 엘리먼트에 포맷 값들을 정의하라. 각각의 <item>은 name 애트리뷰트를 가지고 그것의 스타일 속성을 구분하며, 해당 엘리먼트 안에 그것의 값을 정의한다.
  4. 여러분은 그런 다음에 다른 XML 리소스, 여러분의 매니페스트 또는 애플리케이션 코드로부터 커스텀 리소스를 레퍼런스할 수 있다.

Styles

Here's an example declaration of a style:

여기에 스타일 선언declaration 예제가 있다.

<?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>

As shown, you can use <item> elements to set specific formatting values for the style. The name attribute in the item can refer to a standard string, a hex color value, or a reference to any other resource type.

위에서 보여지듯이, 여러분은 스타일에 대한 특정 포맷팅 값들을 지정하기 위해 <item> 엘리먼트를 사용할 수 있다. item의 name 애트리뷰트는 표준 문자열, 16진수 컬러 값, 또는 임의의 다른 리소스 타입에 대한 레퍼런스를 참조할 수 있다.

Notice the parent attribute in the <style> element. This attribute lets you specify a resource from which the current style will inherit values. The style can inherit from any type of resource that contains the style(s) you want. In general, your styles should always inherit (directly or indirectly) from a standard Android style resource. This way, you only have to define the values that you want to change.

<style> 엘리먼트에 있는 parent 애트리뷰트에 주의하라. 이 애트리뷰트는 어떤 리소스로부터 현재 스타일이 값들을 상속할 것인가를 여러분이 지정할 수 있게 한다. 스타일은 여러분이 원하는 스타일을 포함하는 어떤 유형의 리소스로 부터도 상속할 수 있다. 일반적으로 여러분의 스타일은 (직접 또는 간접적으로) 항상 표준 안드로이드 스타일 리소스로 부터 상속해야 한다. 이런 방법으로 여러분은 단지 바꾸고자 하는 값들을 정의해야 한다.

Here's how you would reference the custom style from an XML layout, in this case, for an EditText element:

여기에 여러분이 XML 레이아웃에서 커스텀 스타일을 레퍼런스하는 방법이 있다. 이 경우에는, EditText 엘리먼트에 대한 것이다.

<EditText id="@+id/text1"
          style="@style/SpecialText"
          android:layout_width="fill_parent"
          android:layout_height="wrap_content"
          android:text="Hello, World!" />

Now this EditText widget will be styled as defined by the XML example above.

이제 이 EditText 위젯은, 위의 XML 예제에 의해 정의되는 것으로 스타일될 것이다.

Themes

Just like styles, themes are also declared in XML <style> elements, and are referenced in the same manner. The difference is that you add a theme to an entire application or activity, via the <application> and <activity> elements in the Android Manifest themes cannot be applied to individual Views.

마치 스타일과 같이 테마 또한 XML <style> 엘리먼트로 선언되며, 그리고 같은 방식으로 레퍼런스된다. 그 차이는 여러분이 테마를 안드로이드 매니페스트 내에 있는 <application>과 <activity> 엘리먼트를 통해, 전체 애플리케이션 또는 액티비티에 추가한다는 것이다 - 테마는 개별적인 뷰에는 적용될 수 없다.

Here's an example declaration of a theme:

여기에 테마 선언declaration 예제가 있다.

<?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="panelBackgroundColor">#FFFFFFFF</item>
    <item name="panelTextColor">?panelForegroundColor</item>
    <item name="panelTextSize">14</item>
    <item name="menuItemTextColor">?panelTextColor</item>
    <item name="menuItemTextSize">?panelTextSize</item>
  </style>
</resources>

Notice the use of the at-symbol (@) and the question-mark (?) to reference resources. The at-symbol indicates that we're referencing a resource previously defined elsewhere (which may be from this project or from the Android framework). The question-mark indicates that we're referencing a resource value in the currently loaded theme. This is done by referring to a specific <item> by its name value. (E.g., panelTextColor uses the same color assigned to panelForegroundColor, defined beforehand.) This technique can be used only in XML resources.

리소스를 레퍼런스하기 위한 @심볼at-symbol과 ?마크question-mark의 사용에 주목하라. @심볼은 이전에 다른 곳(이것은 현재 프로젝트이거나 또는 안드로이드 프레임워크일 수 있음)에서 정의된 리소스를 우리가 레퍼런스한다는 것을 가리킨다. ?마크는 현재 로드load된 테마에서의 리소스 값을 우리가 레퍼런스한다는 것을 가리킨다. 이것은 그것의 name 값에 의해 특정 <item>을 레퍼런스함으로써 수행된다(예를 들어 panelTextColor는 앞서 정의된 panelForegroundColor에 지정된 동일한 색깔을 사용한다). 이 기법은 XML 리소스에서만 사용될 수 있다.

Set the theme in the manifest

To set this theme for all the activites of your application, open the AndroidManifest.xml file and edit the <application> tag to include the android:theme attribute with the theme name:

여러분 애플리케이션의 모든 액티비티에 대해 이 테마를 설정하기 위해서는, AndroidManifest.xml 파일을 오픈해서 <application> 태그를 편집해서 테마 이름을 가지는 android:theme 애트리뷰트를 포함시켜라.

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

If you want the theme applied to just one Activity in your application, then add the theme attribute to the <activity> tag, instead.

만약 여러분의 애플리케이션에 있는 오직 하나의 액티비티에만 테마를 적용하고자 한다면, 대신 <activity> 태그에 그 테마 애트리뷰트를 추가하라.

Just as Android provides other built-in resources, there are several themes that you swap in without having to write one yourself. For example, you can use the Dialog theme to make your Activity appear like a dialog box. In the manifest, reference an Android theme like so:

안드로이드는 다른 내장된built-in 리소스를 제공하기 때문에, 여러분이 직접 그것을 만들지 않고 추가할 수 있는 몇 가지 테마가 있다. 예를 들어 여러분의 액티비티를 다이얼로그 박스처럼 만들기 위해 Dialog 테마를 사용할 수 있다. 매니페스트 내에서 다음과 같이 안드로이드 테마를 레퍼런스하라.

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

If you like a theme, but want to slightly tweak it, just add the theme as the parent of your custom theme. For example, we'll modify the Theme.Dialog theme. To do so, create a style with Theme.Dialog as the parent:

만약 여러분이 어떤 테마를 좋아하지만 그것을 가볍게 고치고 싶다면, 여러분의 커스텀 테마의 parent에 해당 테마를 추가하라. 예를 들어 우리는 Theme.Dialog 테마를 수정할 것이다. 그렇게 하기 위해서는 parent로 Theme.Dialog를 가지는 스타일을 만들어라.

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

There it is. We've inherited the Android Dialog theme so we can adjust its styles as we like. So, for each item in the Dialog theme that we want to change, we re-define the value here and use CustomDialogTheme instead of Theme.Dialog inside the Android Manifest.

바로 그것이다. 우리가 좋아하는 대로 해당 스타일을 고칠 수 있도록 안드로이드 Dialog 테마를 상속했다. 그러므로 우리가 변경하고자 하는 Dialog 테마에 있는 각각의 item에 대해, 우리는 여기서 그 값을 새로 정의하고 안드로이드 매니페스트 내에서 Thema.Dialog 대신 CustomDialogTheme를 사용한다.

Set the theme from the application

You can also load a theme for an Activity programmatically, if needed. To do so, use the setTheme() method. Note that, when doing so, you must be sure to set the theme before instantiating any Views in the context, for example, before calling setContentView(View) or inflate(int, ViewGroup). This ensures that the system applies the same theme for all of your UI screens. Here's an example:

여러분은 또한 만약 필요하다면 프로그램적으로 액티비티를 위한 테마를 로드할 수 있다. 그렇게 하기 위해서 setTheme() 메쏘드를 사용하라. 그렇게 할 때, 여러분은 컨텍스트 내에서 임의의 뷰를 인스턴스화하기 전에 테마를 설정해야 한다는 것에 주의하라. 예를 들어 setContentView(View)를 호출하기 전 또는 inflate(int,ViewGroup) 전에 설정해야 한다. 이것은 시스템이 여러분의 모든 UI 스크린에 대해 동일한 테마를 적용하는 것을 보장한다. 여기에 예제가 있다.

 protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    ...
    setTheme(android.R.style.Theme_Light);
    setContentView(R.layout.linear_layout_3);
}

If you are considering loading a theme programmatically for the main screen of your application, note that the theme would not be applied in any animations the system would use to start the activity, which would take place before your application opens. In most cases, if you want to apply a theme to your main screen, doing so in XML is a better approach.

만약 애플리케이션의 메인 스크린을 위해 프로그램적으로 임의의 테마를 로드하는 것을 고려한다면, 시스템이 액티비티를 시작하기 위해 사용할 어떤 애니메이션에는 테마가 적용되지 않는다는 것에 주의하라. 그것은 여러분의 애플리케이션이 오픈되기 전에 일어난다. 대부분의 경우, 만약 메인 스크린에 테마를 적용하고자 한다면, XML에서 그렇게 하는 것이 더 좋은 접근법이다.

For detailed information about custom styles and themes and referencing them from your application, see Available Resource Types: Style and Themes.

커스텀 스타일과 테마, 그리고 그것을 여러분의 애플리케이션에서 레퍼런스하는 것에 대한 자세한 정보는 4장. “리소스와 에셋”의 “사용가능한 리소스 타입”중 “스타일과 테마”를 보라. 사용가능한 디폴트 테마와 스타일에 대한 정보에 대해서는 R.style을 보라.

For information about default themes and styles available, see R.style.

↑ Go to top

← Back to User Interface