Android 에 서 는 RadioGroup 과 Fragment 를 사용 하여 아래쪽 탐색 표시 줄 기능 을 수행 합 니 다.

일부 쇼핑 몰 에서 이런 효 과 를 자주 볼 수 있 는데 효과 도 는 다음 과 같다.
효과 도 를 먼저 보다

단계 1:
메 인 인터페이스 main.xml 생 성 완료:

<?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:id="@+id/fragment_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignParentTop="true"
        />

    <RadioGroup
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/rg_group"
        android:layout_alignParentBottom="true"
        android:orientation="horizontal"
        >
        <RadioButton
            android:id="@+id/rb_home"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:button="@null"
            style="@style/fragment"
            android:drawableTop="@drawable/rb_home_selector"
            android:text="  "
            />
        <RadioButton
            android:id="@+id/rb_discover"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:button="@null"
            style="@style/fragment"
            android:drawableTop="@drawable/rb_discover_selector"
            android:text="  "
            />
        <RadioButton
            android:id="@+id/rb_cart"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:button="@null"
            style="@style/fragment"
            android:drawableTop="@drawable/rb_cart_selector"
            android:text="   "
            />
        <RadioButton
            android:id="@+id/rb_user"
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:layout_weight="1"
            android:button="@null"
            style="@style/fragment"
            android:drawableTop="@drawable/rb_user_selector"
            android:text="  "
            />
    </RadioGroup>
</RelativeLayout>

radio Button 에서 중복 사용 되 는 스타일:스타일 에 추출 되 어 적 혀 있 습 니 다.

<style name="fragment">
        <item name="android:layout_width">match_parent</item>
        <item name="android:layout_height">match_parent</item>
        <item name="android:padding">5dp</item>
        <item name="android:gravity">center</item>
        <item name="android:textColor">@drawable/rb_text_color</item>
        <item name="android:textSize">16sp</item>
        <item name="android:textStyle">normal</item>
    </style>

RadioButton 을 누 르 면 네 비게 이 션 표시 줄 의 텍스트 색상 이 바 뀌 었 습 니 다.drawable 에 설명 되 어 있 습 니 다.
이름:rbtext_컬러 코드 는 다음 과 같 습 니 다:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_selected="true" android:color="#FF0000"/>
    <item android:color="#808080"/>
</selector>

내 비게 이 션 표시 줄 아이콘 이 바 뀌 었 습 니 다.여 기 는 그 중 하나만 쓰 고 나머지 세 개 는 기본적으로 같 습 니 다.

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:drawable="@drawable/icon_cartfill_press" android:state_selected="true" />
    <item android:drawable="@drawable/icon_cart" />
</selector>

이 기본 적 인 절 차 를 마 친 후에 Fragment 의 레이아웃 을 써 야 합 니 다.

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center">

    <TextView
        android:id="@+id/tv_cart"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="   "
        android:textSize="30sp" />
</LinearLayout>

그 중 하 나 를 쓰 고 다른 세 가 지 는 유사 하 다.
그 다음 배경 코드 에 Fragment 를 만 들 었 습 니 다.여기 도 CartFragment 라 고 쓰 여 있 습 니 다.

package com.example.fragmentdemo;

import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;

import androidx.annotation.NonNull;
import androidx.annotation.Nullable;
import androidx.fragment.app.Fragment;

public class CartFragment extends Fragment {
    private View view;
    private TextView tv_home;

    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        if (view==null){
            view = inflater.inflate(R.layout.cart_fragment,container,false);
        }
        return view;
    }
}

STEP 2:MainActivity 에서 fragment 전환 기능 완료
구체 적 인 설명 은 코드 에 있 습 니 다.

package com.example.fragmentdemo;

import androidx.appcompat.app.AppCompatActivity;
import androidx.fragment.app.Fragment;
import androidx.fragment.app.FragmentManager;
import androidx.fragment.app.FragmentTransaction;

import android.os.Bundle;
import android.util.Log;
import android.view.View;
import android.widget.RadioButton;
import android.widget.RadioGroup;

import java.time.LocalDate;
import java.util.ArrayList;
import java.util.List;

public class MainActivity extends AppCompatActivity implements RadioGroup.OnCheckedChangeListener {

    private RadioButton rb_home,rb_discover,rb_cart,rb_user;
    private RadioGroup rg_group;
    private List<Fragment> fragments;
    private int position=0;
    private static final String TAG = "MainActivity";

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

        rb_home=findViewById(R.id.rb_home);
        rb_discover=findViewById(R.id.rb_discover);
        rb_cart=findViewById(R.id.rb_cart);
        rb_user=findViewById(R.id.rb_user);
        rg_group=findViewById(R.id.rg_group);

        //       
        rb_home.setSelected(true);


        rg_group.setOnCheckedChangeListener(this);

        //   fragment
        initFragment();

        //    ，    
        defaultFragment();
    }

    private void defaultFragment() {
        FragmentManager fragmentManager = getSupportFragmentManager();
        FragmentTransaction transaction = fragmentManager.beginTransaction();
        transaction.replace(R.id.fragment_layout,fragments.get(0));
        transaction.commit();
    }

    private void setSelected() {
        rb_home.setSelected(false);
        rb_discover.setSelected(false);
        rb_cart.setSelected(false);
        rb_user.setSelected(false);
    }

    private void initFragment() {
        fragments = new ArrayList<>();
        fragments.add(0,new HomeFragment());
        fragments.add(1,new DiscoverFragment());
        fragments.add(2,new CartFragment());
        fragments.add(3,new UserFragment());


    }

    @Override
    public void onCheckedChanged(RadioGroup group, int i) {
        //  fragment     
        FragmentManager fragmentManager = getSupportFragmentManager();
        //  fragmentManager    
        FragmentTransaction transaction = fragmentManager.beginTransaction();
        switch (i){
            case R.id.rb_home:
                position=0;
                //  replace  ， fragment,   fragment_layout  id  UI，         
                //    replace    ，          ，             
                // commit()  
                transaction.replace(R.id.fragment_layout,fragments.get(0));
                //           
                setSelected();
                rb_home.setSelected(true);
                break;
            case R.id.rb_discover:
                position=1;
                transaction.replace(R.id.fragment_layout,fragments.get(1));
                //           
                setSelected();
                rb_discover.setSelected(true);
                break;
            case R.id.rb_cart:
                position=2;
                transaction.replace(R.id.fragment_layout,fragments.get(2));
                //           
                setSelected();
                rb_cart.setSelected(true);
                break;
            case R.id.rb_user:
                position=3;
                transaction.replace(R.id.fragment_layout,fragments.get(3));
                //           
                setSelected();
                rb_user.setSelected(true);
                break;
        }
        //     
        transaction.commit();
    }
}

이렇게 하면 간단 한 아래쪽 네 비게 이 션 표시 줄 기능 이 완 성 됩 니 다.이것 은 클릭 을 통 해 fragment 를 전환 할 수 있 을 뿐 좌우 미끄럼 을 통 해 fragment 를 전환 할 수 없습니다.
이상 은 안 드 로 이 드 에서 RadioGroup+Fragment 를 사용 하여 밑 에 있 는 네 비게 이 션 표시 줄 의 기능 을 실현 하 는 상세 한 내용 입 니 다.안 드 로 이 드 밑 에 있 는 네 비게 이 션 표시 줄 에 대한 자 료 는 다른 관련 글 을 주목 하 세 요!