DBMNG数据库管理与应用

书籍是全世界的营养品。生活里没有书籍,就好像没有阳光;智慧里没有书籍,就好像鸟儿没有翅膀。
当前位置:首页 > 移动应用 > Android

AndroidViewPager+Fragment仿GooglePlay

工程目录结构如下图所示



运行效果如下:



主界面布局文件activity_main.xml


[html] view plaincopy
  1. <RelativeLayout 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.     tools:context=".MainActivity" >  
  6.   
  7.     <RelativeLayout  
  8.         android:id="@+id/rl_tab"  
  9.         android:layout_width="fill_parent"  
  10.         android:layout_height="wrap_content"  
  11.         android:background="#F2F2F2" >  
  12.   
  13.         <com.example.playtabtest.view.SyncHorizontalScrollView  
  14.             android:id="@+id/mHsv"  
  15.             android:layout_width="fill_parent"  
  16.             android:layout_height="40dip"  
  17.             android:fadingEdge="none"  
  18.             android:scrollbars="none" >  
  19.   
  20.             <RelativeLayout  
  21.                 android:id="@+id/rl_nav"  
  22.                 android:layout_width="fill_parent"  
  23.                 android:layout_height="wrap_content"  
  24.                 android:layout_gravity="top"  
  25.                 android:background="#5AB0EB" >  
  26.   
  27.                 <RadioGroup  
  28.                     android:id="@+id/rg_nav_content"  
  29.                     android:layout_width="fill_parent"  
  30.                     android:layout_height="38dip"  
  31.                     android:layout_alignParentTop="true"  
  32.                     android:background="#F2F2F2"  
  33.                     android:orientation="horizontal" >  
  34.                 </RadioGroup>  
  35.   
  36.                 <ImageView  
  37.                     android:id="@+id/iv_nav_indicator"  
  38.                     android:layout_width="1dip"  
  39.                     android:layout_height="5dip"  
  40.                     android:layout_alignParentBottom="true"  
  41.                     android:background="#5AB0EB"  
  42.                     android:contentDescription="@string/nav_desc"  
  43.                     android:scaleType="matrix" />  
  44.             </RelativeLayout>  
  45.         </com.example.playtabtest.view.SyncHorizontalScrollView>  
  46.   
  47.         <ImageView  
  48.             android:id="@+id/iv_nav_left"  
  49.             android:layout_width="wrap_content"  
  50.             android:layout_height="wrap_content"  
  51.             android:layout_alignParentLeft="true"  
  52.             android:layout_centerVertical="true"  
  53.             android:contentDescription="@string/nav_desc"  
  54.             android:paddingBottom="1dip"  
  55.             android:src="@drawable/iv_navagation_scroll_left"  
  56.             android:visibility="gone" >  
  57.         </ImageView>  
  58.   
  59.         <ImageView  
  60.             android:id="@+id/iv_nav_right"  
  61.             android:layout_width="wrap_content"  
  62.             android:layout_height="wrap_content"  
  63.             android:layout_alignParentRight="true"  
  64.             android:layout_centerVertical="true"  
  65.             android:contentDescription="@string/nav_desc"  
  66.             android:paddingBottom="1dip"  
  67.             android:src="@drawable/iv_navagation_scroll_right"  
  68.             android:visibility="visible" >  
  69.         </ImageView>  
  70.     </RelativeLayout>  
  71.   
  72.     <android.support.v4.view.ViewPager  
  73.         android:id="@+id/mViewPager"  
  74.         android:layout_width="wrap_content"  
  75.         android:layout_height="wrap_content"  
  76.         android:layout_alignParentBottom="true"  
  77.         android:layout_below="@id/rl_tab"  
  78.         android:layout_gravity="center"  
  79.         android:background="#ffffff"  
  80.         android:flipInterval="30"  
  81.         android:persistentDrawingCache="animation" />  
  82.   
  83. </RelativeLayout>  



MainActivity.java


