Android- fragment结合ViewPager实现左右滑动

Posted 2022-01-29 yzhSWJ

定义底部导航栏xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="55dp"
    android:background="@color/purple_200"
    >
     <LinearLayout
         android:layout_width="0dp"
         android:layout_height="match_parent"
         android:layout_weight="1"
         android:layout_gravity="center"
         android:gravity="center"
         android:orientation="vertical"
         android:id="@+id/but1">
         <ImageView
             android:layout_width="32dp"
             android:layout_height="32dp"
             android:id="@+id/img1"
             android:background="@drawable/buttondemo"
             />
         <TextView
             android:layout_width="32dp"
             android:layout_height="match_parent"
             android:gravity="center"
             android:text="第一"
             android:id="@+id/text1"
             />
     </LinearLayout>
    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:layout_gravity="center"
        android:gravity="center"
        android:orientation="vertical"
        android:id="@+id/but2">
        <ImageView
            android:layout_width="32dp"
            android:layout_height="32dp"
            android:id="@+id/img2"
            android:background="@drawable/button3"
            />
        <TextView
            android:layout_width="32dp"
            android:layout_height="match_parent"
            android:gravity="center"
            android:text="第二"
            android:id="@+id/text2"
            />
    </LinearLayout>
    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:layout_gravity="center"
        android:orientation="vertical"
        android:gravity="center"
        android:id="@+id/but3">
        <ImageView
            android:layout_width="32dp"
            android:layout_height="32dp"
            android:id="@+id/img3"
            android:background="@drawable/button2"
            />
        <TextView
            android:layout_width="32dp"
            android:layout_height="match_parent"
            android:gravity="center"
            android:text="第三"
            android:id="@+id/text3"
            />
    </LinearLayout>
    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:gravity="center"
        android:layout_gravity="center"
        android:orientation="vertical"
        android:id="@+id/but4">
        <ImageView
            android:layout_width="32dp"
            android:layout_height="32dp"
            android:id="@+id/img4"
            android:background="@drawable/buttondemo"
            />
        <TextView
            android:layout_width="32dp"
            android:layout_height="match_parent"
            android:gravity="center"
            android:text="第四"
            android:id="@+id/text4"
            />
    </LinearLayout>
</LinearLayout>

导航按钮选中不选中切换xml

 

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <!--选中-->
    <item android:drawable="@drawable/ic_baseline_gx" android:state_selected="true"/>
    <!--不选中-->
    <item android:drawable="@drawable/ic_baseline_x"/>
</selector>

创建fragment类 会自动生成 xml

package com.example.myapplication;

import android.os.Bundle;

import androidx.fragment.app.Fragment;
import androidx.viewpager2.widget.ViewPager2;

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


public class BlankFragment extends Fragment 

    private static final String ARG_PARAM1 = "param1";

    private String mParam1;
    private View view;

    public BlankFragment() 
        // Required empty public constructor
    
    
    public static BlankFragment newInstance(String param1) 
        BlankFragment fragment = new BlankFragment();
        Bundle args = new Bundle();
        args.putString(ARG_PARAM1, param1);
        fragment.setArguments(args);
        return fragment;
    

    @Override
    public void onCreate(Bundle savedInstanceState) 
        super.onCreate(savedInstanceState);
        if (getArguments() != null) 
            mParam1 = getArguments().getString(ARG_PARAM1);

        
    

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container,
                             Bundle savedInstanceState) 
        if (view == null) 
            view = inflater.inflate(R.layout.fragment_blank, container, false);
        
        initView();
        return view;
    

    private void initView() 
        TextView textView = view.findViewById(R.id.test01);
        textView.setText(mParam1);

    

生成定义 fragment xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".BlankFragment">

    <TextView
        android:id="@+id/test01"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:text="@string/hello_blank_fragment"
        android:textSize="30dp" />

</FrameLayout>

viewPager2 需要的适配器

package com.example.myapplication;
import androidx.annotation.NonNull;
import androidx.fragment.app.Fragment;
import androidx.fragment.app.FragmentManager;
import androidx.lifecycle.Lifecycle;
import androidx.viewpager2.adapter.FragmentStateAdapter;

import java.util.ArrayList;
import java.util.List;

