ViewPageIndicator + ViewPager + Fragment实现类似网易新闻客户端Tab标签
来源:互联网 发布:中国财经报刊数据库 编辑:程序博客网 时间:2024/04/27 14:33
最近生病,脑子不太清楚,今天一哥们问我一个问题,也没搞明白他在问什么,后来明白之后我还以为脑子烧坏了呢,记下问题所在,共分享
这哥们看着夏神的博客写的,附上地址:http://blog.csdn.net/xiaanming/article/details/10766053,他想使用大神博客中说的ViewPageIndicator框架,但是大神继承的是FragmentActivity,这哥们的继承自Fragment,可能是不太明白,具体他的问题出现在哪里,我没有他的代码,我也不清楚
开始正题:
1,要想使用ViewPageIndicator框架,需要先从github上下载源码,源码地址:https://github.com/JakeWharton/Android-ViewPagerIndicator,把library引入项目中
2.由于这哥们需要的是继承fragment的,所以就按照他的需求写的demo
翠花不上菜,只上代码:
package com.sdufe.thea.guo;import com.sdufe.thea.guo.fragment.IndexFragment;import android.os.Bundle;import android.app.Activity;import android.support.v4.app.FragmentActivity;import android.view.Menu;import android.view.Window;import android.widget.LinearLayout;public class MainActivity extends FragmentActivity {@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);requestWindowFeature(Window.FEATURE_NO_TITLE);setContentView(R.layout.activity_main);getSupportFragmentManager().beginTransaction().add(R.id.ll, new IndexFragment()).commit();}@Overridepublic boolean onCreateOptionsMenu(Menu menu) {getMenuInflater().inflate(R.menu.main, menu);return true;}}上面的代码就是在activity里面放入一个fragment,很简单啦,就不解释了.
下面主要就是对于框架的使用了:
package com.sdufe.thea.guo.fragment;import com.sdufe.thea.guo.R;import com.sdufe.thea.guo.adapter.TabPageIndicatorAdapter;import com.viewpagerindicator.TabPageIndicator;import android.os.Bundle;import android.support.v4.app.Fragment;import android.support.v4.view.ViewPager;import android.support.v4.view.ViewPager.OnPageChangeListener;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.Toast;public class IndexFragment extends Fragment {private static String[] title = { "呵呵", "哈哈", "嘿嘿", "嗷嗷" };private ViewPager viewPager;private TabPageIndicator indicator;private TabPageIndicatorAdapter adapter;@Overridepublic View onCreateView(LayoutInflater inflater, ViewGroup container,Bundle savedInstanceState) {View view = inflater.inflate(R.layout.fragment_index, null);viewPager = (ViewPager) view.findViewById(R.id.pager);indicator = (TabPageIndicator) view.findViewById(R.id.indicator);adapter = new TabPageIndicatorAdapter(getFragmentManager(), title);viewPager.setAdapter(adapter);indicator.setViewPager(viewPager);indicator.setOnPageChangeListener(new OnPageChangeListener() {@Overridepublic void onPageSelected(int arg0) {Toast.makeText(getActivity(), title[arg0], Toast.LENGTH_LONG).show();}@Overridepublic void onPageScrolled(int arg0, float arg1, int arg2) {}@Overridepublic void onPageScrollStateChanged(int arg0) {}});return view;}}用起来很简单,毕竟都是大神们写的框架,方便我们小菜们使用,主要思路就是初始化viewPager和TabPageIndicator,给viewpager设置适配器.TabPageIndicator跟随viewPager一起滑动,顺便为其设置监听
下面贴一下适配器的代码:
package com.sdufe.thea.guo.adapter;import com.sdufe.thea.guo.fragment.ItemFragment;import android.os.Bundle;import android.support.v4.app.Fragment;import android.support.v4.app.FragmentManager;import android.support.v4.app.FragmentPagerAdapter;public class TabPageIndicatorAdapter extends FragmentPagerAdapter {private String[] title;public TabPageIndicatorAdapter(FragmentManager fm, String[] title) {super(fm);this.title = title;}@Overridepublic Fragment getItem(int arg0) {Fragment fragment=new ItemFragment();Bundle bundle=new Bundle();bundle.putString("arg", title[arg0]);fragment.setArguments(bundle);return fragment;}@Overridepublic int getCount() {return title.length;}@Overridepublic CharSequence getPageTitle(int position) {return title[position%title.length];}}看着很熟悉吧,前面一片文章已经写过viewPager的使用了,这里主要说一下getPageTitle(int position)这个函数,如果你不重写这个函数,tab中就不会出现设置的文字,要想文字出现,必须要重写这个函数
当然如果上面写的内容你全部敲完了也就是能实现滑动,那天跟着跑的线,样式什么的都没有,下面你需要继续敲,这里是通过改变主题来设置的
<style name="CustomTabPageIndicator" parent="Widget.TabPageIndicator"> <item name="android:background">@drawable/tab_indicator</item> <item name="android:textAppearance">@style/CustomTabPageIndicator.Text</item> <item name="android:textSize">14sp</item> <item name="android:dividerPadding">8dp</item> <item name="android:showDividers">middle</item> <item name="android:paddingLeft">10dp</item> <item name="android:paddingRight">10dp</item> <item name="android:fadingEdge">horizontal</item> <item name="android:fadingEdgeLength">8dp</item> </style> <style name="CustomTabPageIndicator.Text" parent="android:TextAppearance.Medium"> <item name="android:typeface">monospace</item> <item name="android:textColor">@drawable/selector_tabtext</item> </style>这里主要就是对背景的设置,对背景的设置,是通过选择器实现的
<?xml version="1.0" encoding="utf-8"?><selector xmlns:android="http://schemas.android.com/apk/res/android"> <item android:drawable="@android:color/transparent" android:state_pressed="false" android:state_selected="false"></item> <item android:drawable="@android:color/transparent" android:state_pressed="true" android:state_selected="false"></item> <item android:drawable="@drawable/base_tabpager_indicator_selected" android:state_pressed="false" android:state_selected="true"></item> <item android:drawable="@drawable/base_tabpager_indicator_selected" android:state_pressed="true" android:state_selected="true"></item></selector>这样就能实现你想要的滑动了,主要要改变配置文件中的主题(application中的主题作用于整个app,不是只针对于某个acticity)
注:代码是通过夏神代码改编,开始已附上地址
代码下载地址:http://download.csdn.net/detail/elinavampire/8171355
...................................................................................简单看一下源代码...............................................................................................................
首先看一下TabPageIndicator,继承自HorizontalScrollView,也就是说tab是可以实现横向滑屏
public class TabPageIndicator extends HorizontalScrollView implements PageIndicator
继续看里面的代码
private final OnClickListener mTabClickListener = new OnClickListener() { public void onClick(View view) { TabView tabView = (TabView)view; final int oldSelected = mViewPager.getCurrentItem(); final int newSelected = tabView.getIndex(); mViewPager.setCurrentItem(newSelected); if (oldSelected == newSelected && mTabReselectedListener != null) { mTabReselectedListener.onTabReselected(newSelected); } } };
也就是说它本身就实现了点击功能,它不仅仅是实现滑动,其余的就跟实现自定义控件的内容有些相似了
我们使用的方法中还有setViewPager(viewPager)和setOnPageChangeListener()方法,就简单看一下这部分代码
void setViewPager(ViewPager view);和 void setOnPageChangeListener(ViewPager.OnPageChangeListener listener);是接口PageIndicator的方法,TabPageIndicator在自己的类里面实现了接口里面的方法
@Override public void setViewPager(ViewPager view) { if (mViewPager == view) { return; } if (mViewPager != null) { mViewPager.setOnPageChangeListener(null); } final PagerAdapter adapter = view.getAdapter(); if (adapter == null) { throw new IllegalStateException("ViewPager does not have adapter instance."); } mViewPager = view; view.setOnPageChangeListener(this); notifyDataSetChanged(); }这个方法是为了Bind the indicator to a ViewPager.
@Override public void setOnPageChangeListener(OnPageChangeListener listener) { mListener = listener; }这个主要就是使用viewPager的监听事件了,其实TabPageIndicator就是一个自定义控件
ok,先到这
- ViewPageIndicator + ViewPager + Fragment实现类似网易新闻客户端Tab标签
- ViewPageIndicator + ViewPager + Fragment实现类似网易新闻客户端Tab标签
- Android 开源框架ViewPageIndicator 和 ViewPager 仿网易新闻客户端Tab标签
- 开源框架ViewPageIndicator 和 ViewPager 仿网易新闻客户端Tab标签
- 开源框架ViewPageIndicator 和 ViewPager 仿网易新闻客户端Tab标签
- 开源框架ViewPageIndicator 和 ViewPager 仿网易新闻客户端Tab标签
- 仿网易新闻客户端Tab标签Android 开源框架ViewPageIndicator 和 ViewPager
- Android 开源框架ViewPageIndicator 和 ViewPager 仿网易新闻客户端Tab标签
- 开源框架ViewPageIndicator 和 ViewPager 仿网易新闻客户端Tab标签
- Android 开源框架ViewPageIndicator 和 ViewPager 仿网易新闻客户端Tab标签
- Android 开源框架ViewPageIndicator 和 ViewPager 仿网易新闻客户端Tab标签
- Android 开源框架ViewPageIndicator 和 ViewPager 仿网易新闻客户端Tab标签
- Android 开源框架ViewPageIndicator 和 ViewPager 仿网易新闻客户端Tab标签
- Android 开源框架ViewPageIndicator 和 ViewPager 仿网易新闻客户端Tab标签
- Android 开源框架ViewPageIndicator 和 ViewPager 仿网易新闻客户端Tab标签
- Android 开源框架ViewPageIndicator 和 ViewPager 仿网易新闻客户端Tab标签
- Android 开源框架ViewPageIndicator 和 ViewPager 仿网易新闻客户端Tab标签
- Android 开源框架ViewPageIndicator 和 ViewPager 仿网易新闻客户端Tab标签
- [新] 如何给UIViewController瘦身(__MVC模式的重要性__)
- win7配制wnmp
- IOS之同步请求、异步请求、GET请求、POST请求
- BZOJ 3747 POI2015 Kinoman 线段树
- iOS跳入Appstore的两种方式
- ViewPageIndicator + ViewPager + Fragment实现类似网易新闻客户端Tab标签
- 母牛的故事
- 魔法药水图标设计教程
- 14款华丽的最新jQuery焦点图动画插件
- 一款基于jquery和css3的响应式二级导航菜单
- Web前端设计入门示例,含源代码
- 标准C++中的string类的用法总结
- 详解quick-cocos2d-x pageview的demo
- Struts2_ValueStack,OGNL详解