Android UI基础——ViewPager+Fragment
来源:互联网 发布:含有大数据的新闻 编辑:程序博客网 时间:2024/05/13 09:25
ViewPager
ViewPager是一个允许用户左右滑动翻页显示数据的控件,想要在界面显示数据就需要使用PagerAdapter去加载数据了,这边的数据先设置为几张图片,让其滑动显示,具体代码如下:
布局中的代码(ViewPager是Android的支持包supportv4包中的控件,必须写全称
):
<RelativeLayout 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" android:background="#000" tools:context="com.example.change.myviewpaper.MainActivity"> <android.support.v4.view.ViewPager android:id="@+id/main_view_pager" android:layout_width="wrap_content" android:layout_height="wrap_content"> </android.support.v4.view.ViewPager></RelativeLayout>
设置适配器,将页面适配到ViewPager,使用PagerAdapter必须实现四个方法:
①instantiateItem(ViewGroup, int):添加一个页面到ViewPager指定位置
②destroyItem(ViewGroup, int, Object):销毁指定位置页面
③getCount():得到页面数量
④isViewFromObject(View, Object):判断页面是否来自一个对象,这里返回view==object
public class MyAdapter extends PagerAdapter{ private Context mContext; private List<ImageView> list; public MyAdapter(Context mContext, List<ImageView> list) { this.mContext = mContext; this.list = list; } @Override public int getCount() { return list.size(); } @Override public boolean isViewFromObject(View view, Object object) { return view == object; } @Override public void destroyItem(ViewGroup container, int position, Object object) { container.removeView(list.get(position)); } @Override public Object instantiateItem(ViewGroup container, int position) { container.addView(list.get(position)); return list.get(position); }}
在类中实现的代码:
public class MainActivity extends AppCompatActivity { private List<ImageView> list; private ViewPager mViewPager; private int[] image = {R.mipmap.view,R.mipmap.view_1,R.mipmap.view_2,R.mipmap.view_3}; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); mViewPager = (ViewPager) findViewById(R.id.main_view_pager); list = new ArrayList<>(); for (int i = 0; i < image.length; i++) { ImageView imageView = new ImageView(this); imageView.setImageResource(image[i]); list.add(imageView); } //添加适配器 MyAdapter adapter = new MyAdapter(this,list); mViewPager.setAdapter(adapter); }}
效果图如下:
Fragment
ViewPager经常会和Fragment一起使用,这样会更方便的让我们去操作要滑动的界面。
Fragment是Android 3.0引入新的API,Fragment代表了Activity的子模块,必须“嵌入”Activity中使用,因此,虽然Fragment有自己的生命周期,但也受Activity的生命周期控制,想要在Activity中使用Fragment,可调用FragmentManager的add(),remove(),replace()方法动态的添加,删除或者替换Fragment。
接下来的例子实现的是既可以通过滑动到下一个页面,也可以使用Button跳转到下一个页面。具体代码如下:
布局中的代码(运用FrameLayout布局就可以看出Fragment的切换其实是覆盖):
<RelativeLayout 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" android:background="#000" tools:context="com.example.myfragmentviewpager.MainActivity"> <FrameLayout android:id="@+id/layout_frame" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_above="@+id/line_layout"> <android.support.v4.view.ViewPager android:id="@+id/fragment_view_pager" android:layout_width="wrap_content" android:layout_height="wrap_content"> </android.support.v4.view.ViewPager> </FrameLayout> <LinearLayout android:id="@+id/line_layout" android:layout_width="match_parent" android:layout_height="wrap_content" android:layout_alignParentBottom="true" android:weightSum="3"> <Button android:id="@+id/first_button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="First" android:layout_weight="1" android:background="@drawable/change_button_color"/> <Button android:id="@+id/sec_button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Second" android:layout_weight="1" android:background="@drawable/change_button_color"/> <Button android:id="@+id/third_button" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="Third" android:layout_weight="1" android:background="@drawable/change_button_color"/> </LinearLayout></RelativeLayout>
本例中要展示三个页面,所以写了三个Fragment,这里只写出其中一个的代码,因为只是简单地展示,所以在Fragment中只放置了ImageView,想要显示其他数据可以自行添加,代码如下:
public class FragmentFirst extends Fragment{ private ImageView imageView; @Nullable @Override public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) { View view = inflater.inflate(R.layout.fragment_1,null);//此处布局中只放置了一个ImageView,布局代码不再展示 imageView = (ImageView) view.findViewById(R.id.first_image); imageView.setImageResource(R.mipmap.view_1); return view; }}
设置适配器,这里不再是继承PagerAdapter,而是继承FragmentPagerAdapter,然后重写两个方法getItem()和getCount()以及一个构造方法,参数是FragmentManager和自己添加的一个List集合。代码如下:
public class MyFragmentAdapter extends FragmentPagerAdapter{ private List<Fragment>list;//泛型设置为Fragment public MyFragmentAdapter(FragmentManager fm,List<Fragment> list) { super(fm); this.list = list; } @Override public Fragment getItem(int position) { return list.get(position); } @Override public int getCount() { return list.size(); }}
最后在类中实现ViewPager的滑动,添加适配器,Button的点击事件等,代码如下:
public class MainActivity extends AppCompatActivity implements View.OnClickListener { private Button mButton1,mButton2,mButton3; private List<Fragment> list; private ViewPager mViewPager; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); mViewPager = (ViewPager) findViewById(R.id.fragment_view_pager); //ViewPager的滑动监听器,这边主要作用是实现滑动和Button的点击同步 mViewPager.setOnPageChangeListener(new ViewPager.OnPageChangeListener() { @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { //滑动时的页面选择 switch (position){ //滑动到第一个页面时,让第一个Button处于点击状态,不能再进行点击 case 0: mButton1.setEnabled(false); mButton2.setEnabled(true); mButton3.setEnabled(true); break; case 1: mButton1.setEnabled(true); mButton2.setEnabled(false); mButton3.setEnabled(true); break; case 2: mButton1.setEnabled(true); mButton2.setEnabled(true); mButton3.setEnabled(false); break; } } @Override public void onPageSelected(int position) {} @Override public void onPageScrollStateChanged(int state) {} }); list = new ArrayList<>(); list.add(new FragmentFirst()); list.add(new FragmentSec()); list.add(new FragmentThird()); //添加适配器 MyFragmentAdapter adapter = new MyFragmentAdapter(getSupportFragmentManager(),list); mViewPager.setAdapter(adapter); mButton1 = (Button) findViewById(R.id.first_button); mButton2 = (Button) findViewById(R.id.sec_button); mButton3 = (Button) findViewById(R.id.third_button); mButton1.setOnClickListener(this); mButton2.setOnClickListener(this); mButton3.setOnClickListener(this); } @Override public void onClick(View v) { FragmentTransaction transaction; switch (v.getId()){ case R.id.first_button: //当第一个Button点击时,ViewPager分配第一个页面给第一个Button mViewPager.setCurrentItem(0); mButton1.setEnabled(false); mButton2.setEnabled(true); mButton3.setEnabled(true); break; case R.id.sec_button: mViewPager.setCurrentItem(1); mButton1.setEnabled(true); mButton2.setEnabled(false); mButton3.setEnabled(true); break; case R.id.third_button: mViewPager.setCurrentItem(2); mButton1.setEnabled(true); mButton2.setEnabled(true); mButton3.setEnabled(false); break; } }}
效果如下:
- Android UI基础——ViewPager+Fragment
- 0906Android基础ViewPager+Fragment
- android基础---ViewPager与fragment
- Android流行UI布局——底部导航(BottomNavigationView+ViewPager+Fragment)
- Android流行UI布局——底部导航(BottomNavigationView+ViewPager+Fragment)
- Android流行UI布局——底部导航(BottomNavigationView+ViewPager+Fragment)
- Android——ViewPager+RadioGroup+Fragment
- Android——ViewPager+Fragment+ListView之间
- Android基础—Fragment
- Android基础之Fragment Viewpager篇
- android基础学习之fragment+viewpager+fragment事件听
- Android UI 基础之ViewPager的使用
- Android基础UI之ViewPager禁止滑动
- Android UI 详解之ActionBar+ViewPager+Fragment 实现滑动Tab
- Android流行UI布局:底部导航(BottomNavigationView+ViewPager+Fragment)
- Android流行UI布局 BottomNavigationView+ViewPager+Fragment的使用
- Android UI编程(7)——Fragment
- Android Fragment——添加一个没有UI的Fragment
- Word Search
- 抽象工厂模式
- QT的Paint 系统
- A+B Problem III
- 转发和重定向
- Android UI基础——ViewPager+Fragment
- C++ this指针
- VS2015如何自定义类模板、我的模板——原来这么简单!
- C++ 为什么模板只能在头文件中实现?
- html知识点总结积累
- Activity表示层
- C/C++语法注意点
- Android完美解决输入框EditText隐藏密码打勾显示密码问题
- 面试经验