码迷，mamicode.com
首页 > 其他好文 > 详细

TabLayout 和 ViewPager【综合示例】

时间：2017-06-28 20:35:45      阅读：249      评论：0      收藏：0      [点我收藏+]

标签：cte   break   find   ++   []   数据   tag   str   随机   

MainActivity 

  1. public class MainActivity extends ListActivity {
  3. 	protected void onCreate(Bundle savedInstanceState) {
  4. 		super.onCreate(savedInstanceState);
  5. 		String[] array = {"0、不重写getPageTitle，会导致没有标题",
  6. 				"1、使用默认的MODE_FIXED模式",
  7. 				"2、代码中设置Tab样式",
  8. 				"3、XML中设置Tab样式",
  10. 				"4、和VP联动演示，自定义Tab，添加监听，自定义Tab间距",
  11. 				"5、不自定义Tab，不添加监听，不自定义Tab间距(注意：这里tabMinWidth的默认值会严重影响Tab的宽度)",
  12. 				"6、自定义Tab，添加监听，不自定义Tab间距",
  14. 				"7、添加点击事件，但不手动处理点击Tab后TabLayout和VP的变化",
  15. 				"8、添加点击事件，并手动处理点击Tab后TabLayout和VP的变化",
  16. 				"9、【动态添加、删除VP中的数据--正常情况】",
  17. 				"9、【动态添加、删除VP中的数据--非正常情况】",};
  18. 		setListAdapter(new ArrayAdapter<>(this, android.R.layout.simple_list_item_1, new ArrayList<>(Arrays.asList(array))));
  19. 	}
  21. 	@Override
  22. 	protected void onListItemClick(ListView l, View v, int position, long id) {
  23. 		switch (position) {
  24. 			case 0:
  25. 			case 1:
  26. 			case 2:
  27. 			case 3:
  28. 				Intent intent = new Intent(this, Activity1.class);
  29. 				intent.putExtra("tag", position);
  30. 				startActivity(intent);
  31. 				break;
  32. 			case 4:
  33. 			case 5:
  34. 			case 6:
  35. 				Intent intent2 = new Intent(this, Activity2.class);
  36. 				intent2.putExtra("tag", position);
  37. 				startActivity(intent2);
  38. 				break;
  39. 			case 7:
  40. 			case 8:
  41. 				Intent intent3 = new Intent(this, Activity3.class);
  42. 				intent3.putExtra("tag", position);
  43. 				startActivity(intent3);
  44. 				break;
  45. 			case 9:
  46. 				Intent intent4 = new Intent(this, Activity_VP1.class);
  47. 				intent4.putExtra("tag", position);
  48. 				startActivity(intent4);
  49. 				break;
  50. 			case 10:
  51. 				Intent intent5 = new Intent(this, Activity_VP2.class);
  52. 				intent5.putExtra("tag", position);
  53. 				startActivity(intent5);
  54. 				break;
  55. 		}
  56. 	}
  57. }

MyFragment

  1. public class MyFragment extends Fragment {
  2. 	
  3. 	public static MyFragment newInstance(String tag) {
  4. 		Bundle args = new Bundle();
  5. 		args.putString("tag", tag);
  6. 		MyFragment fragment = new MyFragment();
  7. 		fragment.setArguments(args);
  8. 		return fragment;
  9. 	}
  10. 	
  11. 	@Override
  12. 	public View onCreateView(LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
  13. 		TextView textView = new TextView(getContext());
  14. 		textView.setText(getArguments().getString("tag"));
  15. 		textView.setGravity(Gravity.CENTER);
  16. 		textView.setBackgroundColor(0xFF000000 + new Random().nextInt(0xFFFFFF));
  17. 		//注意，Integer.MAX_VALUE= 0x7fffffff，超过这个值就是负数了，所以通过随机数获取int值时，传入的值要小于0x7fffffff
  18. 		return textView;
  19. 	}
  20. }

