【笔记】安卓使用ViewPage+Fragment实现简单的页面交互_app

ViewPage+Fragment实现简单的页面交互

文章目录 ViewPage+Fragment实现简单的页面交互前言一、ViewPage1.作用2.使用方法二、demo相关内容及代码1. 绑定ViewPager2.创建xml文件3.绑定切换页面点击事件三、创建和使用Fragment1. Fragment文件目录2.使用Fragment 四、实现效果五、参考资料

前言

如今的移动端应用大多都采用在一个页面上通过不同按钮切换页面的交互方式，为了我们开发与主流技术相接轨，所以我们尝试做出一个demo实现相当的效果。

一、ViewPage 1.作用

切换当前的 View，实现滑动切换的效果。

2.使用方法

在XML布局中加入androidx.viewpager.widget.ViewPager

 <androidx.viewpager.widget.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />

二、demo相关内容及代码 1. 绑定ViewPager

在activity_main.xml中加入ViewPager 和底端的按钮

 <androidx.viewpager.widget.ViewPager
        android:id="@+id/pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>
     <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true">
          <Button
            android:id="@+id/b1"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="主页"
            android:textSize="20dp"/>
            
     LinearLayout>

2.创建xml文件

创建四个不同页面的xml文件，用于后面切换页面。

其中，以 activity_home.xml 为例，相关代码如下：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="home"
        android:textSize="40dp"/>
LinearLayout>

3.绑定切换页面点击事件

在MainActivity.java中，调用页面的ViewPager 绑定按钮button点击事件

              @Override
    public void onClick(View view) {
            switch (view.getId()){
                case R.id.b1:
                	viewPager.setCurrentItem(0);break;
                case R.id.b2:
                    viewPager.setCurrentItem(1);break;
                case R.id.b3:
                    viewPager.setCurrentItem(2);break;
                case R.id.b4:
                    viewPager.setCurrentItem(3);break;
                default:break;
            }
    }

三、创建和使用Fragment 1. Fragment文件目录

每一个Fragment的java文件大体相同，分别负责绑定相关的xml。
以FragmentHome.java为例，其代码如下。

package com.nchu.labexer04;


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

import androidx.fragment.app.Fragment;

public class FragmentHome extends Fragment {
    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup viewGroup, Bundle save){
        View view = inflater.inflate(R.layout.activity_home,null);
        return view;
    }
}

其中： inflater.inflate(R.layout.activity_home,null);为对应的activity的xml文件。

2.使用Fragment

在MainActivity中使用Fragment
创建Fragment适配器，通过switch创建不同的fragment的实体类进行调用。

 FragmentPagerAdapter pagerAdapter= new FragmentPagerAdapter(getSupportFragmentManager()) {
            @NonNull
            @Override
            public Fragment getItem(int position) {
                Fragment fragment = null;
                switch (position){
                    case 0: fragment = new FragmentHome();break;
                    case 1: fragment = new FragmentInfo();break;
                    case 2: fragment = new FragmentNote();break;
                    case 3: fragment = new FragmentMine();break;
                    default:break;
                }
                return fragment;
            }

            @Override
            public int getCount() {
                return 4;
            }
        };