• ViewPager,模仿慕课网


    源码:http://pan.baidu.com/s/1DhM14

    使用fragment实现的:http://pan.baidu.com/s/1mgzWlM4

    SecondActivity.java

      1 package com.imooc.tab01;
      2 
      3 import java.util.ArrayList;
      4 import java.util.List;
      5 
      6 import android.app.Activity;
      7 import android.os.Bundle;
      8 import android.support.v4.view.PagerAdapter;
      9 import android.support.v4.view.ViewPager;
     10 import android.support.v4.view.ViewPager.OnPageChangeListener;
     11 import android.view.LayoutInflater;
     12 import android.view.View;
     13 import android.view.View.OnClickListener;
     14 import android.view.ViewGroup;
     15 import android.widget.ImageButton;
     16 import android.widget.LinearLayout;
     17 import android.widget.Toast;
     18 
     19 public class SecondActivity extends Activity implements OnClickListener{
     20     List<View> mViews = new ArrayList<View>();
     21     PagerAdapter adapter;
     22     ViewPager vp;
     23     
     24     private ImageButton mWeixinImg;
     25     private ImageButton mFrdImg;
     26     private ImageButton mAddressImg;
     27     private ImageButton mSettingImg;
     28     
     29     //tabs
     30     private LinearLayout mTabWeixin;
     31     private LinearLayout mTabFrd;
     32     private LinearLayout mTabAddress;
     33     private LinearLayout mTabSetting;
     34     
     35     @Override
     36     protected void onCreate(Bundle savedInstanceState) {
     37         // TODO Auto-generated method stub
     38         super.onCreate(savedInstanceState);
     39         setContentView(R.layout.main2);
     40         //LinearLayout,并且设置onClick()监听
     41         mTabWeixin = (LinearLayout) findViewById(R.id.id_tab_weixin2);
     42         mTabFrd = (LinearLayout) findViewById(R.id.id_tab_frd2);
     43         mTabAddress = (LinearLayout) findViewById(R.id.id_tab_address2);
     44         mTabSetting = (LinearLayout) findViewById(R.id.id_tab_settings2);
     45         mTabWeixin.setOnClickListener(this);
     46         mTabFrd.setOnClickListener(this);
     47         mTabAddress.setOnClickListener(this);
     48         mTabSetting.setOnClickListener(this);
     49         
     50         //ImageButton
     51         mWeixinImg = (ImageButton) findViewById(R.id.id_imgbtn_wx);
     52         mFrdImg = (ImageButton) findViewById(R.id.id_imgbtn_py);
     53         mAddressImg = (ImageButton) findViewById(R.id.id_imgbtn_txl);
     54         mSettingImg = (ImageButton) findViewById(R.id.id_imgbtn_sz);
     55         /*
     56          * 用来把layout布局转换为view对象,并且把view放到List里,这个泛型为View的List在new PagerAdapter的时候,
     57          * 其内部的instantiateItem()方法要用到
     58          */
     59         LayoutInflater inflater = LayoutInflater.from(this);
     60         View v1 = inflater.inflate(R.layout.tab1, null);
     61         View v2 = inflater.inflate(R.layout.tab2, null);
     62         View v3 = inflater.inflate(R.layout.tab3, null);
     63         View v4 = inflater.inflate(R.layout.tab4, null);
     64         //步骤1 
     65         mViews.add(v1);
     66         mViews.add(v2);
     67         mViews.add(v3);
     68         mViews.add(v4);
     69         vp = (ViewPager) findViewById(R.id.id_viewpager2);
     70         //步骤2
     71         adapter = new PagerAdapter() {
     72 
     73             @Override
     74             public Object instantiateItem(ViewGroup container, int position) {
     75                 // TODO Auto-generated method stub
     76                 View v = mViews.get(position);
     77                 container.addView(v);// 一定要把view添加到container中,否则tab中无法显示view
     78                 return v;
     79             }
     80 
     81             @Override
     82             public void destroyItem(ViewGroup container, int position,
     83                     Object object) {
     84                 container.removeView(mViews.get(position));//从container中移除view
     85             }
     86 
     87             @Override
     88             public boolean isViewFromObject(View arg0, Object arg1) {
     89                 // TODO Auto-generated method stub
     90                 return arg0 == arg1;//固定写法
     91             }
     92 
     93             @Override
     94             public int getCount() {
     95                 // TODO Auto-generated method stub
     96                 return mViews.size();//固定写法
     97             }
     98         };
     99         //步骤3 
    100         vp.setAdapter(adapter);
    101         System.out.println("SecondActivity,has already setAdapter...");
    102         
    103         //设置Tab滑动的时候的逻辑代码
    104         vp.setOnPageChangeListener(new OnPageChangeListener() {
    105             int current;
    106             @Override
    107             public void onPageSelected(int arg0) {
    108                 current = vp.getCurrentItem();//重要的方法,获取当前是哪个tab,
    109                 switch (current) {
    110                 case 0:
    111                     //滑动到第一个tab
    112                     resetImg();
    113                     //设置微信ImageButton为按下去的效果
    114                     mWeixinImg.setImageResource(R.drawable.tab_weixin_pressed);
    115                     break;
    116                 case 1:
    117                     resetImg();
    118                     //同上
    119                     mFrdImg.setImageResource(R.drawable.tab_find_frd_pressed);
    120                     break;
    121                 case 2:
    122                     resetImg();
    123                     //同上
    124                     mAddressImg.setImageResource(R.drawable.tab_address_pressed);
    125                     break;
    126                 case 3:
    127                     resetImg();
    128                     //同上
    129                     mSettingImg.setImageResource(R.drawable.tab_settings_pressed);
    130                     break;
    131                 default:
    132                     break;
    133                 }
    134             }
    135 
    136             @Override
    137             public void onPageScrolled(int arg0, float arg1, int arg2) {
    138                 // TODO Auto-generated method stub
    139                 Toast.makeText(SecondActivity.this, "onPageScrolled.......", 0)
    140                         .show();
    141             }
    142 
    143             @Override
    144             public void onPageScrollStateChanged(int arg0) {
    145                 // TODO Auto-generated method stub
    146 
    147             }
    148         });
    149     }
    150     //重置所有的ImageButton为灰色
    151     private void resetImg() {
    152         mWeixinImg.setImageResource(R.drawable.tab_weixin_normal);
    153         mFrdImg.setImageResource(R.drawable.tab_find_frd_normal);
    154         mAddressImg.setImageResource(R.drawable.tab_address_normal);
    155         mSettingImg.setImageResource(R.drawable.tab_settings_normal);
    156     }
    157     /**
    158      * 用来设置ImageButton点击的时候切换到对应的Tab中,
    159      * 
    160      */
    161     @Override
    162     public void onClick(View v) {
    163         // TODO Auto-generated method stub
    164         //1 先重置所有ImageButton的背景为灰色
    165         resetImg();
    166         //2 
    167         switch (v.getId()) {
    168         //注意,case R.id.id_tab_weixin,这个id不是imageButton的id,而是imageButton的父控件LinearLayout的id
    169         case R.id.id_tab_weixin2:
    170             Toast.makeText(this, "weixin", 0).show();
    171             //设置电机的ImageButton为亮色
    172             mWeixinImg.setImageResource(R.drawable.tab_weixin_pressed);
    173             //设置当前所在的tab
    174             vp.setCurrentItem(0);
    175             break;
    176         case R.id.id_tab_frd2:
    177             mWeixinImg.setImageResource(R.drawable.tab_find_frd_pressed);
    178             vp.setCurrentItem(1);
    179             break;
    180         case R.id.id_tab_address2:
    181             mWeixinImg.setImageResource(R.drawable.tab_address_pressed);
    182             vp.setCurrentItem(2);
    183             break;
    184         case R.id.id_tab_settings2:
    185             mWeixinImg.setImageResource(R.drawable.tab_settings_pressed);
    186             vp.setCurrentItem(3);
    187             break;
    188         default:
    189             break;
    190         }
    191     }
    192 }

    ViewPager对应的xml,main2.xml:

     1 <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
     2     xmlns:tools="http://schemas.android.com/tools"
     3     android:layout_width="match_parent"
     4     android:layout_height="match_parent"
     5     android:orientation="vertical" >
     6 
     7     <include layout="@layout/top2" />
     8 
     9     <android.support.v4.view.ViewPager
    10         android:id="@+id/id_viewpager2"
    11         android:layout_width="fill_parent"
    12         android:layout_height="0dp"
    13         android:layout_weight="1" >
    14     </android.support.v4.view.ViewPager>
    15 
    16     <include layout="@layout/bottom2" />
    17 
    18 </LinearLayout>

    效果图如:

  • 相关阅读:
    mysql各版本特点
    jQuery 获取文件后缀的方法
    jquery中动态效果
    常用CSS缩写语法总结
    判断两个时间这间间隔几分钟
    jQuery操作Cookie
    禁止表单自动提示缓存数据
    jQuery.lazyload
    Jquery.Sorttable 桌面拖拽自定义
    分享13款非常有用的 jQuery 插件
  • 原文地址:https://www.cnblogs.com/Sunnor/p/4897304.html
Copyright © 2020-2023  润新知