Activity1 样式

  1. public class Activity1 extends FragmentActivity {
  2. 	private List<String> list = new ArrayList<>(Arrays.asList(new String[]{"包青天", "白", "baiqiantao(注意大小写)", "1", "12", "123", "1234",}));
  3. 	private int tag;
  5. 	@Override
  6. 	protected void onCreate(Bundle savedInstanceState) {
  7. 		super.onCreate(savedInstanceState);
  8. 		setContentView(R.layout.activity_main);
  9. 		tag = getIntent().getIntExtra("tag", 0);
  11. 		//3、XML中设置Tab样式
  12. 		TabLayout tabLayout;
  13. 		if (tag != 3) {
  14. 			tabLayout = (TabLayout) findViewById(R.id.tablayout1);
  15. 			findViewById(R.id.tablayout1).setVisibility(View.VISIBLE);
  16. 		} else {
  17. 			tabLayout = (TabLayout) findViewById(R.id.tablayout2);
  18. 			findViewById(R.id.tablayout2).setVisibility(View.VISIBLE);
  19. 		}
  21. 		ViewPager viewPager = (ViewPager) findViewById(R.id.view_pager);
  22. 		viewPager.setAdapter(new FragmentPagerAdapter(getSupportFragmentManager()) {
  23. 			@Override
  24. 			public Fragment getItem(int position) {
  25. 				return MyFragment.newInstance(list.get(position));
  26. 			}
  28. 			@Override
  29. 			public int getCount() {
  30. 				return list.size();
  31. 			}
  33. 			@Override
  34. 			public CharSequence getPageTitle(int position) {
  35. 				if (tag == 0) return super.getPageTitle(position);
  36. 					//0、不重写ViewPager的getPageTitle方法，会导致TabLayout没有标题
  37. 				else return list.get(position);//因为返回值是CharSequence，所以可以返回一个内容丰富的SpannableString
  38. 			}
  39. 		});
  40. 		tabLayout.setupWithViewPager(viewPager);
  42. 		//1、默认MODE_FIXED模式，会将每个tab都显示出来，tab的宽度一样；MODE_SCROLLABLE会根据tab中的内容自动调整tab宽度
  43. 		if (tag != 1) tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE);
  45. 		//2、代码中设置Tab样式
  46. 		if (tag == 2) {
  47. 			tabLayout.setTabGravity(Gravity.TOP);//没卵用啊！
  48. 			tabLayout.setTabTextColors(Color.RED, Color.GREEN);
  49. 			tabLayout.setSelectedTabIndicatorColor(Color.BLUE);
  50. 			tabLayout.setSelectedTabIndicatorHeight(15);
  51. 			tabLayout.setBackgroundColor(Color.YELLOW);
  52. 		}
  53. 	}
  54. }

