文章结尾有源码下载。发现很多项目中都有一套属于自己的tab样式和风格。今天,想分享给大家一个自定义tabhost带有匀速滑动的指示器切换fragment的Demo,略显不才,只能分享简单的东西,后面有源码下载。搞了一个视频和gif,好像这不能传,只能传图片了。不懂怎么排版,好乱的感觉。
public class MainFragment extends Fragment implements TabContentFactory, OnTabChangeListener, OnPageChangeListener{
private TabHost mTabHost;
private ViewPager mPager;
private TextView text;
private int offSet;
private int lastlocation;
private View view;
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
Bundle savedInstanceState) {
View layout = inflater.inflate(R.layout.fragment_main, null);
inintTabIndecator(layout); //滑动指示器相关设置
initTab(layout);
initPager(layout);
return layout;
}
/**
* @param layout
*/
private void inintTabIndecator(View layout) {
text = (TextView) layout.findViewById(R.id.text_indicator);
int width =getActivity().getWindowManager().getDefaultDisplay().getWidth();
int height = getActivity().getWindowManager().getDefaultDisplay().getHeight();
offSet = width / 4;//因为我是4个tab页,所以得到手机屏幕的宽度除以4来设置我滑动的指示器宽度(offSet)
text.setWidth(offSet);
}
private void initTab(View layout) {
mTabHost = (TabHost) layout.findViewById(android.R.id.tabhost);
mTabHost.setup();// 如果当前类没有继承TabActivity,必须调用这个方法初始化
for (int i = 0; i < 4; i++) {
view = getActivity().getLayoutInflater().inflate(R.layout.tab, null);
final ImageView img = (ImageView) view.findViewById(R.id.img_tabitem);
img.setTag(i); //因为点击图标不会改变pager页数,所以我给他设了值供点击切换pager
img.setOnClickListener(new OnClickListener() {
@Override
public void onClick(View v) {
// TODO Auto-generated method stub
int tag = (Integer) img.getTag(); //拿到每一个img的控件id设置监听
mPager.setCurrentItem(tag);
}
});
mTabHost.addTab(mTabHost.newTabSpec("tab1").setIndicator(view).setContent(this));
}
mTabHost.setOnTabChangedListener(this);
}
private void initPager(View layout) {
mPager = (ViewPager) layout.findViewById(R.id.pager);
// 注意在Fragment中嵌套Fragment,必须使用
// ChildFragmentMananger
FragmentManager fm = getChildFragmentManager();
mPager.setAdapter(new MyPagerAdapter(fm));
mPager.setOnPageChangeListener(this);
mPager.setOffscreenPageLimit(3);
}
class MyPagerAdapter extends FragmentPagerAdapter {
public MyPagerAdapter(FragmentManager fm) {
super(fm);
}
@Override
public Fragment getItem(int position) {
switch (position) {
case 0:
return new Fragment1();//为了预览加载数据时是否会卡顿,所以我在4个页面里都用了Fragment1,它调用了公司一个接口来实现数据更新
case 1:
return new Fragment1();
case 2:
return new Fragment1();
case 3:
return new Fragment1();
default:
break;
}
return null;
}
@Override
public int getCount() {
return 4;
}
}
@Override
public View createTabContent(String tag) {
TextView tv = new TextView(getActivity());
return tv;
}
@Override
public void onTabChanged(String tabId) {
// 得到激活的tab的position
int position = mTabHost.getCurrentTab();
// 设置ViewPager显示position位置的item
mPager.setCurrentItem(position);
}
@Override
public void onPageScrolled(int position, float positionOffset,
int positionOffsetPixels) {
}
@Override
public void onPageSelected(int position) {
mTabHost.setCurrentTab(position);
ObjectAnimator ofFloat = ObjectAnimator.ofFloat(text, "translationX",lastlocation, position * offSet);//这是nineold里的一个方法
lastlocation = position * offSet;// lastlocation上一次所在位置,position * offSet即将要移动到哪
ofFloat.setInterpolator(new DecelerateInterpolator());//加速度
ofFloat.setDuration(300).start();//时间3秒, 开始
}
@Override
public void onPageScrollStateChanged(int state) {
}
}
Fragment结合tabhost实现可滑动指示器Demo源码