Android - 탭바

 

 

위 사진에서 아래의 친구 채팅 오픈채팅 쇼핑 더보기같은

탭바를 구현하고 싶다

 

우선은 설치부터 한후에

implementation("androidx.navigation:navigation-fragment:2.5.3")
implementation("androidx.navigation:navigation-ui:2.5.3")

 

 

 

화면과 같이 구성한 뒤에

좌측의 메뉴중 리소스매니저를 클릭

그리고 내비게이션을 클릭해야하는데 안보인다면

아래의

저 부분에 점 3개 있는부분을 클릭하면 숨어있으니 선택하도록 하자

 

그리고 +버튼을 클릭하여 내비게이션 리소스파일을 선택

그리고 위 화면에서 크리에이트 뉴 선택

 

블랭크를 선택하도록 하자

이번엔 3가지 화면을 만들도록 해보자

 

 

 

다시 메인xml로 돌아가서

아래의 호스트 프래그먼트를 선택하면

 

 

방금 만든 3개의 화면이 선택할 수 있게된다

 

 

 

 

그리고나서 방금 만든 호스트 프래그먼트를 선택하여 layout_을 검색 어보브에서

바텀내비게이션을 선택해주자

 

 

그리고 각각의 창을 이런식으로 바꿔주자

그리고 리소스에서 새로운 리소스 디렉토리를 생성

menu라고 지어주고

그 안에 메뉴 리소스파일을 생성하자

 

그리고 메뉴아이템을 3개 생성하여

각각 아이디와 아이콘을 설정해준뒤

 

 

 

메인으로 돌아와 바텀내비게이션뷰를 선택후

menu를 검색하여 클릭해보면

 

 

이렇게 선택이 가능해진다

 

 

그럼 일단 화면 하나는 나오게 되는데

이때 아래의 글씨를 지우고 아이콘만 나오게 하고 싶다면 아래와 같이 

 

 

 

레이블을 검색하여

레이블 비지빌리티모드에서 언 레이블드를 선택하면되겠다

 

 

그리고

이제 버튼을 누를때 각각의 화면을 나오게 하기위해

아래와같이 작성하면

 

public class MainActivity extends AppCompatActivity {

    BottomNavigationView bottomNavigationView;

    // 각각의 프레그먼트들을 멤버변수로 만든다.
    Fragment firstFragment;
    Fragment secondFragment;
    Fragment thirdFragment;


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

        bottomNavigationView = findViewById(R.id.bottomNavigationView);

        firstFragment = new FirstFragment();
        secondFragment = new SecondFragment();
        thirdFragment = new ThirdFragment();

        bottomNavigationView.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;

                }else if (itemId == R.id.secondFragment){

                    fragment = secondFragment;

                }else if (itemId == R.id.thirdFragment){
                    fragment = thirdFragment;
                }

                return loadFragment(fragment);
            }
        });

    }

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

 

 

각각의 화면이 나오게 된다