Activity2 样式

  1. public class Activity2 extends FragmentActivity {
  2. 	private List<String> list = new ArrayList<>(Arrays.asList(new String[]{"包青天", "白", "baiqiantao(注意大小写)", "1", "12", "123", "1234",}));
  3. 	private TabLayout tabLayout;
  4. 	private ViewPager viewPager;
  6. 	@Override
  7. 	protected void onCreate(Bundle savedInstanceState) {
  8. 		super.onCreate(savedInstanceState);
  9. 		setContentView(R.layout.activity_main);
  10. 		int tag = getIntent().getIntExtra("tag", 0);
  12. 		initView();
  14. 		if (tag != 5) {//是否自定义Tab，是否添加监听
  15. 			setCustomTabView();
  16. 			addOnTabSelectedListener();
  17. 		}
  18. 		if (tag != 6) {//是否自定义Tab间距
  19. 			tabLayout.post(new Runnable() {
  20. 				@Override
  21. 				public void run() {
  22. 					setIndicator(tabLayout, 1, 1);//必须在setupWithViewPager之后（数据确定后）才可以操作
  23. 				}
  24. 			});
  25. 		}
  26. 	}
  28. 	private void initView() {
  29. 		viewPager = (ViewPager) findViewById(R.id.view_pager);
  30. 		tabLayout = (TabLayout) findViewById(R.id.tablayout1);
  31. 		findViewById(R.id.tablayout1).setVisibility(View.VISIBLE);
  33. 		PagerAdapter adapter = new FragmentPagerAdapter(getSupportFragmentManager()) {
  34. 			@Override
  35. 			public Fragment getItem(int position) {
  36. 				return MyFragment.newInstance(list.get(position));
  37. 			}
  39. 			@Override
  40. 			public int getCount() {
  41. 				return list.size();
  42. 			}
  44. 			@Override
  45. 			public CharSequence getPageTitle(int position) {
  46. 				return list.get(position);
  47. 			}
  48. 		};
  49. 		viewPager.setAdapter(adapter);
  51. 		tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE);//可滚动模式，另一个是固定宽度模式
  52. 		tabLayout.setupWithViewPager(viewPager);
  53. 	}
  55. 	/**
  56. 	 * 使用自定义的Tab，设置后要自己控制每个Tab的文字以及【默认】选中Tab的样式（比如默认第一个Tab要显示indicator等）
  57. 	 */
  58. 	private void setCustomTabView() {
  59. 		tabLayout.setSelectedTabIndicatorHeight(0);
  61. 		for (int i = 0; i < list.size(); i++) {//必须在setupWithViewPager之后（即被绑定VP的数据确定后）才可以操作
  62. 			View view = LayoutInflater.from(this).inflate(R.layout.item_tab, null);
  64. 			TextView tv_tab_name = (TextView) view.findViewById(R.id.tv_tab_name);
  65. 			View line_indicator = view.findViewById(R.id.line_indicator);
  66. 			tv_tab_name.setText(list.get(i));//控制每个Tab的文字
  67. 			if (i == 0) {//控制默认选中Tab的样式
  68. 				view.setSelected(true);//背景样式
  69. 				line_indicator.setSelected(true);//指示器样式
  70. 			} else {
  71. 				view.setSelected(false);
  72. 				line_indicator.setSelected(false);
  73. 			}
  75. 			TabLayout.Tab tab = tabLayout.getTabAt(i);//获得每一个tab
  76. 			if (tab != null) tab.setCustomView(view);//给每一个tab设置view
  77. 		}
  78. 	}
  80. 	/**
  81. 	 * 添加监听，当使用自定义的Tab时，要自己控制选中Tab【改变】时Tab的样式，以及ViewPager的当前Item
  82. 	 */
  83. 	private void addOnTabSelectedListener() {
  84. 		tabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
  85. 			@Override
  86. 			public void onTabSelected(TabLayout.Tab tab) {
  87. 				if (tab.getCustomView() != null) {
  88. 					tab.getCustomView().setSelected(true);//要自己控制选中Tab改变时Tab的样式
  89. 					tab.getCustomView().findViewById(R.id.line_indicator).setSelected(true);
  90. 					viewPager.setCurrentItem(tab.getPosition());//要自己控制ViewPager的当前Item
  91. 				}
  92. 			}
  94. 			@Override
  95. 			public void onTabUnselected(TabLayout.Tab tab) {
  96. 				if (tab.getCustomView() != null) {
  97. 					tab.getCustomView().setSelected(false);
  98. 					tab.getCustomView().findViewById(R.id.line_indicator).setSelected(false);
  99. 				}
  100. 			}
  102. 			@Override
  103. 			public void onTabReselected(TabLayout.Tab tab) {
  104. 			}
  105. 		});
  106. 	}
  108. 	/**
  109. 	 * 自定义Indicator左右间距。适用于自定义Tab的情况下，在使用默认Tab时，通过tabPadding设置既可以了
  110. 	 * 注意：除了tabPadding外，tabMinWidth的值也会影响Tab的宽度，特别是1-2两字符时，会非常明显
  111. 	 */
  112. 	public static void setIndicator(TabLayout tabs, int leftDip, int rightDip) {
  113. 		try {
  114. 			Class<?> tabLayout = tabs.getClass();
  115. 			Field tabStrip = tabLayout.getDeclaredField("mTabStrip");
  116. 			tabStrip.setAccessible(true);
  118. 			int left = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, leftDip, Resources.getSystem().getDisplayMetrics());
  119. 			int right = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, rightDip, Resources.getSystem().getDisplayMetrics());
  121. 			LinearLayout llTab = (LinearLayout) tabStrip.get(tabs);
  122. 			for (int i = 0; i < llTab.getChildCount(); i++) {
  123. 				View child = llTab.getChildAt(i);
  124. 				child.setPadding(0, 0, 0, 0);
  125. 				LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(0, LinearLayout.LayoutParams.MATCH_PARENT, 1);
  126. 				params.leftMargin = left;
  127. 				params.rightMargin = right;
  128. 				child.setLayoutParams(params);
  129. 				child.invalidate();
  130. 			}
  131. 		} catch (Exception e) {
  132. 			e.printStackTrace();
  133. 		}
  134. 	}
  135. }

