개발

[안드로이드]Fragment 사용하기

지승준 2013. 11. 13. 10:58

한 화면을 여러 공간으로 쪼개어 사용하거나 액티비티 이동없이 화면 내부구성을 다른 레이아웃으로 

교체 시킬 때 등 Fragment는 여러 군데에서 사용되어지고 있습니다.


Fragment 란 ? : http://androidhuman.tistory.com/469


Frafment를 사용하려면 그것을 사용하는 상위 activity가 FragmentActivity 여야 합니다.




Fragment 생명주기는 activity와 흡사하며 주의 할 점이 activity에서 this로 쓰던 부분을 getActivity()로 

바꿔 써주셔야 합니다.



큰 구성은 FragmentActivity를 상속받은 MainActivity.java 가 있고 Fragment 를 상속받은

OneFragment, TwoFragment, ThreeFragment.java 세가지 클래스를 만든다음 

activity_main.xml에 있는 ll_fragment 영역에 위에만든 세가지 fragment 를 삽입하는 방식입니다.



먼저 MainActivity 구성입니다.



위 그림과 같이 activity_main.xml  레이아웃 하나에 fragment 가 교체 될 영역과 그 영역을 컨트롤 할 

메뉴 뷰 를 만들어 줍니다. 



<MainActivity>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
public class MainActivity extends FragmentActivity implements OnClickListener {
 
    final String TAG = "MainActivity";
 
    int mCurrentFragmentIndex;
    public final static int FRAGMENT_ONE = 0;
    public final static int FRAGMENT_TWO = 1;
    public final static int FRAGMENT_THREE = 2;
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
 
        Button bt_oneFragment = (Button) findViewById(R.id.bt_oneFragment);
        bt_oneFragment.setOnClickListener(this);
        Button bt_twoFragment = (Button) findViewById(R.id.bt_twoFragment);
        bt_twoFragment.setOnClickListener(this);
        Button bt_threeFragment = (Button) findViewById(R.id.bt_threeFragment);
        bt_threeFragment.setOnClickListener(this);
 
        mCurrentFragmentIndex = FRAGMENT_ONE;
 
        fragmentReplace(mCurrentFragmentIndex);
    }
 
    public void fragmentReplace(int reqNewFragmentIndex) {
 
        Fragment newFragment = null;
 
        Log.d(TAG, "fragmentReplace " + reqNewFragmentIndex);
 
        newFragment = getFragment(reqNewFragmentIndex);
 
        // replace fragment
        final FragmentTransaction transaction = getSupportFragmentManager()
                .beginTransaction();
 
        transaction.replace(R.id.ll_fragment, newFragment);
 
        // Commit the transaction
        transaction.commit();
 
    }
 
    private Fragment getFragment(int idx) {
        Fragment newFragment = null;
 
        switch (idx) {
        case FRAGMENT_ONE:
            newFragment = new OneFragment();
            break;
        case FRAGMENT_TWO:
            newFragment = new TwoFragment();
            break;
        case FRAGMENT_THREE:
            newFragment = new ThreeFragment();
            break;
 
        default:
            Log.d(TAG, "Unhandle case");
            break;
        }
 
        return newFragment;
    }
 
    @Override
    public void onClick(View v) {
 
        switch (v.getId()) {
 
        case R.id.bt_oneFragment:
            mCurrentFragmentIndex = FRAGMENT_ONE;
            fragmentReplace(mCurrentFragmentIndex);
            break;
        case R.id.bt_twoFragment:
            mCurrentFragmentIndex = FRAGMENT_TWO;
            fragmentReplace(mCurrentFragmentIndex);
            break;
        case R.id.bt_threeFragment:
            mCurrentFragmentIndex = FRAGMENT_THREE;
            fragmentReplace(mCurrentFragmentIndex);
            break;
 
        }
 
    }
 
}
cs


전체적으로 보면 fragment 마다 int으로된 구분자를 주고 메뉴 버튼이 클릭 될 때마다 해당 fragment의 

index를 mCurrentFragmentIndex 라는 int 형 변수에 담아 fragment 교체 매소드를 태우는 식입니다.



onCreate부터 보면 메뉴 버튼등록과 리스너를 달고 mCurrentFragmentIndex에 첫 화면 fragment인 

FRAGMENT_ONE 를 넣어주고 fragmentReplace 매소드를 타게됩니다.

fragmentReplace 매소드에는 넘겨받은 fragment index를 가지고 getFragment 매소드를 가서 

실질적인 fragment의 객체 생성을 하고 그 객체를 리턴해줍니다. 


다시 fragmentReplace매소드로 돌아와 리턴받은 fragment로 ll_fragment 라는 레이아웃 영역에

교체를 하게 됩니다. 다른 버튼을 눌렀을 때도 이와 같은 방식으로 동작하게 됩니다. 



Fragment 들은 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
public class OneFragment extends Fragment implements OnClickListener {
 
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
            Bundle savedInstanceState) {
 
        View v = inflater.inflate(R.layout.onefragment, container, false);
 
        Button button = (Button) v.findViewById(R.id.bt_ok);
        button.setOnClickListener(this);
 
        return v;
    }
 
    @Override
    public void onClick(View v) {
 
        switch (v.getId()) {
 
        case R.id.bt_ok:
            Toast.makeText(getActivity(), "OneFragment", Toast.LENGTH_SHORT)
                    .show();
            break;
 
        }
 
    }
 
}
cs

이처럼 Activity와 비슷한 구조이고 



마지막으로 activity_main.xml 구조입니다.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >
 
    <LinearLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:background="#ffffffff"
        android:orientation="vertical" >
 
        <LinearLayout
            android:id="@+id/ll_fragment"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1" />
 
        <LinearLayout
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginBottom="10dp"
            android:layout_marginTop="10dp"
            android:background="#ffffffff"
            android:orientation="horizontal" >
 
            <Button
                android:id="@+id/bt_oneFragment"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="1" />
 
            <Button
                android:id="@+id/bt_twoFragment"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="2" />
 
            <Button
                android:id="@+id/bt_threeFragment"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:text="3" />
        </LinearLayout>
    </LinearLayout>
 
</RelativeLayout>
cs


ll_fragment 라는 영역이 Fragment들이 교체 될 영역입니다.








 FragmentExample.zip