[java] view plaincopy
  1. package com.example.playtabtest;  
  2.   
  3. import android.os.Bundle;  
  4. import android.support.v4.app.Fragment;  
  5. import android.support.v4.app.FragmentActivity;  
  6. import android.support.v4.app.FragmentManager;  
  7. import android.support.v4.app.FragmentPagerAdapter;  
  8. import android.support.v4.view.ViewPager;  
  9. import android.support.v4.view.ViewPager.OnPageChangeListener;  
  10. import android.util.DisplayMetrics;  
  11. import android.view.LayoutInflater;  
  12. import android.view.Menu;  
  13. import android.view.ViewGroup.LayoutParams;  
  14. import android.view.animation.LinearInterpolator;  
  15. import android.view.animation.TranslateAnimation;  
  16. import android.widget.ImageView;  
  17. import android.widget.RadioButton;  
  18. import android.widget.RadioGroup;  
  19. import android.widget.RadioGroup.OnCheckedChangeListener;  
  20. import android.widget.RelativeLayout;  
  21. import com.example.playtabtest.fragment.CommonUIFragment;  
  22. import com.example.playtabtest.fragment.LaunchUIFragment;  
  23. import com.example.playtabtest.view.SyncHorizontalScrollView;  
  24.   
  25. public class MainActivity extends FragmentActivity {  
  26.   
  27.     public static final String ARGUMENTS_NAME = "arg";  
  28.     private RelativeLayout rl_nav;  
  29.     private SyncHorizontalScrollView mHsv;  
  30.     private RadioGroup rg_nav_content;  
  31.     private ImageView iv_nav_indicator;  
  32.     private ImageView iv_nav_left;  
  33.     private ImageView iv_nav_right;  
  34.     private ViewPager mViewPager;  
  35.     private int indicatorWidth;  
  36.     public static String[] tabTitle = { "选项1""选项2""选项3""选项4""选项5" };    //标题  
  37.     private LayoutInflater mInflater;  
  38.     private TabFragmentPagerAdapter mAdapter;  
  39.     private int currentIndicatorLeft = 0;  
  40.   
  41.     @Override  
  42.     protected void onCreate(Bundle savedInstanceState) {  
  43.         super.onCreate(savedInstanceState);  
  44.         setContentView(R.layout.activity_main);  
  45.           
  46.         findViewById();  
  47.         initView();  
  48.         setListener();  
  49.     }  
  50.   
  51.     private void setListener() {  
  52.           
  53.         mViewPager.setOnPageChangeListener(new OnPageChangeListener() {  
  54.               
  55.             @Override  
  56.             public void onPageSelected(int position) {  
  57.                   
  58.                 if(rg_nav_content!=null && rg_nav_content.getChildCount()>position){  
  59.                     ((RadioButton)rg_nav_content.getChildAt(position)).performClick();  
  60.                 }  
  61.             }  
  62.               
  63.             @Override  
  64.             public void onPageScrolled(int arg0, float arg1, int arg2) {  
  65.                   
  66.             }  
  67.               
  68.             @Override  
  69.             public void onPageScrollStateChanged(int arg0) {  
  70.                   
  71.             }  
  72.         });  
  73.           
  74.         rg_nav_content.setOnCheckedChangeListener(new OnCheckedChangeListener() {  
  75.               
  76.             @Override  
  77.             public void onCheckedChanged(RadioGroup group, int checkedId) {  
  78.                   
  79.                 if(rg_nav_content.getChildAt(checkedId)!=null){  
  80.                       
  81.                     TranslateAnimation animation = new TranslateAnimation(  
  82.                             currentIndicatorLeft ,  
  83.                             ((RadioButton) rg_nav_content.getChildAt(checkedId)).getLeft(), 0f, 0f);  
  84.                     animation.setInterpolator(new LinearInterpolator());  
  85.                     animation.setDuration(100);  
  86.                     animation.setFillAfter(true);  
  87.                       
  88.                     //执行位移动画  
  89.                     iv_nav_indicator.startAnimation(animation);  
  90.                       
  91.                     mViewPager.setCurrentItem(checkedId);   //ViewPager 跟随一起 切换  
  92.                       
  93.                     //记录当前 下标的距最左侧的 距离  
  94.                     currentIndicatorLeft = ((RadioButton) rg_nav_content.getChildAt(checkedId)).getLeft();  
  95.                       
  96.                     mHsv.smoothScrollTo(  
  97.                             (checkedId > 1 ? ((RadioButton) rg_nav_content.getChildAt(checkedId)).getLeft() : 0) - ((RadioButton) rg_nav_content.getChildAt(2)).getLeft(), 0);  
  98.                 }  
  99.             }  
  100.         });  
  101.     }  
  102.   
  103.     private void initView() {  
  104.           
  105.         DisplayMetrics dm = new DisplayMetrics();  
  106.         getWindowManager().getDefaultDisplay().getMetrics(dm);  
  107.           
  108.         indicatorWidth = dm.widthPixels / 4;  
  109.           
  110.         LayoutParams cursor_Params = iv_nav_indicator.getLayoutParams();  
  111.         cursor_Params.width = indicatorWidth;// 初始化滑动下标的宽  
  112.         iv_nav_indicator.setLayoutParams(cursor_Params);  
  113.           
  114.         mHsv.setSomeParam(rl_nav, iv_nav_left, iv_nav_right, this);  
  115.           
  116.         //获取布局填充器  
  117.         mInflater = (LayoutInflater)this.getSystemService(LAYOUT_INFLATER_SERVICE);  
  118.   
  119.         //另一种方式获取  
  120. //      LayoutInflater mInflater = LayoutInflater.from(this);    
  121.           
  122.         initNavigationHSV();  
  123.           
  124.         mAdapter = new TabFragmentPagerAdapter(getSupportFragmentManager());  
  125.         mViewPager.setAdapter(mAdapter);  
  126.     }  
  127.   
  128.     private void initNavigationHSV() {  
  129.           
  130.         rg_nav_content.removeAllViews();  
  131.           
  132.         for(int i=0;i<tabTitle.length;i++){  
  133.               
  134.             RadioButton rb = (RadioButton) mInflater.inflate(R.layout.nav_radiogroup_item, null);  
  135.             rb.setId(i);  
  136.             rb.setText(tabTitle[i]);  
  137.             rb.setLayoutParams(new LayoutParams(indicatorWidth,  
  138.                     LayoutParams.MATCH_PARENT));  
  139.               
  140.             rg_nav_content.addView(rb);  
  141.         }  
  142.           
  143.     }  
  144.   
  145.     private void findViewById() {  
  146.           
  147.         rl_nav = (RelativeLayout) findViewById(R.id.rl_nav);  
  148.           
  149.         mHsv = (SyncHorizontalScrollView) findViewById(R.id.mHsv);  
  150.           
  151.         rg_nav_content = (RadioGroup) findViewById(R.id.rg_nav_content);  
  152.           
  153.         iv_nav_indicator = (ImageView) findViewById(R.id.iv_nav_indicator);  
  154.         iv_nav_left = (ImageView) findViewById(R.id.iv_nav_left);  
  155.         iv_nav_right = (ImageView) findViewById(R.id.iv_nav_right);  
  156.           
  157.         mViewPager = (ViewPager) findViewById(R.id.mViewPager);  
  158.     }  
  159.   
  160.     @Override  
  161.     public boolean onCreateOptionsMenu(Menu menu) {  
  162.         getMenuInflater().inflate(R.menu.main, menu);  
  163.         return true;  
  164.     }  
  165.       
  166.     public static class TabFragmentPagerAdapter extends FragmentPagerAdapter{  
  167.   
  168.         public TabFragmentPagerAdapter(FragmentManager fm) {  
  169.             super(fm);  
  170.         }  
  171.   
  172.         @Override  
  173.         public Fragment getItem(int arg0) {  
  174.             Fragment ft = null;  
  175.             switch (arg0) {  
  176.             case 0:  
  177.                 ft = new LaunchUIFragment();  
  178.                 break;  
  179.   
  180.             default:  
  181.                 ft = new CommonUIFragment();  
  182.                   
  183.                 Bundle args = new Bundle();  
  184.                 args.putString(ARGUMENTS_NAME, tabTitle[arg0]);  
  185.                 ft.setArguments(args);  
  186.                   
  187.                 break;  
  188.             }  
  189.             return ft;  
  190.         }  
  191.   
  192.         @Override  
  193.         public int getCount() {  
  194.               
  195.             return tabTitle.length;  
  196.         }  
  197.           
  198.     }  
  199.   
  200. }  