Activity3 样式

  1. public class Activity3 extends FragmentActivity implements View.OnClickListener {
  2. 	private List<String> list = new ArrayList<>(Arrays.asList(new String[]{"包青天", "白", "baiqiantao(注意大小写)", "1", "12", "123", "1234",}));
  3. 	
  4. 	private TabLayout tabLayout;
  5. 	private ViewPager viewPager;
  6. 	private int tag;
  7. 	private static final int OFFSET = 10086;
  8. 	
  9. 	@Override
  10. 	protected void onCreate(Bundle savedInstanceState) {
  11. 		super.onCreate(savedInstanceState);
  12. 		setContentView(R.layout.activity_main);
  13. 		tag = getIntent().getIntExtra("tag", 0);
  14. 		initView();
  15. 		setCustomTabView();
  16. 		addOnTabSelectedListener();
  17. 		
  18. 		tabLayout.post(new Runnable() {
  19. 			@Override
  20. 			public void run() {
  21. 				setIndicator(tabLayout, 1, 1);//必须在setupWithViewPager之后（数据确定后）才可以操作
  22. 			}
  23. 		});
  24. 	}
  25. 	
  26. 	private void initView() {
  27. 		viewPager = (ViewPager) findViewById(R.id.view_pager);
  28. 		tabLayout = (TabLayout) findViewById(R.id.tablayout1);
  29. 		findViewById(R.id.tablayout1).setVisibility(View.VISIBLE);
  30. 		
  31. 		PagerAdapter adapter = new FragmentPagerAdapter(getSupportFragmentManager()) {
  32. 			@Override
  33. 			public Fragment getItem(int position) {
  34. 				return MyFragment.newInstance(list.get(position));
  35. 			}
  36. 			
  37. 			@Override
  38. 			public int getCount() {
  39. 				return list.size();
  40. 			}
  41. 			
  42. 			@Override
  43. 			public CharSequence getPageTitle(int position) {
  44. 				return list.get(position);
  45. 			}
  46. 		};
  47. 		viewPager.setAdapter(adapter);
  48. 		
  49. 		tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE);
  50. 		tabLayout.setupWithViewPager(viewPager);
  51. 	}
  52. 	
  53. 	private void setCustomTabView() {
  54. 		tabLayout.setSelectedTabIndicatorHeight(0);
  55. 		
  56. 		for (int i = 0; i < list.size(); i++) {//必须在setupWithViewPager之后（数据确定后）才可以操作
  57. 			View view = LayoutInflater.from(this).inflate(R.layout.item_tab, null);
  58. 			
  59. 			//注意：给view添加点击事件后，点击Tab后的点击事件会被这里的view消耗掉，所以Tab自身的点击事件不会响应
  60. 			//也即点击Tab后将不会触发OnTabSelectedListener，也不会自动切换VP，这些都需要我们自己手动处理
  61. 			if (i <= 3) {
  62. 				view.setTag(i + OFFSET);
  63. 				view.setOnClickListener(this);
  64. 			}
  65. 			
  66. 			TextView tv_tab_name = (TextView) view.findViewById(R.id.tv_tab_name);
  67. 			View line_indicator = view.findViewById(R.id.line_indicator);
  68. 			tv_tab_name.setText(list.get(i));
  69. 			if (i == 0) {
  70. 				view.setSelected(true);
  71. 				line_indicator.setSelected(true);
  72. 			} else {
  73. 				view.setSelected(false);
  74. 				line_indicator.setSelected(false);
  75. 			}
  76. 			
  77. 			TabLayout.Tab tab = tabLayout.getTabAt(i);//获得每一个tab
  78. 			if (tab != null) tab.setCustomView(view);//给每一个tab设置view
  79. 		}
  80. 	}
  81. 	
  82. 	private void addOnTabSelectedListener() {
  83. 		tabLayout.addOnTabSelectedListener(new TabLayout.OnTabSelectedListener() {
  84. 			@Override
  85. 			public void onTabSelected(TabLayout.Tab tab) {
  86. 				if (tab.getCustomView() != null) {
  87. 					tab.getCustomView().setSelected(true);
  88. 					tab.getCustomView().findViewById(R.id.line_indicator).setSelected(true);
  89. 					viewPager.setCurrentItem(tab.getPosition());
  90. 				}
  91. 			}
  92. 			
  93. 			@Override
  94. 			public void onTabUnselected(TabLayout.Tab tab) {
  95. 				if (tab.getCustomView() != null) {
  96. 					tab.getCustomView().setSelected(false);
  97. 					tab.getCustomView().findViewById(R.id.line_indicator).setSelected(false);
  98. 				}
  99. 			}
  100. 			
  101. 			@Override
  102. 			public void onTabReselected(TabLayout.Tab tab) {
  103. 			}
  104. 		});
  105. 	}
  106. 	
  107. 	/**
  108. 	 * 自定义Indicator左右间距。适用于自定义Tab的情况下，在使用默认Tab时，通过tabPadding设置既可以了
  109. 	 * 注意：除了tabPadding外，tabMinWidth的值也会影响Tab的宽度，特别是1-2两字符时，会非常明显
  110. 	 */
  111. 	public static void setIndicator(TabLayout tabs, int leftDip, int rightDip) {
  112. 		try {
  113. 			Class<?> tabLayout = tabs.getClass();
  114. 			Field tabStrip = tabLayout.getDeclaredField("mTabStrip");
  115. 			tabStrip.setAccessible(true);
  116. 			
  117. 			int left = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, leftDip, Resources.getSystem().getDisplayMetrics());
  118. 			int right = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, rightDip, Resources.getSystem().getDisplayMetrics());
  119. 			
  120. 			LinearLayout llTab = (LinearLayout) tabStrip.get(tabs);
  121. 			for (int i = 0; i < llTab.getChildCount(); i++) {
  122. 				View child = llTab.getChildAt(i);
  123. 				child.setPadding(0, 0, 0, 0);
  124. 				LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(0, LinearLayout.LayoutParams.MATCH_PARENT, 1);
  125. 				params.leftMargin = left;
  126. 				params.rightMargin = right;
  127. 				child.setLayoutParams(params);
  128. 				child.invalidate();
  129. 			}
  130. 		} catch (Exception e) {
  131. 			e.printStackTrace();
  132. 		}
  133. 	}
  134. 	
  135. 	@Override
  136. 	public void onClick(View v) {
  137. 		if (tag != 7) {
  138. 			int currentTabPosition = (int) v.getTag() - OFFSET;
  139. 			if (currentTabPosition >= 0 && currentTabPosition < tabLayout.getTabCount()) {
  140. 				reSetTabLayout(currentTabPosition);
  141. 				//setCurrentItem时，当点击最边缘那个Tab后，TabLayout也会像之前那样，将被点击的那个Tab滚动到屏幕中间
  142. 				viewPager.setCurrentItem(currentTabPosition);
  143. 			}
  144. 		}
  145. 		Toast.makeText(this, "我们需要自己手动处理点击Tab后所有变化", Toast.LENGTH_SHORT).show();
  146. 	}
  147. 	
  148. 	private void reSetTabLayout(int currentTabPosition) {
  149. 		for (int j = 0, count = tabLayout.getTabCount(); j < count; j++) {
  150. 			TabLayout.Tab tab = tabLayout.getTabAt(j);
  151. 			if (tab != null) {
  152. 				View view = tab.getCustomView();
  153. 				if (view != null) {
  154. 					TextView tv_tab_name = (TextView) view.findViewById(R.id.tv_tab_name);
  155. 					View line_indicator = view.findViewById(R.id.line_indicator);
  156. 					tv_tab_name.setText(list.get(j));
  157. 					if (j == currentTabPosition) {
  158. 						view.setSelected(true);
  159. 						line_indicator.setSelected(true);
  160. 					} else {
  161. 						view.setSelected(false);
  162. 						line_indicator.setSelected(false);
  163. 					}
  164. 				}
  165. 			}
  166. 		}
  167. 	}
  168. }