public class MyFragmentAdapter extends FragmentStateAdapter 
    private List<Fragment> fragmentList = new ArrayList<>();
    public MyFragmentAdapter(@NonNull FragmentManager fragmentManager, @NonNull Lifecycle lifecycle,List<Fragment> fragments) 
        super(fragmentManager, lifecycle);
        this.fragmentList = fragments;
    

    @NonNull
    @Override
    public Fragment createFragment(int position) 
       //获取fragment
        return fragmentList.get(position);
    
    //总页数
    @Override
    public int getItemCount() 
        return fragmentList.size();
    

mianActivity

package com.example.myapplication;

import android.os.Bundle;
import android.text.Layout;
import android.view.MotionEvent;
import android.view.View;
import android.widget.Button;
import android.widget.FrameLayout;
import android.widget.ImageView;
import android.widget.LinearLayout;

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

import androidx.appcompat.app.AppCompatActivity;
import androidx.fragment.app.Fragment;
import androidx.navigation.NavController;
import androidx.navigation.Navigation;
import androidx.navigation.ui.AppBarConfiguration;
import androidx.navigation.ui.NavigationUI;
import androidx.recyclerview.widget.RecyclerView;
import androidx.viewpager2.widget.ViewPager2;

import java.util.ArrayList;
import java.util.List;
import java.util.stream.Collectors;
/**
 * 继承点击事件 View.OnClickListener
 * 事件监听
 */
 
public class MainActivity extends AppCompatActivity implements View.OnClickListener 
    ViewPager2 viewPager2;
    private LinearLayout l1, l2, l3, l4;
    private ImageView i1, i2, i3, i4, iCurrent;

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

    

    private void initTableView() 
        l1 = findViewById(R.id.but1);
        //监听组件点击事件
        l1.setOnClickListener(this);
        l2 = findViewById(R.id.but2);
        l2.setOnClickListener(this);
        l3 = findViewById(R.id.but3);
        l3.setOnClickListener(this);
        l4 = findViewById(R.id.but4);
        l4.setOnClickListener(this);

        i1 = findViewById(R.id.img1);
        i2 = findViewById(R.id.img2);
        i3 = findViewById(R.id.img3);
        i4 = findViewById(R.id.img4);
        //默认第一个选中
        i1.setSelected(true);
        //记录当前选中按钮
        iCurrent = i1;
        
    

    private void initPager() 
        viewPager2 = findViewById(R.id.view_page1);
        List<Fragment> fragments = new ArrayList<>();
        /*fragment填充内容*/
        fragments.add(BlankFragment.newInstance("第一页"));
        fragments.add(BlankFragment.newInstance("第二页"));
        fragments.add(BlankFragment.newInstance("第三页"));
        fragments.add(BlankFragment.newInstance("第四页"));
        fragments.add(BlankFragment.newInstance("第五页"));
        fragments.add(BlankFragment.newInstance("第六页"));

        MyFragmentAdapter fragmentAdapter = new MyFragmentAdapter(getSupportFragmentManager(), getLifecycle(), fragments);
        viewPager2.setAdapter(fragmentAdapter);
        //回调函数,详情百度
        viewPager2.registerOnPageChangeCallback(new ViewPager2.OnPageChangeCallback() 
            @Override
            public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) 
                super.onPageScrolled(position, positionOffset, positionOffsetPixels);
            
            //每次滑动会调用
            @Override
            public void onPageSelected(int position) 
                super.onPageSelected(position);
                changeTable(position);
            


            @Override
            public void onPageScrollStateChanged(int state) 
                super.onPageScrollStateChanged(state);
            
        );

    

    private void changeTable(int position) 
        iCurrent.setSelected(false);
        switch (position) 
            //跳转到指定pageView
            case R.id.but1:
                viewPager2.setCurrentItem(0);
                break;
            case R.id.but2:
                viewPager2.setCurrentItem(1);
                break;
            case R.id.but3:
                viewPager2.setCurrentItem(2);
                break;
            case R.id.but4:
                viewPager2.setCurrentItem(3);
                break;
                //按钮变色
            case 0:
                i1.setSelected(true);
                iCurrent = i1;
                break;
            case 1:
                i2.setSelected(true);
                iCurrent = i2;
                break;
            case 2:
                i3.setSelected(true);
                iCurrent = i3;
                break;
            case 3:
                i4.setSelected(true);
                iCurrent = i4;
                break;
            default:

        
    

    //点击事件
    @Override
    public void onClick(View v) 
        changeTable(v.getId());
    

activity_main.xml

<?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"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    <androidx.viewpager2.widget.ViewPager2
        android:id="@+id/view_page1"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />
     <!--引入组件-->
    <include layout="@layout/button_layout" />


</LinearLayout>