ViewPager
来源:互联网 发布:网络悲伤情歌 编辑:程序博客网 时间:2024/06/03 18:28
应用到的知识点为
ViewPager控件
ViewPager的适配器:PagerAdapter(可新建一个class继承或者直接用)
ViewPager监听接口:OnPageChangeListener
(一般重写onPageSelected(int position) 方法,该方法为切换ViewPager时的回调。)
简单版
先创建3个Layout
activity_main
<?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:orientation="vertical" > </LinearLayout> <android.support.v4.view.ViewPager android:id="@+id/viewpage" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_gravity="center" android:layout_weight="1.0" android:flipInterval="30" android:persistentDrawingCache="animation" /></LinearLayout>
接下来的两个layout则是将要切换的两个布局文件(将通过PagerAdapter放入PagerView)
colorView
<?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:background="#000000"></LinearLayout>
Layout2
<?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:background="#ffff00" ></LinearLayout>
接下来是MainActivity
public class MainActivity extends AppCompatActivity { private View view1, view2; private ViewPager viewPager; private TextView textView1, textView2; private PagerAdapter pagerAdapter; private List<View> viewList = new ArrayList<>(); //创建一个ArrayList用来保存要切换的View @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); viewPager = (ViewPager) findViewById(R.id.viewpage); LayoutInflater inflater = getLayoutInflater(); view1 = inflater.inflate(R.layout.layout, null); view2 = inflater.inflate(R.layout.layout2, null); viewList.add(view1); viewList.add(view2); //将两个布局文件放进ArrayList中 //创建一个 PagerAdapter 并将其与viewList绑定(也可以创建一个类并继承PagerAdapter) pagerAdapter = new PagerAdapter() { @Override public int getCount() { return viewList.size(); } @Override public boolean isViewFromObject(View view, Object object) { return view == object; } //移除当前容器上的布局文件(切换为其他页面) @Override public void destroyItem(ViewGroup container, int position, Object object) { container.removeView(viewList.get(position)); } //为当前容器添加布局文件(即想要显示的布局文件) @Override public Object instantiateItem(ViewGroup container, int position) { container.addView(viewList.get(position)); return viewList.get(position); } }; //将 pagerAdapter与 viewPager绑定 viewPager.setAdapter(pagerAdapter); }}
以上实现了通过滑屏切换View的功能。图片大致如下:
进阶
1.应用ViewPager监听接口:OnPageChangeListener
2.用按钮控制ViewPager
3.将其中一个View设为ListView
还是创建三个Layout
main_activity
<?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:orientation="vertical" > <LinearLayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_gravity="center_horizontal" > <TextView android:id="@+id/textView" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/offlinearrow_tab1_pressed" android:paddingBottom="10dp" android:paddingLeft="20dp" android:paddingRight="20dp" android:paddingTop="10dp" android:text="可下载" /> <TextView android:id="@+id/textView2" android:layout_width="wrap_content" android:layout_height="wrap_content" android:background="@drawable/offlinearrow_tab2_normal" android:paddingBottom="10dp" android:paddingLeft="20dp" android:paddingRight="20dp" android:paddingTop="10dp" android:text="已下载" /> </LinearLayout> <android.support.v4.view.ViewPager android:id="@+id/viewpage" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_gravity="center" android:layout_weight="1.0" android:flipInterval="30" android:persistentDrawingCache="animation" /></LinearLayout>
添加了两个TextView用于两个View切换时的标志
两个切换的View
color_view
<?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:background="#000000"></LinearLayout>
list_view
<?xml version="1.0" encoding="utf-8"?><ListView xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/download" android:layout_width="match_parent" android:layout_height="match_parent" android:background="@drawable/offline_common_bar_bg" ></ListView>
以及ListView的Item_布局文件:
Item
<?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"> <TextView android:id="@+id/show" android:layout_width="wrap_content" android:layout_height="wrap_content" /></LinearLayout>
MyMyPageAdapter继承 PagerAdapter
public class MyPageAdapter extends PagerAdapter{ View listView,colorView; //两个View:一个ListView,另一个则是和上文一样的纯颜色布局文件 ViewPager viewPager; //声明一个ViewPager public MyPageAdapter(View listView, View colorView, ViewPager viewPager) { this.listView = listView; this.colorView = colorView; this.viewPager = viewPager; } @Override public int getCount() { return 2; } @Override public boolean isViewFromObject(View view, Object object) { return view == object; } @Override public void destroyItem(ViewGroup container, int position, Object object) { if (position == 0){ viewPager.removeView(listView); }else{ viewPager.removeView(colorView); } } @Override public Object instantiateItem(ViewGroup container, int position) { if (position ==0){ viewPager.addView(listView); return listView; }else { viewPager.addView(colorView); return colorView; } } @Override public void restoreState(Parcelable arg0, ClassLoader arg1) { } @Override public Parcelable saveState() { return null; } @Override public void startUpdate(View arg0) { }}
MainActivity
public class MainActivity extends AppCompatActivity implements View.OnClickListener,ViewPager.OnPageChangeListener{ private View colorView; private ListView listView; private ViewPager viewPager; private MyPageAdapter pagerAdapter; private TextView textView1, textView2; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); initViewAndMyPageAdapter(); /* *初始化将要显示View,并将其通过适配器与ViewPager绑定 */ initListViewAndAdapter(); /* *初始化ListV并为其绑定适配器及数据源 */ initTextView(); /* *初始化TextView并为其添加点击监听事件 */ } private void initTextView() { textView1 = (TextView) findViewById(R.id.textView); textView2 = (TextView) findViewById(R.id.textView2); textView1.setOnClickListener(this); textView2.setOnClickListener(this); } private void initListViewAndAdapter() { ArrayList<String> list = new ArrayList<>(); list.add("java"); list.add("C++"); list.add("JavaScript"); ArrayAdapter<String> adapter = new ArrayAdapter<>(MainActivity.this, android.R.layout.simple_list_item_1, list); // 给ListView设置数据适配器 listView.setAdapter(adapter); } private void initViewAndMyPageAdapter() { LayoutInflater inflater = getLayoutInflater(); colorView = inflater.inflate(R.layout.color_view, null); listView =(ListView) LayoutInflater.from( MainActivity.this).inflate( R.layout.list_view, null); /* 初始化两个布局文件 */ viewPager = (ViewPager) findViewById(R.id.viewpage); viewPager.setOnPageChangeListener(this); pagerAdapter = new MyPageAdapter(listView,colorView,viewPager); viewPager.setAdapter(pagerAdapter); /* * 初始话viewPager并为其添加监听事件; * 初始化pagerAdapter,并将其与viewPager绑定。 */ } @Override public void onClick(View v) { if (v.equals(textView1)) { changeTextViewStatus(0); viewPager.setCurrentItem(0); } else if(v.equals(textView2)){ changeTextViewStatus(1); viewPager.setCurrentItem(1); } pagerAdapter.notifyDataSetChanged(); } @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) {} @Override public void onPageSelected(int position) { changeTextViewStatus(position); } @Override public void onPageScrollStateChanged(int state) { } /* *根据当前Pager显示的界面,修改TextView的背景图片 */ public void changeTextViewStatus(int positionOfPager){ int paddingHorizontal = textView1.getPaddingLeft(); int paddingVertical = textView2.getPaddingTop(); switch (positionOfPager) { case 0: textView1 .setBackgroundResource(R.drawable.offlinearrow_tab1_pressed); textView2 .setBackgroundResource(R.drawable.offlinearrow_tab2_normal); break; case 1: textView1 .setBackgroundResource(R.drawable.offlinearrow_tab1_normal); textView2 .setBackgroundResource(R.drawable.offlinearrow_tab2_pressed); break; } /* *让textView的内容保持原来的间距 */ textView1.setPadding(paddingHorizontal, paddingVertical, paddingHorizontal, paddingVertical); textView2.setPadding(paddingHorizontal, paddingVertical, paddingHorizontal, paddingVertical); }}
效果大致如图:
阅读全文
0 0
- Viewpager
- ViewPager
- ViewPager
- ViewPager
- ViewPager
- ViewPager
- viewpager
- ViewPager
- ViewPager
- ViewPager
- Viewpager
- viewpager
- ViewPager
- ViewPager
- ViewPager
- viewpager
- ViewPager
- ViewPager
- 基于dvwa的sql注入,使用fiddler修改请求参数
- String StringBuffer StringBuilder
- SDUT 2017 Autumn Single Contest O 周六场个人赛
- Java面向对象的五大原则
- 求a,b最大公约数的最快算法
- ViewPager
- Redis
- 使用shell 脚本递归删除项目中的所有源文件的行注释
- Dev ButtonEdit控件
- ubuntu配置nginx和php5.6
- Heroku+Wordpress
- eclipse修改复制web项目部署名字
- 智能蛇的学习心得
- utils/pkg_list_update.py