SyncHorizontalScrollView.java


[java] view plaincopy
  1. package com.example.playtabtest.view;  
  2.   
  3. import android.app.Activity;  
  4. import android.content.Context;  
  5. import android.util.AttributeSet;  
  6. import android.util.DisplayMetrics;  
  7. import android.view.View;  
  8. import android.widget.HorizontalScrollView;  
  9. import android.widget.ImageView;  
  10.   
  11. public class SyncHorizontalScrollView extends HorizontalScrollView {  
  12.   
  13.     private View view;  
  14.     private ImageView leftImage;  
  15.     private ImageView rightImage;  
  16.     private int windowWitdh = 0;  
  17.     private Activity mContext;  
  18.   
  19.     public void setSomeParam(View view, ImageView leftImage,  
  20.             ImageView rightImage, Activity context) {  
  21.         this.mContext = context;  
  22.         this.view = view;  
  23.         this.leftImage = leftImage;  
  24.         this.rightImage = rightImage;  
  25.         DisplayMetrics dm = new DisplayMetrics();  
  26.         this.mContext.getWindowManager().getDefaultDisplay().getMetrics(dm);  
  27.         windowWitdh = dm.widthPixels;  
  28.     }  
  29.   
  30.     public SyncHorizontalScrollView(Context context) {  
  31.         super(context);  
  32.         // TODO Auto-generated constructor stub  
  33.     }  
  34.   
  35.     public SyncHorizontalScrollView(Context context, AttributeSet attrs) {  
  36.         super(context, attrs);  
  37.         // TODO Auto-generated constructor stub  
  38.     }  
  39.   
  40.     // 显示和隐藏左右两边的箭头  
  41.     public void showAndHideArrow() {  
  42.         if (!mContext.isFinishing() && view != null) {  
  43.             this.measure(00);  
  44.             if (windowWitdh >= this.getMeasuredWidth()) {  
  45.                 leftImage.setVisibility(View.GONE);  
  46.                 rightImage.setVisibility(View.GONE);  
  47.             } else {  
  48.                 if (this.getLeft() == 0) {  
  49.                     leftImage.setVisibility(View.GONE);  
  50.                     rightImage.setVisibility(View.VISIBLE);  
  51.                 } else if (this.getRight() == this.getMeasuredWidth()  
  52.                         - windowWitdh) {  
  53.                     leftImage.setVisibility(View.VISIBLE);  
  54.                     rightImage.setVisibility(View.GONE);  
  55.                 } else {  
  56.                     leftImage.setVisibility(View.VISIBLE);  
  57.                     rightImage.setVisibility(View.VISIBLE);  
  58.                 }  
  59.             }  
  60.         }  
  61.     }  
  62.   
  63.     protected void onScrollChanged(int l, int t, int oldl, int oldt) {  
  64.         super.onScrollChanged(l, t, oldl, oldt);  
  65.         if (!mContext.isFinishing() && view != null && rightImage != null  
  66.                 && leftImage != null) {  
  67.             if (view.getWidth() <= windowWitdh) {  
  68.                 leftImage.setVisibility(View.GONE);  
  69.                 rightImage.setVisibility(View.GONE);  
  70.             } else {  
  71.                 if (l == 0) {  
  72.                     leftImage.setVisibility(View.GONE);  
  73.                     rightImage.setVisibility(View.VISIBLE);  
  74.                 } else if (view.getWidth() - l == windowWitdh) {  
  75.                     leftImage.setVisibility(View.VISIBLE);  
  76.                     rightImage.setVisibility(View.GONE);  
  77.                 } else {  
  78.                     leftImage.setVisibility(View.VISIBLE);  
  79.                     rightImage.setVisibility(View.VISIBLE);  
  80.                 }  
  81.             }  
  82.         }  
  83.     }  
  84. }  



