学生时代DOTA的年代,Android上是有一个App的,后来作者就没更新了。那个年代就有用Tab的了,非常方便快捷,食堂吃饭的时候能拿出来滑两下看看,到宿舍就实践起来_。所以就决定了,用Tab
走的弯路
一开始是在github找的第三方开源库SmartLayout 围观地址
严格意义上来说并不是弯路,是因为 我不会啊!技术不到家不会用啊!我表示很无奈啊!
怼来怼去半天,发现了TabLayout这个东西,是Google官方的东西,资料比较多一点,所以选择了这个,其实按我的审美,还是SmartLayout好看啊T T
开始撸代码咯
1. 添加依赖
TabLayout是Android Support Design里面的新东西,需要在Android Studio的SDK Manager——SDK Tools中勾选Android Support Library下载,截止到今天2016.3.14,最新版本为23.2.1,接下来还要在Project工程文件下的build.gradle中的dependency中添加一行代码compile 'com.android.support:design:23.2.1'
2.正式开始写代码
首先需要创建一个布局,直接修改activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
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:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
android:paddingBottom="@dimen/activity_vertical_margin"
tools:context=".MainActivity">
<android.support.design.widget.TabLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/tabs"/>
<android.support.v4.view.ViewPager
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="@+id/viewpager"
android:layout_below="@id/tabs"/>
</RelativeLayout>```
接下来创建一个PageFragment.java
```Java
package com.noisay.dota2guide.fragment;
import android.os.Bundle;
import android.support.annotation.Nullable;
import android.support.v4.app.Fragment;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.TextView;
import com.noisay.dota2guide.R;
public class PageFragment extends Fragment {
public static final String ARG_PAGE = "ARG_PAGE";
private int mPage;//此变量纯粹用来做Fragment内容的展示编号,后期会删除
public static PageFragment newInstance(int page) {
Bundle args = new Bundle();
args.putInt(ARG_PAGE, page);
PageFragment pageFragment = new PageFragment();
pageFragment.setArguments(args);
return pageFragment;
}
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
mPage = getArguments().getInt(ARG_PAGE);
}
@Nullable
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
View view = inflater.inflate(R.layout.fragment_page, container, false);
TextView textView = (TextView) view;
textView.setText("Fragment #" + mPage);
return view;
}
}```
然后新建一个fragment_page.xml,代码如下
```Java
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center" />
再新建一个SimpleFragmentPagerAdapter.java来适配
package com.noisay.dota2guide.adapter;
import android.content.Context;
import android.support.v4.app.Fragment;
import android.support.v4.app.FragmentManager;
import android.support.v4.app.FragmentPagerAdapter;
import com.noisay.dota2guide.fragment.PageFragment;
/**
* Created by noisa on 2016/3/14.
*/
public class SimpleFragmentPagerAdapter extends FragmentPagerAdapter{
final int PAGE_COUNT = 4;
private String tabTitles[] = new String[]{"敏捷英雄", "智力英雄", "力量英雄", "装备"};
private Context context;
public SimpleFragmentPagerAdapter(FragmentManager fm, Context context) {
super(fm);
this.context = context;
}
@Override
public Fragment getItem(int position) {
return PageFragment.newInstance(position+1);//加1是因为position是从0开始
}
@Override
public int getCount() {
return PAGE_COUNT;
}
@Override
public CharSequence getPageTitle(int position) {
return tabTitles[position];
}
}
最后一步,修改MainActivity.java
package com.noisay.dota2guide;
import android.os.Bundle;
import android.support.design.widget.TabLayout;
import android.support.v4.app.FragmentActivity;
import android.support.v4.view.ViewPager;
import com.noisay.dota2guide.adapter.SimpleFragmentPagerAdapter;
/**
* Created by noisa on 2016/3/14.
*/
public class MainActivity extends FragmentActivity {
private SimpleFragmentPagerAdapter pagerAdapter;
private ViewPager viewPager;
private TabLayout tabLayout;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
pagerAdapter = new SimpleFragmentPagerAdapter(getSupportFragmentManager(), this);
viewPager = (ViewPager) findViewById(R.id.viewpager);
viewPager.setAdapter(pagerAdapter);
tabLayout = (TabLayout) findViewById(R.id.tabs);
tabLayout.setupWithViewPager(viewPager);
tabLayout.setTabMode(TabLayout.MODE_FIXED);
}
}
最终呈现出来的效果,没有真机录不了视频转Gif,简直血崩一波。。。。。看个PNG凑合一下吧
本人现在还是超级菜鸟一枚,此文中部分代码来自于Chenfuduo的《TabLayout of design support library 》一问,结合App的需要有做修改,原文链接