[안드로이드]BottomNavigationView 하단탭 쉽게 만드는 방법 1-2

2021.12.03 - [안드로이드] - [안드로이드] BottomNavigationView 하단탭 쉽게 만드는 방법 1-1

[안드로이드] BottomNavigationView 하단탭 쉽게 만드는 방법 1-1

 

4. 메뉴화면 추가(bottom_menu.xml)

app 클릭 -> 마우스 오른쪽 -> New -> Android Resource File

 

File name은 bottom_menu,  Resource type는 Menu로 선택하면 됩니다.

res폴더 아래 menu 폴더가 자동생성되고, menu폴더 안에 bottom_menu.xml이 생성됩니다.

5. 메뉴화면(bottom_menu.xml) 화면구성

menu태그 안에 item태그 3개를 추가합니다. 각 아이템은 이전에 만든 프래그먼트와 연결이 될 것입니다.

5-1 이미지 다운로드

res -> drawable 폴더안에 넣으시면 됩니다.

ic_info.xml

0.00MB

ic_settings.xml

0.00MB

ic_home.xml

0.00MB

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <item
        android:id="@+id/home"
        android:enabled="true"
        android:icon="@drawable/ic_home"
        android:title="홈"
        app:showAsAction="always"
        />

    <item
        android:id="@+id/setting"
        android:enabled="true"
        android:icon="@drawable/ic_settings"
        android:title="설정"
        app:showAsAction="always"
        />

    <item
        android:id="@+id/info"
        android:enabled="true"
        android:icon="@drawable/ic_home"
        android:title="정보"
        app:showAsAction="always"
        />
</menu>

app:showAsAction="always" : 항상 보이게 표시

app:showAsAction="never" : 항상 overflow 에 표시

app:showAsAction="ifRoom" : 액션바에 공간이 있을경우 표시

app:showAsAction="withText" : 액션바에 아이콘과 텍스트 함께 표시

 

6. 메인화면(activity.xml) 화면구성

메인화면은 각 화면을 보여줄 FrameLayout, 하단탭인 BottomNavigationView로 구성되어 있습니다.

BottomNavigationView 속성중 app:menu에 이전에 만든 bottom_menu를 입력하면 연결이 됩니다.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical"
    tools:context=".MainActivity">

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:id="@+id/containers">

    </FrameLayout>

    <com.google.android.material.bottomnavigation.BottomNavigationView

        android:id="@+id/bottom_navigationview"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom"
        app:labelVisibilityMode="labeled"
        app:itemBackground="@color/white"
        app:menu="@menu/bottom_menu"
        />

</LinearLayout>

 

7. 메인코드(MainActivity) 기능구현

7-1 프래그먼트(화면) 선언

HomeFragment homeFragment;
InfoFragment infoFragment;
SettingFragment settingFragment;

7-2 프래그먼트 메인화면에 올리기

   초기화면은 HomeFragment으로 설정

getSupportFragmentManager().beginTransaction().replace(R.id.containers, homeFragment).commit();

7-3 BottomNavationVIew 기능구현

NavigationBarView navigationBarView = findViewById(R.id.bottom_navigationview);
navigationBarView.setOnItemSelectedListener(new NavigationBarView.OnItemSelectedListener() {
    @Override
    public boolean onNavigationItemSelected(@NonNull MenuItem item) {

        switch(item.getItemId()){
            case R.id.home:
                getSupportFragmentManager().beginTransaction().replace(R.id.containers, homeFragment).commit();
                return true;
            case R.id.setting:
                getSupportFragmentManager().beginTransaction().replace(R.id.containers, settingFragment).commit();
                return true;
            case R.id.info:
                getSupportFragmentManager().beginTransaction().replace(R.id.containers, infoFragment).commit();
                return true;
        }
        return false;
    }
});

7-4 코드 전체

import androidx.annotation.NonNull;
import androidx.appcompat.app.AppCompatActivity;
import android.os.Bundle;
import android.view.MenuItem;
import com.google.android.material.navigation.NavigationBarView;

public class MainActivity extends AppCompatActivity {

    HomeFragment homeFragment;
    InfoFragment infoFragment;
    SettingFragment settingFragment;

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

        homeFragment = new HomeFragment();
        infoFragment = new InfoFragment();
        settingFragment = new SettingFragment();

        getSupportFragmentManager().beginTransaction().replace(R.id.containers, homeFragment).commit();

        NavigationBarView navigationBarView = findViewById(R.id.bottom_navigationview);
        navigationBarView.setOnItemSelectedListener(new NavigationBarView.OnItemSelectedListener() {
            @Override
            public boolean onNavigationItemSelected(@NonNull MenuItem item) {

                switch(item.getItemId()){
                    case R.id.home:
                        getSupportFragmentManager().beginTransaction().replace(R.id.containers, homeFragment).commit();
                        return true;
                    case R.id.setting:
                        getSupportFragmentManager().beginTransaction().replace(R.id.containers, settingFragment).commit();
                        return true;
                    case R.id.info:
                        getSupportFragmentManager().beginTransaction().replace(R.id.containers, infoFragment).commit();
                        return true;
                }
                return false;
            }
        });
    }

}

 

8. 실행화면

 

2021.07.29 - [안드로이드] - [안드로이드] 텍스트뷰(TextView) 다양하게 꾸며보는 방법

[안드로이드] 텍스트뷰(TextView) 다양하게 꾸며보는 방법

2021.07.28 - [안드로이드] - [안드로이드] 자동완성 텍스트뷰 쉽게 만드는 방법

[안드로이드] 자동완성 텍스트뷰 쉽게 만드는 방법

2021.06.30 - [안드로이드] - [안드로이드] 내가 선택한 색으로 배경색 변경하는 방법

[안드로이드] 내가 선택한 색으로 배경색 변경하는 방법