▶ Tab 위젯
버튼을 두고 그 버튼을 눌러 서브 화면을 전환하는 방식처럼 하나의 뷰에서 여러 개의 정보를 보고자 할때 일반적으로 사용하는 뷰로 탭(Tab)위젯을 들 수 있습니다. 탭 위젯은 안드로이드의 전화번호부를 비롯한 몇 개의 기본 애플리케이션에서 볼 수 있는 뷰로 각각의 서브 화면이 탭 위젯 상단에 있는 탭을 누를 때 마다 전환되어 나타납니다.
이 탭 위젯은 크게 세가지 구성 요소를 포함하고 있는데, TabHost, TabWidget, Frame Layout 입니다. 탭의 구성요소 중에서 탭 위젯 전체는 탭 호스트라고 부르며 이 탭 호스트는 크게 상단의 탭 위젯과 하단의 프레임 레이아웃으로 구성 됩니다. 상단의 탭 위젯에는 각각의 서브 화면을 선택할 수 있는 탭들이 추가되어 있고 하단의 프레임 레이아웃은 프레임 레이아웃이 가지는 기본적인 특징인 여러 뷰들을 중첩하여 추가하여도 하나의 뷰만 보인다는 점을 이용하여 정의 합니다. 즉 나머지 뷰들은 가시성 속성만 변경하여 서브 화면 중에서 보고자 하는 하나의 화면만을 View.VISIBLE로 설정하여 보여줍니다.
탭을 화면에 추가할 때는 기본 액티비티 클래스가 아닌 TabActivity 클래스를 사용합니다. 이 탭 액티비티 클래스에는 탭을 사용할 때 필요한 메소드나 속성들이 미리 정의되어 있으므로 탭 자체를 사용하기 편리합니다. TabActivity에서 탭 호스트 객체를 참조할 때는 getTabHost() 메소드를 사용합니다.
[Reference]
TabHost getTabHost()
탭 호스트는 기본적으로 아무것도 없이 비어 있으므로 여기에 새로운 서브 화면들을 추가해야 합니다. 새로운 탭을 추가하기 위해서는 addTab() 메소드를 사용하는데 파라미터로 전달되는 TabSpec 객체는 newTabSpec() 메소드를 이용해 만들 수 있습니다.
[Reference]
void addTab(TabHost.TabSpec tabSpec)
TabHost.TabSpec newTabSpec (String tag)
TabSpec 객체는 탭 정보를 담고 있는데 이 정보는 상단에 표시하는 각 탭의 이름과 서브 화면의 내용을 담고 있는 뷰 그리고 탭을 코드 상에서 구분하기 위한 이름으로 나누어져 있습니다. 상단에 표시하는 각 탭의 이름은 Indicator라고 부르는데 인디케이터와 탭의 내용을 설정하는 메소드는 각각 setIndicator()와 setContent()입니다.
[Reference]
TabHost.TabSpec setIndicator(CharSequence label[. Drawable icon])
TabHost.TabSpec setContent(int viewId)
TabHost.TabSpec setContent(TabHost.TabContentFactory contentFactory)
TabHost.TabSpec setContent(Intent intent)
▷ SampleTabActivity.java
import android.app.TabActivity;
import android.content.Intent;
import android.os.Bundle;
import android.widget.TabHost;
public class SampleTabActivity extends TabActivity {
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
// setup tab widget
setupTabs();
}
private void setupTabs() {
TabHost tabs = getTabHost();
// TAB 01
TabHost.TabSpec spec = null;
Intent intent = null;
spec = tabs.newTabSpec("tab01");
intent = new Intent(this, SubPage01Activity.class);
intent.putExtra("mode", "new");
intent.putExtra("initialize", true);
intent.putExtra("request", true);
intent.addFlags(Intent.FLAG_ACTIVITY_SINGLE_TOP);
spec.setContent(intent);
spec.setIndicator("SubPage01");
tabs.addTab(spec);
// TAB 02
spec = tabs.newTabSpec("tab02");
intent = new Intent(this, SubPage02Activity.class);
intent.putExtra("mode", "new");
intent.putExtra("initialize", true);
intent.putExtra("request", true);
intent.addFlags(Intent.FLAG_ACTIVITY_SINGLE_TOP);
spec.setContent(intent);
spec.setIndicator("SubPage02");
tabs.addTab(spec);
// TAB 03
spec = tabs.newTabSpec("tab03");
intent = new Intent(this, SubPage03Activity.class);
intent.putExtra("mode", "new");
intent.putExtra("initialize", true);
intent.putExtra("request", true);
intent.addFlags(Intent.FLAG_ACTIVITY_SINGLE_TOP);
spec.setContent(intent);
spec.setIndicator("SubPage03");
tabs.addTab(spec);
// set current tab
tabs.setCurrentTab(0);
}
}
▷ /res/layout/main.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TabHost
android:id="@android:id/tabhost"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical"
>
<TabWidget
android:id="@android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
<FrameLayout
android:id="@android:id/tabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
</FrameLayout>
</LinearLayout>
</TabHost>
</LinearLayout>
▷ /res/layout/subpage01.xml, /res/layout/subpage02.xml, /res/layout/subpage03.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="@+id/text01"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#ff0000cc"
android:text="첫 번째 페이지"
android:textSize="20dp"
android:focusable="true"
/>
<Button
android:id="@+id/button01"
android:layout_width="160dp"
android:layout_height="wrap_content"
android:text="보여주기"
android:textSize="20dp"
android:textStyle="bold"
/>
</LinearLayout>
▷ AndroidManifest.xml
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.example.sampletab"
android:versionCode="1"
android:versionName="1.0" >
<uses-sdk
android:minSdkVersion="8"
android:targetSdkVersion="15" />
<application
android:icon="@drawable/ic_launcher"
android:label="@string/app_name"
android:theme="@style/AppTheme" >
<activity
android:name=".SampleTabActivity"
android:label="@string/title_activity_sample_tab" >
<intent-filter>
<action android:name="android.intent.action.MAIN" />
<category android:name="android.intent.category.LAUNCHER" />
</intent-filter>
</activity>
<activity
android:name=".SubPage01Activity" >
</activity>
<activity
android:name=".SubPage02Activity" >
</activity>
<activity
android:name=".SubPage03Activity" >
</activity>
</application>
</manifest>
[결과]
[Android]간단한 애니메이션 사용 (0) | 2012.08.25 |
---|---|
[Android]WebView (0) | 2012.08.18 |
[Android] 단말 방향 설정 (0) | 2012.08.16 |
[Android] 포커스 (0) | 2012.08.16 |
[Android]event - 02 (0) | 2012.08.15 |
댓글 영역