Android快速开发02之仿京东底部Tab
16lz
2022-01-28
自上一篇介绍了Android快速开发之封装标题栏效果是显而易见的。接下来我们对底部Tab也进行封装。
效果:
然而实现的代码也就这么几行:
public class MainActivity extends BottomTabBaseActivity { @Override protected List getTabViews() { List tabItemViews = new ArrayList<>(); tabItemViews.add(new BottomTabView.TabItemView(this,"首页",R.color.bottom_text_nor, R.color.bottom_text_pre,R.drawable.ic_home_norl,R.drawable.ic_home_pre)); tabItemViews.add(new BottomTabView.TabItemView(this,"分类",R.color.bottom_text_nor, R.color.bottom_text_pre,R.drawable.ic_classify_nor,R.drawable.ic_classify_pre)); tabItemViews.add(new BottomTabView.TabItemView(this,"发现",R.color.bottom_text_nor, R.color.bottom_text_pre,R.drawable.ic_find_nor,R.drawable.ic_find_pre)); /*tabItemViews.add(new BottomTabView.TabItemView(this,"购物车",R.color.bottom_text_nor, R.color.bottom_text_pre,R.drawable.ic_car_nor,R.drawable.ic_car_pre));*/ tabItemViews.add(new BottomTabView.TabItemView(this,"我的",R.color.bottom_text_nor, R.color.bottom_text_pre,R.drawable.ic_mine_noe,R.drawable.ic_mine_pre)); return tabItemViews; } @Override protected List getFragments() { List fragments = new ArrayList<>(); fragments.add(new HomeFragment()); fragments.add(new ClassifyFragment()); fragments.add(new FindFragment()); /*fragments.add(new ShopCarFragment());*/ fragments.add(new MineFragment()); return fragments; }}
添加 CenterView 也很简单,只需重写 getCenterView 方法并返回你想添加的 View。
@Overrideprotected View getCenterView() { ImageView centerView = new ImageView(this); centerView.setImageResource(R.mipmap.ic_launcher_round);centerView.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { Toast.makeText(MainActivity.this,"中间图标被点击了",Toast.LENGTH_SHORT).show(); } }); return centerView; }
1,底部的BottomTabView.java
package com.gyq.topbarfast.view;import android.content.Context;import android.support.annotation.Nullable;import android.support.v4.content.ContextCompat;import android.support.v4.view.ViewPager;import android.util.AttributeSet;import android.view.LayoutInflater;import android.view.View;import android.view.ViewGroup;import android.widget.ImageView;import android.widget.LinearLayout;import android.widget.TextView;import com.gyq.topbarfast.R;import java.util.List;/** * Created by gyq on 2017/5/18 10:24 */public class BottomTabView extends LinearLayout { /** * 记录最新的选择位置 */ private int lastPosition = -1; /** * 所有 TabItem 的集合 */ private List tabItemViews; public BottomTabView(Context context) { super(context); } public BottomTabView(Context context, @Nullable AttributeSet attrs) { super(context, attrs); } public BottomTabView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); } /** * 连接 Viewpager * @param viewPager */ public void setUpWithViewPager(final ViewPager viewPager){ viewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() { @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { } @Override public void onPageSelected(int position) { updatePosition(position); } @Override public void onPageScrollStateChanged(int state) { } }); setOnTabItemSelectListener(new OnTabItemSelectListener() { @Override public void onTabItemSelect(int position) { viewPager.setCurrentItem(position); } }); } /** * 设置 Tab Item View */ public void setTabItemViews(List tabItemViews){ setTabItemViews(tabItemViews, null); } /** * 设置 Tab Item View */ public void setTabItemViews(List tabItemViews, View centerView){ if (this.tabItemViews != null){ throw new RuntimeException("不能重复设置!"); } if (tabItemViews == null || tabItemViews.size() < 2){ throw new RuntimeException("TabItemView 的数量必须大于2!"); } this.tabItemViews = tabItemViews; for (int i=0; i
2,view_tab_item.xml
<?xml version="1.0" encoding="utf-8"?>
3,BottomTabBaseActivity.java
package com.gyq.topbarfast;import android.os.Bundle;import android.support.v4.app.Fragment;import android.support.v4.app.FragmentPagerAdapter;import android.support.v4.view.ViewPager;import android.support.v7.app.AppCompatActivity;import android.view.View;import com.gyq.topbarfast.view.BottomTabView;import java.util.List;public abstract class BottomTabBaseActivity extends AppCompatActivity { private BottomTabView bottomTabView; private FragmentPagerAdapter mAdapter; private ViewPager mViewPager; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_bottom_tab_base); bottomTabView = (BottomTabView)findViewById(R.id.bottom_tab_view); mViewPager = (ViewPager)findViewById(R.id.viewPager); if (getCenterView() == null) { bottomTabView.setTabItemViews(getTabViews()); }else { bottomTabView.setTabItemViews(getTabViews(),getCenterView()); } mAdapter = new FragmentPagerAdapter(getSupportFragmentManager()) { @Override public Fragment getItem(int position) { return getFragments().get(position); } @Override public int getCount() { return getFragments().size(); } }; mViewPager.setAdapter(mAdapter); bottomTabView.setOnTabItemSelectListener(new BottomTabView.OnTabItemSelectListener() { @Override public void onTabItemSelect(int position) { mViewPager.setCurrentItem(position,true); } }); mViewPager.addOnPageChangeListener(new ViewPager.OnPageChangeListener() { @Override public void onPageScrolled(int position, float positionOffset, int positionOffsetPixels) { } @Override public void onPageSelected(int position) { bottomTabView.updatePosition(position); //bottomtab同步切换选中位置 } @Override public void onPageScrollStateChanged(int state) { } }); } protected abstract List getTabViews(); protected abstract List getFragments(); protected View getCenterView() { return null; }}
5,activity_bottom_tab_base.xml布局文件:
<?xml version="1.0" encoding="utf-8"?>
6,MainActivity.java
package com.gyq.topbarfast;import android.support.v4.app.Fragment;import android.view.View;import android.widget.ImageView;import android.widget.LinearLayout;import android.widget.Toast;import com.gyq.topbarfast.fragment.ClassifyFragment;import com.gyq.topbarfast.fragment.FindFragment;import com.gyq.topbarfast.fragment.HomeFragment;import com.gyq.topbarfast.fragment.MineFragment;import com.gyq.topbarfast.view.BottomTabView;import java.util.ArrayList;import java.util.List;public class MainActivity extends BottomTabBaseActivity { @Override protected List getTabViews() { List tabItemViews = new ArrayList<>(); tabItemViews.add(new BottomTabView.TabItemView(this,"首页",R.color.bottom_text_nor, R.color.bottom_text_pre,R.drawable.ic_home_norl,R.drawable.ic_home_pre)); tabItemViews.add(new BottomTabView.TabItemView(this,"分类",R.color.bottom_text_nor, R.color.bottom_text_pre,R.drawable.ic_classify_nor,R.drawable.ic_classify_pre)); tabItemViews.add(new BottomTabView.TabItemView(this,"发现",R.color.bottom_text_nor, R.color.bottom_text_pre,R.drawable.ic_find_nor,R.drawable.ic_find_pre)); //第二效果 /*tabItemViews.add(new BottomTabView.TabItemView(this,"购物车",R.color.bottom_text_nor, R.color.bottom_text_pre,R.drawable.ic_car_nor,R.drawable.ic_car_pre));*/ tabItemViews.add(new BottomTabView.TabItemView(this,"我的",R.color.bottom_text_nor, R.color.bottom_text_pre,R.drawable.ic_mine_noe,R.drawable.ic_mine_pre)); return tabItemViews; } @Override protected List getFragments() { List fragments = new ArrayList<>(); fragments.add(new HomeFragment()); fragments.add(new ClassifyFragment()); fragments.add(new FindFragment()); //第二效果 /*fragments.add(new ShopCarFragment());*/ fragments.add(new MineFragment()); return fragments; } @Override protected View getCenterView() { //较灵活的一种方法 /*View centerView = LayoutInflater.from(this).inflate(R.layout.center_view, null); centerView.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { Toast.makeText(MainActivity.this,"中间图标被点击了",Toast.LENGTH_SHORT).show(); } }); return centerView;*/ ImageView centerView = new ImageView(this); centerView.setImageResource(R.mipmap.ic_launcher_round); LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(200,200); params.leftMargin = 60; params.rightMargin = 60; params.bottomMargin = 0; centerView.setLayoutParams(params); centerView.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { Toast.makeText(MainActivity.this,"中间图标被点击了",Toast.LENGTH_SHORT).show(); } }); return centerView; }}
更多相关文章
- Android学习笔记1-Activity的Lifecycle和Launch Mode
- android 3D gallery 并 判断当前选中项
- android 隐藏状态栏和导航栏
- android wifi状态更新
- android 飞行模式 注册广播后 三种状态监听
- android 3D gallery 并 判断当前选中项
- Android中的ListView实现图片文字和按钮
- android - 购物车页面【仿】京东App
- Material Design