网站建设尺寸像素是多少,wordpress 商城聊天,大学生饮料营销策划方案创意,上海装修公司咨询Android仿微信滑动切换最终实现效果#xff1a;大体思路#xff1a;1. 主要使用两个自定义View配合实现; 底部图标加文字为一个自定义view,底部导航栏为一个载体,根据需要来添加底部图标;2. 底部导航栏的设置方法类似于TabLayout的关联,View需要创建关联方法,用来关联VIewPag…Android仿微信滑动切换最终实现效果大体思路1. 主要使用两个自定义View配合实现; 底部图标加文字为一个自定义view,底部导航栏为一个载体,根据需要来添加底部图标;2. 底部导航栏的设置方法类似于TabLayout的关联,View需要创建关联方法,用来关联VIewPager;3. 通过关联方法获取ViewPager实例后,根据ViewPager页面数创建底部导航栏的图标按钮;代码实现:1. 新建第一个自定义View, 图标 文字 的底部按钮;/*** 自定义控件,该控件为底部导航栏中的图标* Created by MrZheng on 2017/8/2.*/public class TabView extends LinearLayout {BotBean mBean;private TextView title;private ImageView iconImage;/*** 引用此控件,只能通过new 方法;接收一个TabView* param context*/public TabView(Context context, BotBean bean) {super(context);this.mBean bean;initView();}/*** 初始化布局*/public void initView() {setOrientation(VERTICAL);setGravity(Gravity.CENTER);//添加小图标iconImage new ImageView(getContext());LinearLayout.LayoutParams layoutParams new LinearLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);iconImage.setLayoutParams(layoutParams);iconImage.setImageResource(mBean.getUncheckedId());Drawable drawable getContext().getResources().getDrawable(mBean.getUncheckedId());Drawable wrapDrawable DrawableCompat.wrap(drawable);DrawableCompat.setTintList(wrapDrawable, ColorStateList.valueOf(Color.BLACK));iconImage.setImageDrawable(wrapDrawable);addView(iconImage);//标题title new TextView(getContext());LinearLayout.LayoutParams titleParams new LayoutParams(LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT);title.setLayoutParams(titleParams);title.setText(mBean.getContent());addView(title);}//判断选择状态,改变图标//供外部调用public void setSelected(boolean isSelected) {if (mBean null) {return;}if (isSelected) {if (iconImage ! null) {//使用颜色过滤器,改变选中时的颜色Drawable drawable getContext().getResources().getDrawable(mBean.getUncheckedId());Drawable wrapDrawable DrawableCompat.wrap(drawable);DrawableCompat.setTintList(wrapDrawable, ColorStateList.valueOf(Color.GREEN));iconImage.setImageDrawable(wrapDrawable);title.setTextColor(Color.GREEN);}} else {if (title ! null) {// iconImage.setImageResource(mBean.getUncheckedId());Drawable drawable getContext().getResources().getDrawable(mBean.getUncheckedId());Drawable wrapDrawable DrawableCompat.wrap(drawable);DrawableCompat.setTintList(wrapDrawable, ColorStateList.valueOf(Color.BLACK));iconImage.setImageDrawable(wrapDrawable);title.setTextColor(Color.GRAY);}}}}2. 创建第二个自定义View,该View为底部导航栏载体,根据 关联的ViewPager页面 个数创建 底部导航栏图标;/*** 该控件为底部导航栏图标载体* Created by MrZheng on 2017/8/2.*/public class bottomView extends LinearLayout {private ViewPager vp;BottomPageChangeListener mBottomPageChangeListener;public bottomView(Context context) {super(context);}public bottomView(Context context, Nullable AttributeSet attrs) {super(context, attrs);}public bottomView(Context context, Nullable AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);}/*** 同TabLayout用法相似,需要与ViewPager进行绑定*/public void setViewPager(ViewPager viewPager, ArrayList botBeen,BottomPageChangeListener bottomPageChangeListener) {if (viewPager null) {return;}vp viewPager;mBottomPageChangeListener bottomPageChangeListener;initTabView(botBeen);//设置ViewPager的点击事件vp.addOnPageChangeListener(new ViewPager.SimpleOnPageChangeListener(){Overridepublic void onPageSelected(int position) {for (int i 0; i getChildCount(); i) {getChildAt(i).setSelected((position i ? true : false));}if (mBottomPageChangeListener ! null) {mBottomPageChangeListener.onPageChangeListener(position);}}});}/*** 初始化底部导航栏,ViewPager有多少页,就创建多少个图标*/public void initTabView(ArrayList botBeen) {setGravity(HORIZONTAL);for (int i 0; i botBeen.size(); i) {BotBean bean botBeen.get(i);TabView tabView new TabView(getContext(), bean);LinearLayout.LayoutParams params new LinearLayout.LayoutParams(ViewGroup.LayoutParams.WRAP_CONTENT, ViewGroup.LayoutParams.WRAP_CONTENT);params.weight 1;params.gravity Gravity.CENTER;tabView.setLayoutParams(params);//为每个view设置点击事件,点击跳转过去final int finalI i;tabView.setOnClickListener(new OnClickListener() {Overridepublic void onClick(View view) {vp.setCurrentItem(finalI);}});//设置一开始选中状态if (i 0) {tabView.setSelected(true);//由于初始化时,onPageSelected()选中方法并没有的到执行,所以主动去调用回调方法if (mBottomPageChangeListener ! null) {mBottomPageChangeListener.onPageChangeListener(i);}}addView(tabView);}}/*** 提供接口回调方法,每次滑动都通知外界*/public interface BottomPageChangeListener{void onPageChangeListener(int position);}}3. 添加 图标自定义类, 该类封装着底部导航栏中每一个选项的的图标和文字,将该类型对象添加到集合中,用于给底部导航栏设置图标;/*** 底部导航栏的封装类,该类对象用于在底部导航栏添加对应图标和文字* Created by MrZheng on 2017/8/2.*/public class BotBean {String content;//图标名字int uncheckedId;//未选中时的图标public BotBean(String content, int uncheckedId) {this.content content;this.uncheckedId uncheckedId;}public String getContent() {return content;}public void setContent(String content) {this.content content;}public int getUncheckedId() {return uncheckedId;}public void setUncheckedId(int uncheckedId) {this.uncheckedId uncheckedId;}}自定义View实现完成,在Fragment或Activity中使用该View:1. 在布局文件中添加:android:idid/bottomandroid:layout_widthmatch_parentandroid:layout_height60dp2. 在活动或碎片中添加:public class MainActivity extends AppCompatActivity {ArrayList mFragments;ArrayList mItemIcon;//存放底部图标和文字private TextView tv;Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);mFragments new ArrayList();mItemIcon new ArrayList();mFragments.add(new TextFragment());mFragments.add(new TextFragment());mFragments.add(new TextFragment());mFragments.add(new TextFragment());mItemIcon.add(new BotBean(首页, R.mipmap.ic_home2));mItemIcon.add(new BotBean(通讯录, R.mipmap.ic_study2));mItemIcon.add(new BotBean(发现, R.mipmap.ic_found2));mItemIcon.add(new BotBean(我的, R.mipmap.ic_me2));ViewPager vp (ViewPager) findViewById(R.id.vp);vp.setAdapter(new FAdapter(getSupportFragmentManager()));tv (TextView) findViewById(R.id.tv);bottomView bottom (bottomView) findViewById(R.id.bottom);bottom.setViewPager(vp, mItemIcon, new bottomView.BottomPageChangeListener() {Overridepublic void onPageChangeListener(int position) {//滑动后的回调tv.setText(mItemIcon.get(position).getContent());}});}/*** 适配器*/class FAdapter extends FragmentPagerAdapter {public FAdapter(FragmentManager fm) {super(fm);}Overridepublic Fragment getItem(int position) {return mFragments.get(position);}Overridepublic int getCount() {return mFragments.size();}}}总结该代码耦合度较高,有些代码可能不太合理;欢迎大牛们给出合理建议;以上就是本文的全部内容希望对大家的学习有所帮助也希望大家多多支持脚本之家。
