Android App

Fragment 전환 in Android Studio

YunSeong 2021. 8. 2. 13:29
728x90
반응형

 

Fragment 전환

https://youtu.be/3Th96mVEpyo

사실 아래 링크의 페이지에서 Fragment 전환과 거의 똑같다. 

 

https://yunseong.tistory.com/entry/Android-App-Study1

 

Android App Study_1 (Fragment 전환, layout, activity 전환)

Android, Java에 대해서 잘 아는 것이 아니기 때문에 단어선택이 올바르지 않을 수도 있다. 1. 네비게이션 메뉴 바 https://www.youtube.com/watch?v=stwCk_f3sCw 화면 하단의 네비게이션 바와 fragment를 이용해..

yunseong.tistory.com

 

1 Fragment를 사용할 activity layout 만들기

 

먼저 main activity의 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
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
    tools:context=".MainActivity">
 
    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/frame"/>
 
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_alignParentBottom="true">
 
        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="메뉴1"
            android:id="@+id/btn_1"/>
 
                ...
 
    </LinearLayout>
 
</RelativeLayout>
cs

위 코드와 같이 activity_main에서 Fragment를 띄울 FrameLayout을 만들어주고 (9~12)

Fragment를 전환시켜줄 버튼을 담을 LinearLayout을 만들었다. (14~17)

그리고 android:layout_alignParentBottom을 이용해서 LinearLayout이 밑쪽에 있게 해 줬다. (17)

그것이 가능한 것은 그것의 부모 layout이 RelativeLayout이기 때문이다. (2)

그리고 그 안에 Button을 만들어주었다. 그와 비슷하게 3개를 더 만들어줬다. (19~24)

 

그리고 android:layout_weight="1"에 의해서 위 사진과 같이 Button 위젯들이 딱 맞게 들어가게 했다. (22)

 

 


 

 

2 Fragment로 띄울 layout 만들기

 

그다음에는 fragment로 띄울 layout들을 만들었다. 

1
2
3
4
5
6
7
8
9
10
11
12
13
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
 
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="mandu mandu"
 
        android:textSize="30sp"/>
 
</FrameLayout>
cs

위와 같이 구성요소는 마음대로 만들어주고 총 4개를 만들었다. 

 

 


 

 

3 Fragment를 위한 class 만들기

 

그리고 각각을 위한 class도 만들었다. 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
public class Fragment1 extends Fragment {
 
    public Fragment1() {
 
    }
 
    @Nullable
    @org.jetbrains.annotations.Nullable
    @Override
    public View onCreateView(@NonNull @org.jetbrains.annotations.NotNull LayoutInflater inflater, @Nullable @org.jetbrains.annotations.Nullable ViewGroup container, @Nullable @org.jetbrains.annotations.Nullable Bundle savedInstanceState) {
        
        return inflater.inflate(R.layout.fragment_1, container, false);
    }
}
cs

위와 같이 Fragment를 상속받아줬다. (1)

 

Fragment1() 함수는 Fragment1 class의 객체를 만들 때 사용하는 함수인 것 같다. (3~5)

 

그리고 OnCreateView 함수를 이용해서 이 class의 객체가 만들어졌을 때 inflater.inflate를 이용해서 fragment_1 즉 위에서 flagment로 띄우려고 만든 layout의 구성요소들을 객체화시킨 것을 반환하게 한다.  (10~13)

(단어 선택이 틀렸을 수 있다.)

 

그리고 이 작업을 4번 해준다. 

 

 


 

 

4 버튼을 이용해서 Fragment 띄우게 하기 

1
2
3
4
5
6
7
8
9
btn_1.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        FragmentTransaction transaction = getSupportFragmentManager().beginTransaction();
        Fragment1 fragment1 = new Fragment1();
        transaction.replace(R.id.frame, fragment1);
        transaction.commit();
    }
});
cs

MainActivity.java 에서 setOnClickListener()을 이용해서 아까 activity_main.xml에서 만든 버튼을 누르면 위와 같은 이벤트가 일어나게 했다. (1~9)

 

Fragment를 다루기 위해서 FragmentTransaction이 필요하기 때문에 getSupportFragmentManager().beginTransaction()을 이용해서 가져온다. (4)

그리고 아까 만들었던 Fragment1 class를 객체로 만들어준다. (내 생각에는 아까 반환된 것이 여기로 저장되는 것이 아닌가 싶다. 아닐 수도 있다.)(5)

 

그리고 그렇게 가져온 view를 transaction.replace()를 이용해서 맨 처음 만든 FrameLayout에 띄우고 (6)

transaction.commit()을 이용해서 그것을 적용시켰다. (7)

 

 

그리고 이 작업을 버튼마다 다 해준다면 자연스러운 앱을 만들 수 있다.

 

 

 

 

 

728x90
반응형