Fragment结合nineold包实现滑动tab页

文章结尾有源码下载。发现很多项目中都有一套属于自己的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源码

时间: 2024-10-11 20:53:35

Fragment结合nineold包实现滑动tab页的相关文章

Android 高仿华为手机Tab页滑动导航效果

首先带大家看一下实现效果,用了两种实现方式: 1.基于LinearLayout实现,导航栏不可响应手指滑动 2.基于HorizontalScrollView实现,导航栏可响应手指滑动 实现方式虽然不一样,但是使用的是一样的,因为我接口封装的一模一样,下面看实现效果. 基于LinearLayout的实现: 基于HorizontalScrollView的实现: 两者效果一样,区别就在于导航条可否随用户操作滑动. 下面只说明LinearLayout实现,HorizontalScrollView仅仅是套

android开发步步为营之53:viewpager+fragment构造可左右滑动标签页效果

可滑动的标签页是很多应用的用来做外面框架的,比如微信,微博等等,我这里实现的效果是下面是主标签页,然后中间一个的标签页里面又可以继续左右滑动,等于是标签页内部再嵌套标签页,用到的组件主要有:用于滑动效果的viewpager,以及用于实现每个tab页功能的fragment,先看看效果图:  第一步:设计页面activity_learn_fragment.xml <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/

Android可滑动的Tab页

RadioGroup+ViewPager+Fragment实现的可滑动的Tab页,非常的灵活. 最终效果图   demo下载:http://download.csdn.net/download/shenyuanqing/9064189 部分源码 MainActivity package com.example.shen.tabtest.activity; import android.os.Bundle; import android.support.v4.app.Fragment; impor

ViewPagerIndicator 取代TabHost,实现滑动tab,引导页等效果

https://github.com/eltld/ViewPagerIndicator 取代TabHost,实现滑动tab,引导页等效果

使用Fragment+ViewPager,仿微信实现多页Tab切换

我们今天实现类似微信的首页的滑动Tab效果:          郭霖有一篇博客http://blog.csdn.net/guolin_blog/article/details/13171191,讲过如何实现,但是他的demo不能通过滑动切换,只能通过点击按钮切换. 通过viewpager,我们可以完全实现微信的效果. 先看看我的实现效果:      主页面代码 package com.example.fragmentdemo; import java.util.ArrayList; import

【Android界面实现】使用ActionBar和DrawerLayout纯原生控件,实现侧滑栏和滑动Tab界面

转载请注明出处:http://blog.csdn.net/zhaokaiqiang1992 在前面的文章中,我们使用第三方开源控件,比如说是SlidingMenu和PagerSlidingTabStrip,实现过侧滑栏和滑动Tab界面.但是在support-v4包中,提供了原生的侧滑栏控件DrawerLayout,而滑动的Tab效果,我们可以使用ViewPager和ActionBar上的Tab来进行实现.所以在今天的文章里面,我们将介绍如何将DrawerLayout与ActionBar进行整合,

22.Android 十分方便的滑动标签页

22.Android 十分方便的滑动标签页 Android 十分方便的滑动标签页 前言 EasySlidingTabs属性 EasySlidingTabs布局 FragmentPagerAdapter EasySlidingTabs设置Tab背景 Github传送门 效果图 前言 其实滑动标签页是很常见的,网上搜也是一大堆.但是好用.简单.少bug.可扩展的库实在不多.很多想在做滑动标签页的时候也是经常想到各种不靠谱的库,虽然不难,但是容易坑自己. 原三星底层App大神JiangEcho提供技术

多个ImageView组成界面实现上下滑动翻页

============问题描述============ 上面这个就是我的手机界面,我想实现用手上下滑动翻页,翻页过后再来更新这10张照片的内容(图片从服务器GET下来已经实现),现在我就是想晓得这个滑动翻页该用什么组件来实现哦,小弟菜鸟一枚,希望大家多给提点哈 ============解决方案1============ 用fragment吧,改一下fragment里面的数据就行了 ============解决方案2============ 搜一下图片播放器吧

微信Tab页切换

参考开源项目PagerSlidingTabStrip 做了一些小修改,比如设置Tab页平均铺满效果.字体变色等 微调的代码请 源码 下载 关于我 private void addTab(final int position, View tab) { tab.setFocusable(true); tab.setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { pager.setCurre