以下是两个Fragment的源代码


LaunchUIFragment.java


[java] view plaincopy
  1. package com.example.playtabtest.fragment;  
  2.   
  3. import android.os.Bundle;  
  4. import android.support.v4.app.Fragment;  
  5. import android.view.LayoutInflater;  
  6. import android.view.View;  
  7. import android.view.ViewGroup;  
  8.   
  9. import com.example.playtabtest.R;  
  10.   
  11. public class LaunchUIFragment extends Fragment {  
  12.   
  13.     @Override  
  14.     public View onCreateView(LayoutInflater inflater, ViewGroup container,  
  15.             Bundle savedInstanceState) {  
  16.           
  17.         View rootView = inflater.inflate(R.layout.fragment_selection_launch, container, false);  
  18.           
  19.         return rootView;  
  20.     }  
  21.     @Override  
  22.     public void onActivityCreated(Bundle savedInstanceState) {  
  23.         // TODO Auto-generated method stub  
  24.         super.onActivityCreated(savedInstanceState);  
  25.     }  
  26.       
  27. }  



CommonUIFragment.java


[java] view plaincopy
  1. package com.example.playtabtest.fragment;  
  2.   
  3. import android.os.Bundle;  
  4. import android.support.v4.app.Fragment;  
  5. import android.view.LayoutInflater;  
  6. import android.view.View;  
  7. import android.view.ViewGroup;  
  8. import android.widget.TextView;  
  9.   
  10. import com.example.playtabtest.MainActivity;  
  11. import com.example.playtabtest.R;  
  12.   
  13. public class CommonUIFragment extends Fragment {  
  14.       
  15.     @Override  
  16.     public View onCreateView(LayoutInflater inflater, ViewGroup container,  
  17.             Bundle savedInstanceState) {  
  18.           
  19.         View rootView = inflater.inflate(R.layout.fragment_selection_common, container, false);  
  20.           
  21.         TextView tv_tabName = (TextView) rootView.findViewById(R.id.tv_tabName);  
  22.           
  23.         Bundle bundle = getArguments();  
  24.           
  25.         tv_tabName.setText(bundle.getString(MainActivity.ARGUMENTS_NAME, ""));  
  26.           
  27.         return rootView;  
  28.     }  
  29.     @Override  
  30.     public void onActivityCreated(Bundle savedInstanceState) {  
  31.         // TODO Auto-generated method stub  
  32.         super.onActivityCreated(savedInstanceState);  
  33.     }  
  34.       
  35. }  