Activity_VP1 样式

  1. public class Activity_VP1 extends FragmentActivity {
  2. 	/**
  3. 	 * 此Demo演示：不保存Fragment的引用，当adapter调用getItem时去【重新创建】新的Fragment
  4. 	 */
  5. 	private List<String> list = new ArrayList<>(Arrays.asList(new String[]{"白", "1", "2", "3", "4", "5", "6", "7", "8",}));
  6. 	private PagerAdapter adapter;
  8. 	@Override
  9. 	protected void onCreate(Bundle savedInstanceState) {
  10. 		super.onCreate(savedInstanceState);
  11. 		setContentView(R.layout.activity_main);
  12. 		findViewById(R.id.tv_add).setVisibility(View.VISIBLE);
  13. 		findViewById(R.id.tv_remove).setVisibility(View.VISIBLE);
  14. 		ViewPager viewPager = (ViewPager) findViewById(R.id.view_pager);
  16. 		//1、必须使用【FragmentStatePagerAdapter】，而不能使用FragmentPagerAdapter
  17. 		adapter = new FragmentStatePagerAdapter(getSupportFragmentManager()) {
  18. 			@Override
  19. 			public Fragment getItem(int position) {
  20. 				return MyFragment.newInstance(list.get(position));//每次都是创建新的Fragment
  21. 			}
  23. 			@Override
  24. 			public int getCount() {
  25. 				return list.size();
  26. 			}
  28. 			//2、必须重写getItemPosition，并且返回【PagerAdapter.POSITION_NONE】
  29. 			@Override
  30. 			public int getItemPosition(Object object) {
  31. 				return PagerAdapter.POSITION_NONE;
  32. 			}
  33. 		};
  34. 		viewPager.setAdapter(adapter);
  35. 	}
  37. 	public void add(View view) {
  38. 		list.add(0, new SimpleDateFormat("yyyy.MM.dd HH:mm:ss", Locale.getDefault()).format(new Date()));
  39. 		adapter.notifyDataSetChanged();
  40. 	}
  42. 	public void remove(View view) {
  43. 		if (list.size() > 0) list.remove(0);
  44. 		adapter.notifyDataSetChanged();
  45. 	}
  46. }

