2016년 8월 1일 월요일

Android Studio - Action Bar를 Tool Bar로 + Fragment를 이용한 ViewPager 처리

안드로이드의 화면은 기본적으로 Activity 이다.
그리고 이 Activity 의 Lifecycle관리에 대한 주체는 개발자가 아니고 안드로이드시스템이다.
That's why we call it a component, not a class.

예를 들어 Tab 화면을 만들고 싶다고 해서 기존 UI 프로그래밍 처럼 베이스가 되는 Activity 밑에다가 Tab 갯수만큼의 Activity 를 멤버로 갖고 있는 것이 안된다는 얘기다.

이럴 때 활용할 수 있는 것이 Fragment!!

이 Fragment 는 기본적으로 View 타입의 클래스 이지만 Activity 의 기능 또한 가지고 있다.
실제로 Activity의 Lifecycle을 흉내 낸다.



[Action Bar를 Tool Bar로]

android 에서 기본으로 제공하는 action bar 가 있지만 좀 더 입맛대로 바꾸고자 한다면 Toolbar 를 활용 하는 방법이 있다.

0. 당연히 main_activity.xml 에서 적용하고 있는 테마가 있다.

<style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">

1. style.xml 에서 기본 android toolbar 속서을 없애기

<!-- Base application theme. --><style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar">
    <!-- Customize your theme here. -->    <item name="colorPrimary">@color/colorPrimary</item>
    <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
    <item name="colorAccent">@color/colorAccent</item>

    <!-- Activity window에서 기본으로 제공하는 Action bar를 이용할 수도 있지만,        api level 21부터는 개발자가 view처럼 핸들링하는 Toolbar를 이용하도록
        so that,window 준비할때 Actionbar는 준비하지 못하게        우리의 activity가 표준 라이브러리의 activity를 상속받은 게 아니라         support-apcompt AppCompatActivity를 상속 받아서
        android: 제거 해야 함-->    <item name="windowActionBar">false</item>
    <item name="windowNoTitle">true</item>
</style>

원래는 android:windowActionBar 가 맞는데, 우리는 지금 AppCompat 라이브러리를 사용하기 때문에 windowActionBar 로 해줘야 한다.

2. menu_main.xml 파일 생성

<menu 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" tools:context=".MainActivity">
    <item android:id="@+id/action_settings" android:title="Setting"        android:orderInCategory="100" app:showAsAction="never" />
    <item        android:id="@+id/menu_main_search"        app:actionViewClass="android.support.v7.widget.SearchView"        android:icon="@android:drawable/ic_menu_search"        android:orderInCategory="1"        app:showAsAction="always"        android:title="Search"/>
</menu>

3. 생성한 메뉴를 MainActivity에 등록

<android.support.v7.widget.Toolbar    android:id="@+id/toolbar"    android:layout_width="match_parent"    android:layout_height="?attr/actionBarSize"    android:background="?attr/colorPrimary"/>

Toolbar toolbar;

@Overrideprotected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    toolbar = (Toolbar)findViewById(R.id.toolbar);

    // actionbar는 못 나오게 theme로 설정한다. 우리의 view(toolbar)    // activity actionbar로 적용    // ?? activity 입장에서는 actionbar에 뿌려주던 부분을    // toolbar에 뿌려줘야 하기 때문에 ex) 메뉴    setSupportActionBar(toolbar);
}

@Overridepublic boolean onCreateOptionsMenu(Menu menu) {
    getMenuInflater().inflate(R.menu.menu_main, menu);
    return super.onCreateOptionsMenu(menu);
}

4. 완성된 툴바





[Fragment를 이용한 ViewPager 처리]

화면 Slide를 통해서 페이지가 이동되도록 하는 ViewPager를 만들어 보자.

0. 3개의 Fragment 페이지 용 xml 파일, 클래스 간단히 만들기



import android.os.Bundle;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.LinearLayout;


/** * A simple {@link Fragment} subclass. */public class OneFragment extends Fragment {


    public OneFragment() {
        // Required empty public constructor    }


    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) {
        if (container == null) {

            return null;
        }
        return (LinearLayout)inflater.inflate(R.layout.fragment_one, container, false);
    }


}

1. MainActivity 에 ViewPager를 등록

<android.support.v4.view.ViewPager    android:id="@+id/viewpager"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:layout_below="@id/toolbar">
</android.support.v4.view.ViewPager>

ViewPager viewPager;

@Overrideprotected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);

    viewPager = (ViewPager)findViewById(R.id.viewpager);
}

2. ViewPager 에다가 View를 List로 담아다가 Adapter로 제공하도록, Adapter 클래스를 내부 클래스로 정의

// ViewPager는 대표적인 AdapterView 이다. ViewPager의 화면한장을 항목 하나로 본다.// PagerAdapter, FragmentStatePagerAdapter 두개 제공...// FragmentStatePagerAdapter 에서 Fragment 제어 FragmentTransaction 자동 적용class MyPagerAdapter extends FragmentStatePagerAdapter{
    // 항목 집합    List<Fragment> fragments = new ArrayList<>();
    public MyPagerAdapter(FragmentManager fm){
        super(fm); // 상위 클래스에 Fgragment Manager만 전달하면        // 상위 클래스에서 FragmentTransaction을 이용하여 Fragment 제어        fragments.add(new OneFragment());
        fragments.add(new TwoFragment());
        fragments.add(new ThreeFragment());
    }

    // 일반 Adapter getView에 해당되는 함수    // 항목 하나를 획득하기 위해 자동 호출
    @Override    public Fragment getItem(int position) {
        return fragments.get(position);
    }

    @Override    public int getCount() {
        return fragments.size();
    }
}

3. ViewPager 에 셋팅 완료 한 Adapter를 등록

ViewPager viewPager;

@Overrideprotected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    viewPager = (ViewPager)findViewById(R.id.viewpager);
    viewPager.setAdapter(new MyPagerAdapter(getSupportFragmentManager()));
}


4. 실행 및 슬라이드



댓글 없음:

댓글 쓰기