Android项目微信支付宝翻页效果总结

微信综合案例：使用ViewPager+Fragment，实现微信界面开发。

整个界面分两个部分：

1.ViewPager页面切换，加入fragment。

2.底部导航菜单

一，整体布局文件：

这段代码是一个Android布局文件的XML代码，它定义了一个使用LinearLayout作为根布局的界面，其中包含了两个主要组件：

1. androidx.viewpager.widget.ViewPager：

   • android:layout_width="match_parent"：设置ViewPager的宽度为父布局的宽度。
   • android:layout_height="match_parent"：设置ViewPager的高度为父布局的高度。
   • android:layout_weight="1"：设置ViewPager的权重为1，这意味着它会占据除BottomNavigationView之外的所有可用空间。
   • android:id="@+id/vp"：为ViewPager设置了一个ID，以便在Java代码中引用。

2. com.google.android.material.bottomnavigation.BottomNavigationView：

   • app:menu="@menu/menu"：指定了BottomNavigationView的菜单资源，这个菜单资源定义了底部导航栏的选项。
   • app:labelVisibilityMode="labeled"：设置标签的可见性模式为labeled，这意味着标签文本将显示在图标旁边。
   • android:id="@+id/nav"：为BottomNavigationView设置了一个ID，以便在Java或Kotlin代码中引用。

总结来说，这段代码定义了一个包含ViewPager和BottomNavigationView的界面布局。ViewPager用于展示可以左右滑动的页面，而BottomNavigationView提供了一个底部导航栏，允许用户在不同的页面或功能之间切换。

 二，底部导航菜单：

控件分析：
app：itemTextColor指的是导航栏文字的颜色
app:itemIconTint指的是导航栏中图片的颜色
app:iteamBackground指的是底部导航栏的背景颜色，默认是主题的颜色
app:menu指的是布局（文字和图片都写在这个里面）app:labelVisibilityMode=“labeled”.去除动画效果。

三，BottomNavigationView中添加底部菜单标题

在res下面，新建一个menu菜单文件夹，在创建一个菜单文件menu.xml

四，完善界面一

1. 创建4个fragment碎片；
2. 创建viewpager适配器，
3. 将4个fragment添加到适配器中；
4. Viewpager绑定适配器 。

微信碎片之一： 

 

这段代码定义了一个名为 weixinFragment 的类，它继承自 androidx.fragment.app.Fragment，代表了一个Android应用中的一个页面片段（Fragment）。以下是代码的具体内容总结：

1. 导入必要的包：

   • android.os.Bundle：用于存储和传递数据。
   • androidx.fragment.app.Fragment：表示一个可以嵌入到活动中的模块化段。
   • android.view.LayoutInflater：用于从XML文件中加载视图。
   • android.view.View：表示用户界面中的一个视图。
   • android.view.ViewGroup：表示可以包含其他视图的容器。

2. 类定义：

   • weixinFragment 类继承自 Fragment。

3. 构造函数：

   • public weixinFragment()：weixinFragment 的空构造函数。

4. onCreateView 方法：

   • @Override：注解表示该方法重写了父类的方法。
   • public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState)：该方法用于创建和返回 Fragment 的视图。这是 Fragment 生命周期中的关键方法之一，用于初始化和设置 Fragment 的视图。
   • inflater.inflate(R.layout.fragment_weixin, container, false)：使用 LayoutInflater 将 fragment_weixin.xml 布局文件加载为视图，并将其添加到 container 中，false 参数表示不附加到 container。

总结来说，weixinFragment 是一个 Fragment 类，它在 onCreateView 方法中加载了一个名为 fragment_weixin.xml 的布局文件，这个布局文件定义了 Fragment 的用户界面。这个 Fragment 可以在 ViewPager 中使用，并且可以通过 vpAdapter 适配器来管理。

 

微信碎片布局之一： 

 

 整个微信界面适配器：

 

这段代码是一个Android应用程序中的FragmentStatePagerAdapter的子类实现，名为vpAdapter。FragmentStatePagerAdapter是用于ViewPager的一个适配器，它允许ViewPager与Fragment协同工作，展示不同的Fragment页面。以下是代码的具体内容总结：

1. 导入必要的包：

   • androidx.annotation.NonNull：用于标记方法参数或返回值不为null。
   • androidx.fragment.app.Fragment：表示一个可以嵌入到活动中的模块化段。
   • androidx.fragment.app.FragmentManager：用于管理Fragment的生命周期。
   • androidx.fragment.app.FragmentStatePagerAdapter：一个PagerAdapter的子类，用于ViewPager，它保存了所有Fragment的状态。

