唔,马上就毕业了,最近回学校做论文毕设,代码基本放下了,公司的工作也没跟着做,最近公司在催我回去,唉,毕业是个事,头疼啊,只好在学校做开发了。哦了说回正题,今天要做类似淘宝淘抢购的导航栏,先看看淘宝的效果。
红框里的就是今天的主角了,在网上一顿好找,根本没找到,连类似的都没有,CSDN有一个资源要10积分,呵呵,你怎么不去抢,看看评论都说垃圾还敢要这么多积分,只好自己动手做了。事实证明:拿来主义不好做,还是得自己来。自己做也就用了半个多小时。来看看我做的^_^
自己做的也不差吧,下面来说说思路。这个用的是Android自带的控件TabLayout,黑色的背景和红色带小三角的都是.9图,不懂.9图的可以自行百度。然后写一个selector,设置Tablayout的tabBackground属性,如果想设置字体属性,就要用tabTextAppearance,自己写一个style就行。下面是tablayout的代码
<android.support.design.widget.TabLayout
android:id="@+id/tabLayout"
android:layout_width="match_parent"
android:layout_height="60dp"
app:tabBackground="@drawable/tab_background"
app:tabGravity="center"
app:tabIndicatorColor="@color/fragment_money_red"
app:tabIndicatorHeight="0dp"
app:tabMinWidth="98dp"
app:tabMode="scrollable"
app:tabPaddingBottom="3dp"
app:tabSelectedTextColor="@color/white"
app:tabTextAppearance="@style/TabLayoutTextStyle"
app:tabTextColor="@color/white" />
主要代码到这就完了。。。
下面奉上全部代码,先看布局文件的:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<android.support.design.widget.TabLayout
android:id="@+id/tabLayout"
android:layout_width="match_parent"
android:layout_height="60dp"
app:tabBackground="@drawable/tab_background"
app:tabGravity="center"
app:tabIndicatorColor="@color/fragment_money_red"
app:tabIndicatorHeight="0dp"
app:tabMinWidth="98dp"
app:tabMode="scrollable"
app:tabPaddingBottom="3dp"
app:tabSelectedTextColor="@color/white"
app:tabTextAppearance="@style/TabLayoutTextStyle"
app:tabTextColor="@color/white" />
<android.support.v4.view.ViewPager
android:id="@+id/viewPager"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</LinearLayout>
selector的代码:
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="@drawable/tab_selected" android:state_selected="true" />
<item android:drawable="@drawable/tab_unselected" android:state_selected="false"/>
</selector>
<style name="TabLayoutTextStyle">
<item name="android:textSize">13sp</item>
<item name="android:lineSpacingExtra">1dp</item>
</style>
资源方面就这些了,下面是adapter的
public class MyFragmentPagerAdapter extends FragmentPagerAdapter {
private List<Fragment> fragmentList;//fragment列表
private List<String> stringList;//tab名的列表
public MyFragmentPagerAdapter(FragmentManager fm, List<Fragment> fragmentList, List<String> stringList) {
super(fm);
if (fragmentList.size() != stringList.size()) {
try {
throw new Exception("fragmentList.size must equals stringList.size!");
} catch (Exception e) {
e.printStackTrace();
}
}
this.fragmentList = fragmentList;
this.stringList = stringList;
}
@Override
public Fragment getItem(int position) {
return fragmentList.get(position);
}
@Override
public int getCount() {
return stringList.size();
}
//此方法用来显示tab上的名字
@Override
public CharSequence getPageTitle(int position) {
return stringList.get(position % stringList.size());
}
}
最后就是MainActivit的了
public class MainActivity extends AppCompatActivity {
private TabLayout tabLayout;
private ViewPager viewPager;
private List<Fragment> fragmentList = new ArrayList<>();//fragment列表
private List<String> stringList = new ArrayList<>();//tab名的列表
private MyFragmentPagerAdapter adapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
initView();
}
private void initView() {
tabLayout = (TabLayout) findViewById(R.id.tabLayout);
viewPager = (ViewPager) findViewById(R.id.viewPager);
getData();
for (int i = 0; i < stringList.size(); i++) {
tabLayout.addTab(tabLayout.newTab().setText(stringList.get(i)));
}
adapter = new MyFragmentPagerAdapter(getSupportFragmentManager(), fragmentList, stringList);
viewPager.setAdapter(adapter);
tabLayout.setupWithViewPager(viewPager);
}
private void getData() {
fragmentList.add(new TypeFragment());
fragmentList.add(new TypeFragment());
fragmentList.add(new TypeFragment());
fragmentList.add(new TypeFragment());
stringList.add("16:00\n拍卖结束");
stringList.add("17:00\n疯狂抢购中");
stringList.add("18:00\n即将开始");
stringList.add("19:00\n即将开始");
}
}
需要引入V4包和Desig包! 差不多到这代码就完了,估计看到这的还希望有源代码吧,来给你,源代码要1分,辛苦分,没分的就自己拷贝代码创建工程吧。
代码在这里!!!