Activity_VP2 样式

  1. public class Activity_VP2 extends FragmentActivity {
  2. 	/**
  3. 	 * 此Demo演示：保存所有Fragment的引用，当adapter调用getItem时去【获取】已经创建的Fragment
  4. 	 */
  5. 	private List<Fragment> fragments;
  6. 	private PagerAdapter adapter;
  8. 	@Override
  9. 	protected void onCreate(Bundle savedInstanceState) {
  10. 		super.onCreate(savedInstanceState);
  11. 		setContentView(R.layout.activity_main);
  12. 		findViewById(R.id.tv_add).setVisibility(View.VISIBLE);
  13. 		findViewById(R.id.tv_remove).setVisibility(View.VISIBLE);
  14. 		ViewPager viewPager = (ViewPager) findViewById(R.id.view_pager);
  16. 		String[] array = new String[]{"baiqiantao", "白", "包青天", "白乾涛", "1", "2", "3", "4", "5", "6", "7", "8",};
  17. 		fragments = new ArrayList<>();
  18. 		for (String string : array) {
  19. 			fragments.add(MyFragment.newInstance(string));
  20. 		}
  22. 		//1、必须使用【FragmentStatePagerAdapter】，而不能使用FragmentPagerAdapter
  23. 		adapter = new FragmentStatePagerAdapter(getSupportFragmentManager()) {
  25. 			@Override
  26. 			public Fragment getItem(int position) {
  27. 				return fragments.get(position);//这里的Fragment都是已经创建好的，而不是getItem时重新创建的
  28. 			}
  30. 			@Override
  31. 			public int getCount() {
  32. 				return fragments.size();
  33. 			}
  35. 			//2、必须重写getItemPosition，并且返回【PagerAdapter.POSITION_NONE】
  36. 			@Override
  37. 			public int getItemPosition(Object object) {
  38. 				return POSITION_NONE;
  39. 			}
  40. 		};
  41. 		viewPager.setAdapter(adapter);
  42. 	}
  44. 	public void add(View view) {
  45. 		String data = new SimpleDateFormat("yyyy.MM.dd HH:mm:ss", Locale.getDefault()).format(new Date());
  46. 		fragments.add(0, MyFragment.newInstance(data));
  47. 		setFragments(fragments);
  48. 	}
  50. 	public void remove(View view) {
  51. 		if (fragments.size() > 0) fragments.remove(0);
  52. 		setFragments(fragments);
  53. 	}
  55. 	public void setFragments(List<Fragment> fragments) {
  56. 		FragmentTransaction ft = getSupportFragmentManager().beginTransaction();
  57. 		for (Fragment f : fragments) {
  58. 			ft.remove(f);
  59. 		}
  60. 		ft.commit();
  61. 		getSupportFragmentManager().executePendingTransactions();
  62. 		this.fragments = fragments;
  63. 		adapter.notifyDataSetChanged();
  64. 	}
  65. }