2. 类定义：

   • vpAdapter类继承自FragmentStatePagerAdapter。

3. 成员变量：

   • Fragment fragment：一个Fragment类型的成员变量，用于存储当前请求的Fragment实例。

4. 构造函数：

   • public vpAdapter(@NonNull FragmentManager fm)：vpAdapter的构造函数，接收一个FragmentManager实例作为参数，并调用父类的构造函数。

5. getItem方法：

   • @NonNull：注解标记该方法返回的Fragment不为null。
   • @Override：注解表示该方法重写了父类的方法。
   • public Fragment getItem(int position)：根据ViewPager中的位置position来返回对应的Fragment实例。这里使用了switch语句来根据位置创建不同的Fragment：
     • case 0：创建并返回weixinFragment实例。
     • case 1：创建并返回tongxunFragment实例。
     • case 2：创建并返回faxianFragment实例。
     • case 3：创建并返回WoFragment实例。

6. getCount方法：

   • @Override：注解表示该方法重写了父类的方法。
   • public int getCount()：返回ViewPager中的页面数量，这里固定返回4，表示有4个Fragment页面。

总结来说，vpAdapter类是一个FragmentStatePagerAdapter的实现，用于管理4个不同的Fragment页面，并将它们与ViewPager关联起来。每个页面对应一个Fragment，通过getItem方法根据位置返回相应的Fragment实例。

五，实现ViewPager页面和底部的联动

为viewpager添加单击事件，

当页面切换时，让底部导航对应标题选中；

为底部导航添加单击事件，当选中对应标题时，

切换到对应页面。

java代码 

 

这段代码定义了一个名为 MainActivity4 的类，它继承自 androidx.appcompat.app.AppCompatActivity，是一个Android应用程序中的活动（Activity）。以下是代码的具体内容总结：

1. 导入必要的包：

   • androidx.annotation.NonNull：用于标记方法参数或返回值不为null。
   • androidx.appcompat.app.AppCompatActivity：一个方便的Activity基类，提供了对AppCompat的支持。
   • androidx.viewpager.widget.ViewPager：用于展示可以左右滑动的页面。
   • android.os.Bundle：用于存储和传递数据。
   • android.view.MenuItem：表示菜单中的一个项。
   • com.google.android.material.bottomnavigation.BottomNavigationView：底部导航视图。

2. 成员变量：

   • ViewPager vp：用于展示页面的ViewPager。
   • vpAdapter adapter：ViewPager的适配器，用于提供页面。
   • BottomNavigationView nav：底部导航视图。

3. onCreate 方法：

   • @Override：注解表示该方法重写了父类的方法。
   • protected void onCreate(Bundle savedInstanceState)：Activity的创建方法，用于初始化Activity。
   • setContentView(R.layout.activity_main4)：设置Activity的布局文件为activity_main4.xml。
   • vp = findViewById(R.id.vp)：通过ID找到布局中的ViewPager，并赋值给vp。
   • adapter = new vpAdapter(getSupportFragmentManager())：创建vpAdapter实例，并传入FragmentManager。
   • vp.setAdapter(adapter)：将适配器设置给ViewPager。
   • vp.setCurrentItem(0)：将ViewPager的当前页面设置为第一项。
   • nav = findViewById(R.id.nav)：通过ID找到布局中的BottomNavigationView，并赋值给nav。

4. ViewPager页面变化监听器：

   • vp.addOnPageChangeListener：为ViewPager添加页面变化监听器。
   • onPageScrolled、onPageSelected、onPageScrollStateChanged：分别处理页面滚动、选中和状态变化的事件。在onPageSelected中，根据当前页面位置设置底部导航项为选中状态。

5. BottomNavigationView导航项选择监听器：

   • nav.setOnNavigationItemSelectedListener：为BottomNavigationView设置导航项选择监听器。
   • onNavigationItemSelected：处理导航项选择事件，根据选择的项ID，使用vp.setCurrentItem方法切换ViewPager的页面。

总结来说，MainActivity4 是一个包含ViewPager和BottomNavigationView的Activity。它在创建时初始化这两个组件，设置适配器，并添加页面变化监听器和导航项选择监听器，以实现页面滑动和底部导航的联动效果。当用户滑动页面或选择不同的导航项时，ViewPager的页面和底部导航的选中状态会相应地更新。

总的效果如图：