两个Fragment的布局文件

fragment_selection_launch.xml


[html] view plaincopy
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="match_parent"  
  4.     android:layout_height="match_parent"  
  5.     android:orientation="vertical" >  
  6.       
  7.     <TextView android:id="@+id/tv_intro"  
  8.             android:layout_width="300dp"  
  9.             android:layout_height="wrap_content"  
  10.             android:layout_marginTop="20dp"  
  11.             android:layout_marginBottom="16dp"  
  12.             android:text="@string/launch_intro"/>  
  13.       
  14.     <Button android:id="@+id/bt_click"  
  15.             android:layout_width="300dp"  
  16.             android:layout_height="wrap_content"  
  17.             android:layout_marginBottom="16dp"  
  18.             android:text="@string/launch_click_me"/>  
  19.   
  20. </LinearLayout>  



fragment_selection_common.xml


[html] view plaincopy
  1. <?xml version="1.0" encoding="utf-8"?>  
  2. <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"  
  3.     android:layout_width="match_parent"  
  4.     android:layout_height="match_parent"  
  5.     android:orientation="vertical" >  
  6.       
  7.     <TextView   
  8.         android:layout_width="300dp"  
  9.         android:layout_height="wrap_content"  
  10.         android:textSize="18sp"  
  11.         android:text="@string/common_intro"  
  12.         />  
  13.       
  14.     <TextView   
  15.         android:id="@+id/tv_tabName"  
  16.         android:layout_marginTop="30dp"  
  17.         android:layout_width="wrap_content"  
  18.         android:layout_height="30dp"  
  19.         android:layout_gravity="center"  
  20.         android:textSize="20sp"  
  21.         />  
  22.   
  23. </LinearLayout>  
源码地址:http://download.csdn.net/detail/luckkof/7451339
本站文章内容,部分来自于互联网,若侵犯了您的权益,请致邮件chuanghui423#sohu.com(请将#换为@)联系,我们会尽快核实后删除。
Copyright © 2006-2023 DBMNG.COM All Rights Reserved. Powered by DEVSOARTECH            豫ICP备11002312号-2

豫公网安备 41010502002439号