[Android] 특정 Layout 위치에 Fragment를 변환

대부분 아는 내용이라 생각되지만, Fragment를 활용하는 개념을 이해하는데 좋을 듯 하여 이렇게 글을 남깁니다.

테스트는 위 그림과 같이 버튼을 누른 이벤트 따라 Layout 영역이 변경되는 것을 확인 하는 아주 간단한 예제 입니다.

## MainActivity

public class MainActivity extends AppCompatActivity implements View.OnClickListener {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
        findViewById(R.id.btn_frag1).setOnClickListener(this);
        findViewById(R.id.btn_frag2).setOnClickListener(this);
        findViewById(R.id.btn_frag3).setOnClickListener(this);
    }

    @Override
    public void onClick(View v) {
        switch (v.getId()) {
            case R.id.btn_frag1:
                getSupportFragmentManager()
                        .beginTransaction()
                        .replace(R.id.frag_container_, new FragmentOne())
                        .commit();
                break;
            case R.id.btn_frag2:
                getSupportFragmentManager()
                        .beginTransaction()
                        .replace(R.id.frag_container_, new FragmentTwo())
                        .commit();
                break;
            case R.id.btn_frag3:
                getSupportFragmentManager()
                        .beginTransaction()
                        .replace(R.id.frag_container_, new FragmentThree())
                        .commit();
                break;
        }
    }
}

## activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<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"
    tools:context="com.namuon.fragmentchangetest.MainActivity">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal">
        <Button
            android:id="@+id/btn_frag1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:gravity="center"
            android:text="버튼1"/>
        <Button
            android:id="@+id/btn_frag2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="버튼2"/>
        <Button
            android:id="@+id/btn_frag3"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="버튼3"/>
    </LinearLayout>
    <FrameLayout
        android:id="@+id/frag_container_"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
    </FrameLayout>
</LinearLayout>

## 위 frag_container 부분이 Fragment를 넣어 변환 시키는 부분 입니다.

## FragmentOne.java

FragmentTwo와 FragmentThree 부분은 똑같기 때문에 생략 하겠습니다.

public class FragmentOne extends Fragment {
    @Nullable
    @Override
    public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        return inflater.inflate(R.layout.frag_layout_1,container,false);
    }
}

## frag_layout_1.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical" android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:textSize="50dp"
        android:text="1"/>

</LinearLayout>

이게 다 입니다. 전체 소스는 첨부 시켜 두었습니다.

정말 간단하게 버튼을 누르면 해당 번호가 frag_container로 포함되는 것을 확인 하실 수 있습니다.

전 Fragment는 그저 태블릿을 경향한 Activity 속의 Activity라는 개념으로만 생각 했었습니다.

하지만, 이 예제를 만들어 본 결과 확정성 뿐만 아니라 View의 다양화가 가능합니다.

FragmentChangeTest.zip

아주 간단한 이론 이지만 저에게는 큰 도움이 되어 이렇게 공유하고자 글을 남깁니다.

글 읽어 주셔서 감사합니다.

참고로!!!

롤리팝 이후, Material Design이 적용되었습니다.

그 중 Fragment를 변경할때 Animation 효과를 주는 좋은 예제가 있어서 공유 드립니다.

https://medium.com/@bherbst/fragment-transitions-with-shared-elements-7c7d71d31cbb#.4saqhbqoc

롤리팝으로 정말 많은 효과를 만들 수 있겠네요^^

## 이블로그는 어디까지는 찾았던 부분을 잊지 않기 위해 올려놓은 것 입니다.

    내용이 부실해도 이해해 주시길 바랍니다.