버전 인식 구성요소 사용
컬렉션을 사용해 정리하기
내 환경설정을 기준으로 콘텐츠를 저장하고 분류하세요.
이제 TabHelper
및 CompatTab
두 가지를 구현(하나는 Android 3.0 이상, 다른 하나는 이전 버전의 플랫폼을 위한 것)했으므로 구현을 활용할 차례입니다. 이 학습 과정에서는 이러한 구현 간 전환 로직과 버전 인식 레이아웃을 만들고 마지막으로 이전 버전과 호환되는 UI 구성요소를 사용하는 방법을 설명합니다.
전환 로직 추가
TabHelper
추상 클래스는 현재 기기의 플랫폼 버전에 기반하여 버전에 적합한 TabHelper
및 CompatTab
인스턴스를 만드는 팩토리 역할을 합니다.
Kotlin
sealed class TabHelper(protected val mActivity: FragmentActivity, protected val tag: String) {
abstract fun setUp()
abstract fun addTab(tab: CompatTab)
// Usage is tabHelper.newTab("tag")
fun newTab(tag: String): CompatTab =
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) {
CompatTabHoneycomb(mActivity, tag)
} else {
CompatTabEclair(mActivity, tag)
}
companion object {
// Usage is TabHelper.createInstance(activity)
fun createInstance(activity: FragmentActivity): TabHelper =
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) {
TabHelperHoneycomb(activity)
} else {
TabHelperEclair(activity)
}
}
}
자바
public abstract class TabHelper {
...
// Usage is TabHelper.createInstance(activity)
public static TabHelper createInstance(FragmentActivity activity) {
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) {
return new TabHelperHoneycomb(activity);
} else {
return new TabHelperEclair(activity);
}
}
// Usage is tabHelper.newTab("tag")
public CompatTab newTab(String tag) {
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.HONEYCOMB) {
return new CompatTabHoneycomb(mActivity, tag);
} else {
return new CompatTabEclair(mActivity, tag);
}
}
...
}
버전 인식 활동 레이아웃 만들기
다음 단계는 두 가지 탭 구현을 지원할 수 있는 활동 레이아웃을 제공하는 것입니다. 이전 구현(TabHelperEclair
)의 경우 활동 레이아웃에 탭 콘텐츠 컨테이너와 함께 TabWidget
과 TabHost
가 포함되어 있는지 확인해야 합니다.
res/layout/main.xml:
<!-- This layout is for API level 5-10 only. -->
<TabHost xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@android:id/tabhost"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="5dp">
<TabWidget
android:id="@android:id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<FrameLayout
android:id="@android:id/tabcontent"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
</LinearLayout>
</TabHost>
TabHelperHoneycomb
구현의 경우 탭 콘텐츠가 포함될 FrameLayout
만 있으면 됩니다. 탭 표시기를 ActionBar
에서 제공하기 때문입니다.
res/layout-v11/main.xml:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@android:id/tabcontent"
android:layout_width="match_parent"
android:layout_height="match_parent" />
런타임 시 Android는 플랫폼 버전에 따라 어떤 버전의 main.xml
레이아웃을 확장할지 판단합니다. 어떤 TabHelper
구현을 사용할지 판단하는 이전 섹션에서 본 로직과 동일합니다.
활동에 TabHelper 사용
활동의 onCreate()
메서드에서 TabHelper
객체를 가져오고 다음 코드를 사용하여 탭을 추가할 수 있습니다.
Kotlin
override fun onCreate(savedInstanceState: Bundle?) {
...
setContentView(R.layout.main)
TabHelper.createInstance(this).apply {
setUp()
newTab("photos")
.setText(R.string.tab_photos)
.also { photosTab ->
addTab(photosTab)
}
newTab("videos")
.setText(R.string.tab_videos)
.also { videosTab ->
addTab(videosTab)
}
}
}
자바
@Override
public void onCreate(Bundle savedInstanceState) {
setContentView(R.layout.main);
TabHelper tabHelper = TabHelper.createInstance(this);
tabHelper.setUp();
CompatTab photosTab = tabHelper
.newTab("photos")
.setText(R.string.tab_photos);
tabHelper.addTab(photosTab);
CompatTab videosTab = tabHelper
.newTab("videos")
.setText(R.string.tab_videos);
tabHelper.addTab(videosTab);
}
애플리케이션을 실행할 때 이 코드는 올바른 활동 레이아웃을 확장하고 TabHelperHoneycomb
또는 TabHelperEclair
객체를 인스턴스화합니다. 실제로 사용되는 구체적인 클래스는 활동에 불투명합니다. 공통 TabHelper
인터페이스를 공유하기 때문입니다.
다음은 Android 2.3과 Android 4.0 기기에서 실행되는 이 구현의 스크린샷 두 개입니다.
그림 1. Android 2.3 기기(TabHelperEclair
사용)와 Android 4.0 기기(TabHelperHoneycomb
사용)에서 실행되는 이전 버전과 호환되는 탭의 스크린샷 예
이 페이지에 나와 있는 콘텐츠와 코드 샘플에는 콘텐츠 라이선스에서 설명하는 라이선스가 적용됩니다. 자바 및 OpenJDK는 Oracle 및 Oracle 계열사의 상표 또는 등록 상표입니다.
최종 업데이트: 2025-07-27(UTC)
[[["이해하기 쉬움","easyToUnderstand","thumb-up"],["문제가 해결됨","solvedMyProblem","thumb-up"],["기타","otherUp","thumb-up"]],[["필요한 정보가 없음","missingTheInformationINeed","thumb-down"],["너무 복잡함/단계 수가 너무 많음","tooComplicatedTooManySteps","thumb-down"],["오래됨","outOfDate","thumb-down"],["번역 문제","translationIssue","thumb-down"],["샘플/코드 문제","samplesCodeIssue","thumb-down"],["기타","otherDown","thumb-down"]],["최종 업데이트: 2025-07-27(UTC)"],[],[],null,["# Use the version-aware component\n\nNow that you have two implementations of `TabHelper` and `CompatTab`---one for Android 3.0 and later and one for earlier versions of the platform---it's time to do something with these implementations. This lesson discusses creating the logic for switching between these implementations, creating version-aware layouts, and finally using the backward-compatible UI component.\n\nAdd the switching logic\n-----------------------\n\nThe `TabHelper` abstract class acts as a [factory](https://en.wikipedia.org/wiki/Factory_(software_concept)) for creating version-appropriate `TabHelper` and `CompatTab` instances, based on the current device's platform version: \n\n### Kotlin\n\n```kotlin\nsealed class TabHelper(protected val mActivity: FragmentActivity, protected val tag: String) {\n\n abstract fun setUp()\n\n abstract fun addTab(tab: CompatTab)\n\n // Usage is tabHelper.newTab(\"tag\")\n fun newTab(tag: String): CompatTab =\n if (Build.VERSION.SDK_INT \u003e= Build.VERSION_CODES.HONEYCOMB) {\n CompatTabHoneycomb(mActivity, tag)\n } else {\n CompatTabEclair(mActivity, tag)\n }\n\n companion object {\n // Usage is TabHelper.createInstance(activity)\n fun createInstance(activity: FragmentActivity): TabHelper =\n if (Build.VERSION.SDK_INT \u003e= Build.VERSION_CODES.HONEYCOMB) {\n TabHelperHoneycomb(activity)\n } else {\n TabHelperEclair(activity)\n }\n }\n}\n```\n\n### Java\n\n```java\npublic abstract class TabHelper {\n ...\n // Usage is TabHelper.createInstance(activity)\n public static TabHelper createInstance(FragmentActivity activity) {\n if (Build.VERSION.SDK_INT \u003e= Build.VERSION_CODES.HONEYCOMB) {\n return new TabHelperHoneycomb(activity);\n } else {\n return new TabHelperEclair(activity);\n }\n }\n\n // Usage is tabHelper.newTab(\"tag\")\n public CompatTab newTab(String tag) {\n if (Build.VERSION.SDK_INT \u003e= Build.VERSION_CODES.HONEYCOMB) {\n return new CompatTabHoneycomb(mActivity, tag);\n } else {\n return new CompatTabEclair(mActivity, tag);\n }\n }\n ...\n}\n```\n\nCreate a version-aware activity layout\n--------------------------------------\n\nThe next step is to provide layouts for your activity that can support the two tab implementations. For the older implementation (`TabHelperEclair`), you need to ensure that your activity layout contains a [TabWidget](/reference/android/widget/TabWidget) and [TabHost](/reference/android/widget/TabHost), along with a container for tab contents:\n\n**res/layout/main.xml:** \n\n```xml\n\u003c!-- This layout is for API level 5-10 only. --\u003e\n\u003cTabHost xmlns:android=\"http://schemas.android.com/apk/res/android\"\n android:id=\"@android:id/tabhost\"\n android:layout_width=\"match_parent\"\n android:layout_height=\"match_parent\"\u003e\n\n \u003cLinearLayout\n android:orientation=\"vertical\"\n android:layout_width=\"match_parent\"\n android:layout_height=\"match_parent\"\n android:padding=\"5dp\"\u003e\n\n \u003cTabWidget\n android:id=\"@android:id/tabs\"\n android:layout_width=\"match_parent\"\n android:layout_height=\"wrap_content\" /\u003e\n\n \u003cFrameLayout\n android:id=\"@android:id/tabcontent\"\n android:layout_width=\"match_parent\"\n android:layout_height=\"0dp\"\n android:layout_weight=\"1\" /\u003e\n\n \u003c/LinearLayout\u003e\n\u003c/TabHost\u003e\n```\n\nFor the `TabHelperHoneycomb` implementation, all you need is a [FrameLayout](/reference/android/widget/FrameLayout) to contain the tab contents, since the tab indicators are provided by the [ActionBar](/reference/android/app/ActionBar):\n\n**res/layout-v11/main.xml:** \n\n```xml\n\u003cFrameLayout xmlns:android=\"http://schemas.android.com/apk/res/android\"\n android:id=\"@android:id/tabcontent\"\n android:layout_width=\"match_parent\"\n android:layout_height=\"match_parent\" /\u003e\n```\n\nAt runtime, Android will decide which version of the `main.xml` layout to inflate depending on the platform version. This is the same logic shown in the previous section to determine which `TabHelper` implementation to use.\n\nUse TabHelper in your activity\n------------------------------\n\nIn your activity's [onCreate()](/reference/android/app/Activity#onCreate(android.os.Bundle)) method, you can obtain a `TabHelper` object and add tabs with the following code: \n\n### Kotlin\n\n```kotlin\noverride fun onCreate(savedInstanceState: Bundle?) {\n ...\n setContentView(R.layout.main)\n\n TabHelper.createInstance(this).apply {\n setUp()\n\n newTab(\"photos\")\n .setText(R.string.tab_photos)\n .also { photosTab -\u003e\n addTab(photosTab)\n }\n\n newTab(\"videos\")\n .setText(R.string.tab_videos)\n .also { videosTab -\u003e\n addTab(videosTab)\n }\n }\n}\n```\n\n### Java\n\n```java\n@Override\npublic void onCreate(Bundle savedInstanceState) {\n setContentView(R.layout.main);\n\n TabHelper tabHelper = TabHelper.createInstance(this);\n tabHelper.setUp();\n\n CompatTab photosTab = tabHelper\n .newTab(\"photos\")\n .setText(R.string.tab_photos);\n tabHelper.addTab(photosTab);\n\n CompatTab videosTab = tabHelper\n .newTab(\"videos\")\n .setText(R.string.tab_videos);\n tabHelper.addTab(videosTab);\n}\n```\n\nWhen running the application, this code inflates the correct activity layout and instantiates either a `TabHelperHoneycomb` or `TabHelperEclair` object. The concrete class that's actually used is opaque to the activity, since they share the common `TabHelper` interface.\n\nBelow are two screenshots of this implementation running on an Android 2.3 and Android 4.0 device.\n\n**Figure 1.** Example screenshots of backward-compatible tabs running on an Android 2.3 device (using `TabHelperEclair`) and an Android 4.0 device (using `TabHelperHoneycomb`)."]]