仿今日头条viewpager切换指示器, 商品详情指示器,以及各种很灵活的定制自己需要的样式:
该控件的实现, 引用的是MagicIndicator. 效果图如下:
具体代码效果如下:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <net.lucode.hackware.magicindicator.MagicIndicator android:id="@+id/magic_indicator" android:layout_width="match_parent" android:layout_height="@dimen/dp_40" android:background="@color/bg_view"/> <View style="@style/separator_line" /> <android.support.v4.view.ViewPager android:id="@+id/view_pager" android:layout_width="match_parent" android:layout_height="match_parent"/> </LinearLayout>
MagicIndicator的使用:
mMagicIndicator = (MagicIndicator)findViewById(R.id.magic_indicator); mViewPager = (ViewPager)findViewById(R.id.view_pager); this.goodsId = getIntent().getStringExtra("goodsId"); this.contents = getIntent().getStringExtra("content"); this.position = getIntent().getIntExtra("position" ,0); fragPagerAdapter = new SPProductDetailInnerTabAdapter(getSupportFragmentManager() , goodsId ,contents); mViewPager.setAdapter(fragPagerAdapter); // 当前页不定位到中间 final CommonNavigator commonNavigator = new CommonNavigator(this); commonNavigator.setAdjustMode(true); commonNavigator.setScrollPivotX(0.15f); commonNavigator.setAdapter(new CommonNavigatorAdapter() { @Override public int getCount() { return mDataList == null ? 0 : mDataList.size(); } @Override public IPagerTitleView getTitleView(Context context, final int index) { SimplePagerTitleView simplePagerTitleView = new SimplePagerTitleView(context); simplePagerTitleView.setText(mDataList.get(index)); simplePagerTitleView.setNormalColor(getResources().getColor(R.color.sub_title)); simplePagerTitleView.setSelectedColor(getResources().getColor(R.color.light_red)); simplePagerTitleView.setTextSize(12); simplePagerTitleView.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { mViewPager.setCurrentItem(index); } }); return simplePagerTitleView; } @Override public IPagerIndicator getIndicator(Context context) { LinePagerIndicator indicator = new LinePagerIndicator(context); indicator.setMode(LinePagerIndicator.MODE_WRAP_CONTENT); indicator.setYOffset(UIUtil.dip2px(context, 3)); indicator.setColors(getResources().getColor(R.color.light_red)); return indicator; } }); mMagicIndicator.setNavigator(commonNavigator); mMagicIndicator.setDelegate(new SimpleViewPagerDelegate(mViewPager));
这样就可以快速实现一个tab选项卡式效果, 可以很随意自定义自己的样式.
完整Demo下载地址:http://www.tp-shop.cn/article_id_1098.html
相关推荐
仿新浪微博tabhost实现,大家可以参考一下。
android特效集锦系列之仿新浪微博TabHost菜单
一个使用FragmentTabHost搭建的仿微信界面Demo,方便以后复习使用
ImageView 圆环旋转+仿微信底部TabHost+fragment
仿新浪微博的Tabhost,通过重写RadioButton实现。。
tabhost中嵌套一个tabhost。
fragment替换tabhost仿微信首页,适应3.0以上
使用TabHost仿微博客户端界面,实现底部多个菜单,点击不同菜单显示不同的content,类似新浪微博主界面。
Tabhost仿QQ聊天新对话数字提示,同时Tabhost间的切换不重复加载内容。
很长一段时间没有上传资源了,最近觉得微信的主界面滑动很好用,研究了下,秉着开源...主要有 TabHost + Fragment 来实现。 当然,另一种实现方式是 ViewGroup + ViewPager,异曲同工,不过我这里没有采用这种方式。
使用TabHost仿新浪微博的底部功能实现,内有源码和图片,可以直接运行,附有详细注释
TabHost+ViewPager实现滑动tabhost, viewPager;tabhost;滑动;源码
仿蘑菇街UI框架 集合 Tabhost viewpage
(框架)Android例子源码——tabhost+activity+slidingMenu仿新浪微博布局.zip
仿微信例子,使用TabHost实现底部tab,可以显示未读信息条数。适合初学者学习研究。
现今很流行的 TabHost的各种实现方式的代码
Android 嵌套TabHost示例. 两层TabHost嵌套,实现的效果类似网页上的二级菜单栏。
tabhost activity slidingMenu仿新浪微博布局可以作为一个小框架来重复使用,代码量不大,需要的朋友可以下载研究一下,默认编码GBK编译版本4.2.2 。
1、底部tabhost嵌套顶部tabhost. 2、顶部tabhost,嵌套listview。 3、顶部tabhost子tab选项仿网易新闻功能,可以滑动,每一个对应一个listvie
Android TabHost TabActivity TabHost的简单使用