XML布局

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <LinearLayout
  3.     xmlns:android="http://schemas.android.com/apk/res/android"
  4.     xmlns:app="http://schemas.android.com/apk/res-auto"
  5.     android:layout_width="match_parent"
  6.     android:layout_height="match_parent"
  7.     android:orientation="vertical">
  9.     <TextView
  10.         android:id="@+id/tv_add"
  11.         android:layout_width="match_parent"
  12.         android:layout_height="50dp"
  13.         android:background="@color/colorAccent"
  14.         android:gravity="center"
  15.         android:onClick="add"
  16.         android:text="添加一个Item"
  17.         android:visibility="gone"/>
  19.     <TextView
  20.         android:id="@+id/tv_remove"
  21.         android:layout_width="match_parent"
  22.         android:layout_height="50dp"
  23.         android:background="@color/colorPrimary"
  24.         android:gravity="center"
  25.         android:onClick="remove"
  26.         android:text="移除一个Item"
  27.         android:visibility="gone"/>
  29.     <android.support.design.widget.TabLayout
  30.         android:id="@+id/tablayout1"
  31.         android:layout_width="match_parent"
  32.         android:layout_height="wrap_content"
  33.         android:visibility="gone"
  34.         app:theme="@style/Widget.Design.TabLayout"/>
  36.     <android.support.design.widget.TabLayout
  37.         android:id="@+id/tablayout2"
  38.         style="@style/MyTabStyle"
  39.         android:layout_width="match_parent"
  40.         android:layout_height="wrap_content"
  41.         android:visibility="gone"
  42.         app:tabTextAppearance="@style/MyTabTextAppearance"/>
  44.     <android.support.v4.view.ViewPager
  45.         android:id="@+id/view_pager"
  46.         android:layout_width="match_parent"
  47.         android:layout_height="match_parent"/>
  48. </LinearLayout>

