栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > 移动开发 > Android

Android MarginDesign控件TabLayout导航栏使用详解

Android 更新时间: 发布时间: IT归档 最新发布 模块sitemap

Android MarginDesign控件TabLayout导航栏使用详解

TabLayout的使用简单介绍

比如在平常的项目中实现这样的效果,一般都是都会使用viewPageIndicate等几个开源框架直接实现,或者使用自定义的HorizontalScroll再配合ViewPage+Fragment实现。在谷歌推出marginDesign之后,实现这种效果可以直接使用TabLayout实现。另外Tablayout可以通过自定义View自定义导航栏的效果。这样使用的时候更加灵活多变。

首先需要导入design包

在app的build.gradle下添加design的包

dependencies {
  compile 'com.android.support:design:25.0.1'
 }

然后就开始撸起袖子,开始如何使用

在xml文件里面写布局:


 






既然使用到了fragment,就免不了要添加下简单的布局:

 


 

然后是fragment和FragmentPagerAdapter的代码。写过的人应该对这个很熟了,就直接粘下代码

public class framentAdapter extends FragmentPagerAdapter {
private String[] titles;

public framentAdapter(FragmentManager fm, String[] titles) {
  super(fm);
  this.titles = titles;
}

@Override
public Fragment getItem(int position) {
  return PageFragment.newInstace(position,titles);
}

@Override
public int getCount() {
  return titles.length;
}

@Override
public CharSequence getPageTitle(int position) {
  return titles[position];
}
}

Fragment的代码:

public class PageFragment extends Fragment {
private int position;
private String[] titles;
private Context context;
public static PageFragment newInstace(int position, String[] titles) {
  Bundle bundle = new Bundle();
  bundle.putInt("POSITION", position);
  bundle.putStringArray("ARRAY", titles);
  PageFragment pageFragment = new PageFragment();
  pageFragment.setArguments(bundle);
  return pageFragment;
}

@Override
public void onAttach(Context context) {
  super.onAttach(context);
  this.context=context;
}

@Override
public void onCreate(@Nullable Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  position = getArguments().getInt("POSITION");
  titles = getArguments().getStringArray("ARRAY");
}

@Nullable
@Override
public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
  View view =inflater.inflate(R.layout.item_layout,null);
  TextView textView = (TextView) view.findViewById(R.id.textView);
  textView.setText(titles[position]);
  return view;
}
}

写好这些之后最后在MainActivity中看下如何使用:

public class MainActivity extends FragmentActivity {
private TabLayout tabLayout;
private ViewPager viewPager;
private String[] titles = {"黄蓉", "郭靖", "杨过", "小龙女", "尹志平", "金轮法王", "收到货就收到货圣诞节"};
private TextView textView;

@Override
protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);
  tabLayout = (TabLayout) findViewById(R.id.tabLayout);
  viewPager = (ViewPager) findViewById(R.id.viewPager);
  framentAdapter framentAdapter = new framentAdapter(getSupportFragmentManager(), titles);
  viewPager.setAdapter(framentAdapter);
  tabLayout.setupWithViewPager(viewPager);
  tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE);}
  }

viewPager.setAdapter(framentAdapter);这行代码必须在下面这行代码之前。有兴趣的可以看下源码。 tabLayout.setupWithViewPager(viewPager);

另外 tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE);给tablayout设置了这种模式,mode有两种,这种模式大概的意思是,我内容很多的时候,可以使tab平铺滑动。
很多时候我们需要自己自定义样式或者要自定义我们的tab。

自定义样式:
需要在Style文件下添加自己的样式,然后应用就好了,例如;


  ?attr/colorAccent
  2dp
  12dp
  12dp
  ?attr/selectableItemBackground
  @style/MyCustomTabTextAppearance
  ?android:textColorPrimary


  14sp
  ?android:textColorSecondary
  true

另外一种就是需要添加我们自定义的View:
首先写要定义的布局文件;

 






然后稍微修改下FragmentPagerAdapter的代码

 public class framentAdapter extends FragmentPagerAdapter {
private String[] titles;

public framentAdapter(FragmentManager fm, String[] titles) {
  super(fm);
  this.titles = titles;
}

@Override
public Fragment getItem(int position) {
  return PageFragment.newInstace(position,titles);
}

@Override
public int getCount() {
  return titles.length;
}

@Override
public CharSequence getPageTitle(int position) {
  return null;
}
}

最后看下怎么在MainActivity中使用。

public class MainActivity extends FragmentActivity {
private TabLayout tabLayout;
private ViewPager viewPager;
private String[] titles = {"黄蓉", "郭靖", "杨过", "小龙女", "尹志平", "金轮法王", "收到货就收到货圣诞节"};
private TextView textView;

@Override
protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);
  tabLayout = (TabLayout) findViewById(R.id.tabLayout);
  viewPager = (ViewPager) findViewById(R.id.viewPager);
  framentAdapter framentAdapter = new framentAdapter(getSupportFragmentManager(), titles);
  viewPager.setAdapter(framentAdapter);
  tabLayout.setupWithViewPager(viewPager);
  tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE);
  for (int i = 0; i < tabLayout.getTabCount(); i++) {
    TabLayout.Tab tab = tabLayout.getTabAt(i);
    tab.setCustomView(getTabView(i));
  }
}

private View getTabView(int position) {
  View view = View.inflate(this, R.layout.item_tab_view, null);
  textView = (TextView) view.findViewById(R.id.textView);
  textView.setText(titles[position]);
  return view;
}
}

到这里就结束了TabLayout的使用。放下源码:Tablayout的使用

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持考高分网。

转载请注明:文章转载自 www.mshxw.com
本文地址:https://mshxw.com/it/160092.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号