카톡이나 인스타그램 같은 앱을 보시면 하단에 탭 버튼이 있어, 각 탭을 눌러서 화면을 이동할 수 있도록 되어있습니다.
만약 옆으로 밀어서 화면이 넘어가는 탭을 만들고 싶다면 '뷰클리퍼'를 사용할 수 있습니다.
탭 호스트는 탭 버튼에 맞는 화면을 갈아끼울 수 있는 장소라고 생각하시면 됩니다.
각 버튼에 맞는 화면은 1개씩만 지정이 가능하고 사진을 연결할 수도 있고,
xml을 따로 연결할 수도 있어서 각 탭 버튼에 맞는 화면 구현이 가능합니다.
각 탭버튼마다 xml을 연결한다면, 필요한 xml의 개수는 4개 입니다.
탭 호스트 xml 1개, 각 화면에 맞는 xml 3개!
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".MainActivity">
<TabHost
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:id="@android:id/tabhost">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:id="@android:id/tabcontent">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/tab_study"
android:orientation="vertical" ></LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:id="@+id/tab_time"></LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:id="@+id/tab_group"></LinearLayout>
</FrameLayout>
<TabWidget
android:id="@android:id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"></TabWidget>
</LinearLayout>
</TabHost>
</LinearLayout>
프레임 레이아웃 안쪽 리니어 레이아웃이 3개가 있습니다.
이 리니어 레이아웃의 개수가 버튼의 개수라고 생각하시면 됩니다.
만약 탭 버튼들이 하단이 아니라 상단에 위치하는것을 원하신다면 탭위젯을 프레임레이아웃 바로 위로 올려주시면 됩니다.
MainActivity.java
package com.example.together;
import androidx.appcompat.app.AppCompatActivity;
import android.app.TabActivity;
import android.content.Intent;
import android.os.Bundle;
import android.widget.TabHost;
@SuppressWarnings("deprecation") //이거 있어야 합니다.
public class MainActivity extends TabActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
TabHost tabHost = getTabHost(); //탭 호스트 객체 생성
// 탭스팩 선언하고, 탭의 내부 명칭, 탭에 출력될 글 작성
TabHost.TabSpec spec;
Intent intent; //객체
//탭에서 액티비티를 사용할 수 있도록 인텐트 생성
intent = new Intent().setClass(this, Study.class);
spec = tabHost.newTabSpec("Study"); // 객체를 생성
spec.setIndicator("공부하기"); //탭의 이름 설정
spec.setContent(intent);
tabHost.addTab(spec);
//탭에서 액티비티를 사용할 수 있도록 인텐트 생성
intent = new Intent().setClass(this, Time.class);
spec = tabHost.newTabSpec("Time"); // 객체를 생성
spec.setIndicator("통계"); //탭의 이름 설정
spec.setContent(intent);
tabHost.addTab(spec);
//탭에서 액티비티를 사용할 수 있도록 인텐트 생성
intent = new Intent().setClass(this, Together_home.class);
spec = tabHost.newTabSpec("Together_home"); // 객체를 생성
spec.setIndicator("그룹"); //탭의 이름 설정
spec.setContent(intent);
tabHost.addTab(spec);
tabHost.setCurrentTab(0); //먼저 열릴 탭을 선택! (2)로 해두면 그룹이 시작 화면!
}
}
각 탭에 맞는 xml이 연결될 수 있도록 자바코드를 작성해줍니다. xml에 맞는 java파일을 꼭 만드셔야해요.
intent = new Intent().setClass(this, Together_home.class); 이 부분이 각 탭에 맞는 화면이 나올 수 있도록 인텐트 하는 부분입니다.
Together_home.java
package com.example.together;
import androidx.appcompat.app.AppCompatActivity;
import android.content.Intent;
import android.os.Bundle;
import android.view.View;
import androidx.appcompat.app.AppCompatActivity;
public class Together_home extends AppCompatActivity {
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.together_home); //xml연결
}
}
그룹 버튼을 눌렀을떄 연결되는 자바파일 입니다. xml과 연결되어 있어야 합니다.
새로운 자바파일을 추가했으면, Manifest에 추가하는거 잊지 마시길 바랍니다.
결과 화면
'Mobile > Android' 카테고리의 다른 글
안드로이드 플로팅 버튼 만들기 (0) | 2021.04.30 |
---|---|
안드로이드 캘린더뷰 값 저장하기 (0) | 2021.04.29 |
안드로이드 리사이클러뷰에서 팝업 메뉴 만들기 (0) | 2021.04.22 |
안드로이드 프래그먼트 간 데이터 전달 (0) | 2021.04.20 |
[안드로이드] 리사이클러뷰에서 인텐트로 데이터 전달 (Adapter) (0) | 2021.04.19 |