Android Navigation Bar 만들기

Have a good one!·2022년 8월 19일
0

인공지능사관학교

목록 보기
9/13

Navigation Bar를 만들어 보자

1. Layout먼저 만들기

(1). res/menu 폴더 만든다.

res폴더에서 오른쪽 키를 누른후 아래와 같이 한다.

(2). menu_item.xml layout을 만든다.

menu 폴더에서 오른쪽 키를 누른후 아래와 같이 한다.

이름은 menu_item으로 한다.

(3). Menu생성하기

Menu item을 아래와 같이 layout에 추가한다.
각각 id를 page1, page2, page3, page4, page5로 했다.

화면에는 다음과 같이 나타나면 된다. (title을 바꾸면 바꾼 이름이 나타난다.)

2. Page별 View layout만들기

아래와 같이 layout xml을 5개 만들자. (각 page1 ~ page5를 위하여)

아래와 같이 짠

3. Page별 Control할수 있는 JAVA class만들기

mainActivity가 있는 Java class파일을 Page별로 5개 만든다.

아래와 같이 생성되어야 한다.

4. Page layout과 class연결하기

아래와 같은 class에 Fragment class를 상속하는 코드를 넣는다.

extend로 상속 코드 넣음.

Alt+Ins 키를 눌러서 다음 method를 override한다.

onCreateView를 선택하고 ok

기존의 return이 있던 코드를 삭제하고, 아래와 같이 코드를 적어준다.

View view = inflater.inflate(R.layout.page1, container, false);
return view;

이러한 작업을 모든 Page class에 똑같이 반복함.

5. MainActivity와 NavigationBar를 연결하기

(1). MainActivity Layout에서 Navigation Bar를 추가

Containers에서 BottomNavigationView를 추가한다.

그리고 FrameLayout도 추가한다.
나중에 FrameLayout id를 frame, bottomNavigationView id를 nav_View로 변경한다.

(2). MainActvity Class에서 NavigationBar와 Page들을 연결한다.

변수들은 생성한다.

private Page1Activity page1Activity;
private Page2Activity page2Activity;
private Page3Activity page3Activity;
private Page4Activity page4Activity;
private Page5Activity page5Activity;

private FragmentManager fragmentManager;
private BottomNavigationView navi;

Frame을 설정한다.

        // Frame 설정하는 부분
        page1Activity = new Page1Activity();
        page2Activity = new Page2Activity();
        page3Activity = new Page3Activity();
        page4Activity = new Page4Activity();
        page5Activity = new Page5Activity();

        fragmentManager = getSupportFragmentManager();
        // 처음시작 Page는 Page1로 한다.
        fragmentManager.beginTransaction().replace(R.id.frame, page1Activity).commit();

Navigation을 연결한다.

// Navigation 연결하는 부분
        navi = findViewById(R.id.nav_View);
        // 클릭시 Event Listener 생성.
        navi.setOnItemSelectedListener(new NavigationBarView.OnItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem item) {
                switch(item.getItemId())
                {
                    case R.id.page1:
                        Log.d("WeSeek", "onNavigationItemSelected: move to page1Activity");
                        fragmentManager.beginTransaction().replace(R.id.frame, page1Activity).commit();
                        break;
                    case R.id.page2:
                        Log.d("WeSeek", "onNavigationItemSelected: move to page2Activity");
                        fragmentManager.beginTransaction().replace(R.id.frame, page2Activity).commit();
                        break;
                    case R.id.page3:
                        Log.d("WeSeek", "onNavigationItemSelected: move to page3Activity");
                        fragmentManager.beginTransaction().replace(R.id.frame, page3Activity).commit();
                        break;
                    case R.id.page4:
                        Log.d("WeSeek", "onNavigationItemSelected: move to page4Activity");
                        fragmentManager.beginTransaction().replace(R.id.frame, page4Activity).commit();
                        break;
                    case R.id.page5:
                        Log.d("WeSeek", "onNavigationItemSelected: move to page5Activity");
                        fragmentManager.beginTransaction().replace(R.id.frame, page5Activity).commit();
                        break;
                    default:
                        break;
                }
                return true;
            }
        });

profile
Have a good one!

0개의 댓글