自定义Tab的布局

  1. <?xml version="1.0" encoding="utf-8"?>
  2. <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  3.                 android:layout_width="50dp"
  4.                 android:layout_height="35dp"
  5.                 android:background="@drawable/sel_tab_bgcolor">
  7.     <TextView
  8.         android:id="@+id/tv_tab_name"
  9.         android:layout_width="wrap_content"
  10.         android:layout_height="match_parent"
  11.         android:layout_centerInParent="true"
  12.         android:ellipsize="end"
  13.         android:gravity="center"
  14.         android:maxEms="3"
  15.         android:maxLines="1"
  16.         android:text="热门热门热门热门"
  17.         android:textColor="@drawable/sel_tab_textcolor"
  18.         android:textSize="12sp"/>
  20.     <TextView
  21.         android:id="@+id/line_indicator"
  22.         android:layout_width="40dp"
  23.         android:layout_height="3dp"
  24.         android:layout_alignParentBottom="true"
  25.         android:layout_centerHorizontal="true"
  26.         android:background="@drawable/sel_tab_indicator"/>
  27. </RelativeLayout>

选择器

sel_tab_textcolor
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <selector xmlns:android="http://schemas.android.com/apk/res/android">
  3.     <item android:color="#f00" android:state_selected="true"/>
  4.     <item android:color="#00f"/>
  5. </selector>
sel_tab_bgcolor 和 sel_tab_indicator
  1. <?xml version="1.0" encoding="utf-8"?>
  2. <selector xmlns:android="http://schemas.android.com/apk/res/android">
  3.     <item android:state_selected="true">
  4.         <shape>
  5.             <corners android:radius="2dp"/>
  6.             <solid android:color="#f00"/>
  7.         </shape>
  8.     </item>
  9.     <item>
  10.         <shape>
  11.             <corners android:radius="2dp"/>
  12.             <solid android:color="#00f"/>
  13.         </shape>
  14.     </item>
  15. </selector>

定义的样式

  1. <style name="MyTabStyle" parent="Widget.Design.TabLayout">
  2. 	<item name="android:background">@android:color/holo_green_dark</item><!--此背景会被tabBackground覆盖掉-->
  3. 	<item name="tabBackground">@android:color/holo_orange_dark</item><!--"通常"和background的效果完全一样-->
  5. 	<item name="tabContentStart">20dp</item><!--此值导致左边一块区域属于background，但不属于tabBackground-->
  6. 	<item name="tabGravity">fill</item><!--只能是fill或center，貌似没有卵用啊-->
  7. 	<item name="tabIndicatorHeight">5dp</item>
  8. 	<item name="tabIndicatorColor">#f00</item>
  10. 	<item name="tabMaxWidth">120dp</item>
  11. 	<item name="tabMinWidth">20dp</item>
  12. 	<item name="tabPadding">0dp</item>
  14. 	<item name="tabMode">scrollable</item>
  15. 	<item name="tabSelectedTextColor">#f00</item>
  17. 	<!--以下属性貌似都无效！-->
  18. 	<item name="android:ellipsize">end</item>
  19. 	<item name="android:maxLines">1</item>
  20. 	<item name="android:gravity">top</item>
  21. 	<item name="android:textColor">#fff</item>
  22. </style>
  24. <style name="MyTabTextAppearance" parent="TextAppearance.Design.Tab"><!--必须继承自TextAppearance.Design.Tab -->
  25. 	<!--只支持以下三个属性-->
  26. 	<item name="android:textSize">15sp</item>
  27. 	<item name="android:textAllCaps">false</item>
  28. 	<!--选择器无效！除非根据tab的选中状态手动设置-->
  29. 	<item name="android:textColor">@drawable/sel_tab_textcolor</item>
  30. </style>
2017-6-28




TabLayout 和 ViewPager【综合示例】

标签：cte   break   find   ++   []   数据   tag   str   随机   

原文地址：http://www.cnblogs.com/baiqiantao/p/7090978.html
踩
(0)
赞
(0)
   
举报
评论 一句话评论（0）
登录后才能评论！
分享档案
更多>
2021年07月29日 (22)
2021年07月28日 (40)
2021年07月27日 (32)
2021年07月26日 (79)
2021年07月23日 (29)
2021年07月22日 (30)
2021年07月21日 (42)
2021年07月20日 (16)
2021年07月19日 (90)
2021年07月16日 (35)
周排行
mamicode.com排行更多图片
更多
友情链接
兰亭集智   国之画   百度统计   站长统计   阿里云   chrome插件   新版天听网
关于我们 - 联系我们 - 留言反馈
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码！