안드로이드 - 한 화면에 여러 개의 프래그먼트 만들기

 

프래그먼트에 관한 내용은 안드로이드-프래그먼트-사용-간단-예제 를 참고하자.

 

이번에는 한 화면에 2개의 프래그먼트를 만들어 보는 예제이다..

 

프로젝트 익스플로러에서 다음과 같이 3개의 파일을 생성해야 함을 잊지 말자.

 

 

counterfragment..xml 파일은 실제 프래그먼트를 구성하는 UI파일이다.

 

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

android:orientation="vertical"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:gravity="center_horizontal"

android:background="#ffff00"

>

 

<TextView

android:id="@+id/txtcounter"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:textColor="#ff0000"

android:textSize="40sp"

android:text="0"

/>

<Button

android:id="@+id/btnincrease"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="Increase"

/>

 

</LinearLayout>

 

 

activity_two_fragment1.xml 여기서 실제 프래그먼트가 2개라는 것을 명시해주는 UI이다.

 

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:orientation="vertical"

>

    <TextView

     android:layout_width="match_parent"

     android:layout_height="wrap_content"

     android:text="두 개의 프래그먼트를 배치합니다."

     android:layout_margin="20dp"

     />

    <LinearLayout

     android:layout_width="match_parent"

     android:layout_height="wrap_content">

     <!-- fragment의 name속성은 만드시 패키지명.클래스명$내부클래스명을 잊지말자 -->

    <fragment

     android:name="com.example.ch20_twofragment.TwoFragment1$CounterFragment"

     android:id="@+id/counterfragment1"

     android:layout_width="wrap_content"

     android:layout_height="wrap_content"

     android:layout_margin="20dp"

     />

    <fragment

     android:name="com.example.ch20_twofragment.TwoFragment1$CounterFragment"

     android:id="@+id/counterfragment2"

     android:layout_width="wrap_content"

     android:layout_height="wrap_content"

     android:layout_margin="20dp"

     />

</LinearLayout>

</LinearLayout>

 

 

TwoFragment1.java

 

package com.example.ch20_twofragment;

 

import android.app.Activity;

import android.app.Fragment;

import android.os.Bundle;

import android.view.LayoutInflater;

import android.view.View;

import android.view.ViewGroup;

import android.widget.Button;

import android.widget.TextView;

 

public class TwoFragment1 extends Activity {

 

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_two_fragment1);

    }

 

    public static class CounterFragment extends Fragment{

          

        

        @Override

        public View onCreateView(LayoutInflater inflater, ViewGroup container,

                Bundle savedInstanceState) {

            // TODO Auto-generated method stub

            //onCreateView는 프래그먼트의 UI를 처음 그릴때 호출한다.

            //그래서 여기서 XML을 이용해서 프래그먼트 UI를 구성해준다.

            //container에 전개자를 사용하여 xml을 가져온다

            View root = inflater.inflate(R.layout.counterfragment, container, false);

            

            Button btnIncrease = (Button)root.findViewById(R.id.btnincrease);

            final TextView textCounter = (TextView)root.findViewById(R.id.txtcounter);

        

            //간단한 버튼 클릭 리스너 달아줌

            btnIncrease.setOnClickListener(new Button.OnClickListener(){

 

                @Override

                public void onClick(View arg0) {

                    // TODO Auto-generated method stub

                    int count = Integer.parseInt(textCounter.getText().toString());

                    textCounter.setText(Integer.toString(count + 1));

                }

                

            });

            

            return root;

        

        }

        

    }

    

}

 

 

실행 화면

각 프래그먼트가 독립적으로 잘 동작됨을 알 수 있다.