Android Studio - BottomNavigationView를 사용해 fragment 기초 이해하기

1. activity_main.xml 의 레이아웃을RelativeLayout으로 바꾼다.

 

 

2. bottom으로 검색하여 BottomNavigationView를 끌어다 놓는다.

 

 

3. BottomNavigationView의 id, width, height, align을 설정해준다.

 

 

4. 리소스매니저 - 네비게이션 - +버튼 - Navigation Resource File 선택

 

 

5. 파일명 짓고 생성

 

 

6. dependency를 추가한다.

• 이런 경고창이 뜨는데 OK를 눌러 dependency를 추가한다.

 

• 만약 안된다면 build.gradle에 직접 dependency를 추가해준다.

dependencies {
	implementation 'androidx.navigation:navigation-fragment:2.5.3'
    implementation 'androidx.navigation:navigation-ui:2.5.3'
}

 

 

7. 생성한 네비게이션 리소스 파일로 가서 Create new destination을 선택한다.

 

 

8. Fragment (Blank) 를 선택

 

 

9. 프래그먼트 이름 설정 (FirstFragment)

 

 

10. 동일한 방식으로 2개 더 만든다(SecondFragment, ThirdFragment)

 

 

11. activity_main에서, NavHostFragment를 끌어다 놓는다.

 

 

12. my_nav를 선택한다.

 

 

 

13. 이 프래그먼트의 위치를 정해준다.

 

14. 3개의 프래그먼트의 텍스트를 첫번째, 두번째, 세번째로 바꿔본다.

 

 

15. 메뉴를 만들 차례다. 리소스 매니저에서, 더보기 눌러서 menu를 선택하고 +버튼을 눌러서 리소스파일을 추가한다.

 

 

 

16. 오른쪽 상단 디자인 보기로 바꾸고, 메뉴아이템을 메뉴에 3개 끌어다놓는다.(탭을 3개로 할거라서)

 

17. 탭에 아이콘을 넣기 위해 아이콘을 만든다.

 

Vector Asset - 원하는 아이콘 선택해서 3개 만든다.

 

 

18. 메뉴의 item에 id, title, icon을 세팅해준다.

 

 

19. activity_main에서, BottomNavigationView에 메뉴 세팅

 

화면이 아래와 같이 된다.

 

20. 이제 화면전환이 되도록 해야한다. 먼저 각 프래그먼트의 onCreatView를 다음과 같이 바꿔준다.

 

참고) 프래그먼트는 화면연결을 onCreate이 아닌 onCreateView에 코드 작성한다.

예시)

 

 

21. 메인 액티비티에서, 각 프래그먼트의 인스턴스를 하나씩 만들고 BottomNavigationView를 화면에 연결한다.

 

22. 메인액티비티에 메소드를 하나 추가한다.

private boolean loadFragment(Fragment fragment){
if (fragment != null){
    getSupportFragmentManager()
            .beginTransaction()
            .replace(R.id.fragment, fragment)
            .commit();
    return true;
}else {
    return false;
}
}

 

23. onCreate 안에 아래 코드를 추가 한다.

// 탭바를 누르면 동작하는 코드
navigationView.setOnItemSelectedListener(new NavigationBarView.OnItemSelectedListener() {
    @Override
    public boolean onNavigationItemSelected(@NonNull MenuItem item) {

        int itemid = item.getItemId();

        Fragment fragment = null;

        if (itemid == R.id.firstFragment){
            fragment = firstFragment;
            getSupportActionBar().setTitle("홈");

        } else if (itemid == R.id.secondFragment) {
            fragment = secondFragment;
            getSupportActionBar().setTitle("내 포스팅");


        } else if (itemid == R.id.thirdFragment) {
            fragment = thirdFragment;
            getSupportActionBar().setTitle("설정");

        }

        return loadFragment(fragment);
    }
});

 

이제 실행해서 아래 탭바를 누르면 화면전환이 잘 된다.

 

 

메인액티비티 전체코드

package com.reodinas2.fragmenttest;

import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;
import androidx.fragment.app.Fragment;

import android.os.Bundle;
import android.view.MenuItem;

import com.google.android.material.bottomnavigation.BottomNavigationView;
import com.google.android.material.navigation.NavigationBarView;

public class MainActivity extends AppCompatActivity {

    BottomNavigationView navigationView;
    // 각 프래그먼트를 멤버변수로 만든다.
    public Fragment firstFragment;
    Fragment secondFragment;
    Fragment thirdFragment;

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

        getSupportActionBar().setTitle("홈");

        navigationView = findViewById(R.id.bottomNavigationView);
        firstFragment = new FirstFragment();
        secondFragment = new SecondFragment();
        thirdFragment = new ThirdFragment();

        // 탭바를 누르면 동작하는 코드
        navigationView.setOnItemSelectedListener(new NavigationBarView.OnItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem item) {

                int itemid = item.getItemId();

                Fragment fragment = null;

                if (itemid == R.id.firstFragment){
                    fragment = firstFragment;
                    getSupportActionBar().setTitle("홈");

                } else if (itemid == R.id.secondFragment) {
                    fragment = secondFragment;
                    getSupportActionBar().setTitle("맵");


                } else if (itemid == R.id.thirdFragment) {
                    fragment = thirdFragment;
                    getSupportActionBar().setTitle("설정");

                }

                return loadFragment(fragment);
            }
        });
    }

    private boolean loadFragment(Fragment fragment){
        if (fragment != null){
            getSupportFragmentManager()
                    .beginTransaction()
                    .replace(R.id.fragment, fragment)
                    .commit();
            return true;
        }else {
            return false;
        }
    }
}