仿抖音底部导航（二）

继续实现仿抖音底部导航

今天要实现效果如下图

首先在原基础的布局中加入一个ImageView

<LinearLayout android:layout_width="wrap_content" android:orientation="vertical" android:id="@+id/nav_top" android:layout_centerInParent="true" android:layout_height="wrap_content"> <TextView android:layout_width="wrap_content" android:text="标题" android:id="@+id/nav_item_tv_title" android:textColor="#F1F1F1" android:textSize="16sp" android:layout_height="wrap_content" /> <!--新加入的--> <ImageView android:id="@+id/reflash" android:layout_width="25dp" android:src="@mipmap/shuaxin" android:visibility="gone" android:layout_centerInParent="true" android:layout_height="25dp" /> </LinearLayout> 

这里附上刷新的图片素材

然后在原代码中进行修改以实现导航的动画及刷新功能

1.添加是否显示刷新图片的标记

//默认设为flase private boolean isShowReflashImage=false; //并添加set方法 public void setShowReflashImage(boolean showReflashImage) { isShowReflashImage = showReflashImage; } 

2.然后修改激活和取消激活的方法

public void startActive(){ //根据上一步添加的标记来判断是否显示ImageView if(isShowReflashImage){ textView_title.setVisibility(GONE); imageView_Shuaxin.setVisibility(VISIBLE); }else { textView_title.setTextColor(Color.WHITE); textView_title.setTextSize(18); } textView_line.animate().alpha(1).setDuration(200).start(); } public void cancelActive(){ if(isShowReflashImage){ textView_title.setVisibility(VISIBLE); imageView_Shuaxin.setVisibility(GONE); textView_line.setAlpha(0); }else { textView_title.setTextColor(Color.parseColor("#F1F1F1")); textView_title.setTextSize(16); } textView_line.animate().alpha(0).setDuration(200).start(); } 

3.给负责刷新的ImageView添加旋转动画

private void initListener() { final Animation rotateAnimation = new RotateAnimation(0,-360,Animation.RELATIVE_TO_SELF,0.5f,Animation.RELATIVE_TO_SELF,0.5f); rotateAnimation.setDuration(300); imageView_Shuaxin.setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { imageView_Shuaxin.startAnimation(rotateAnimation); } }); } 

4.最后加上刷新事件

1）新建NavItemReflashListener

public interface NavItemReflashListener { void onReflash(View v); } 

2）给NavItemView加上NavItemReflashListener属性并设置set方法

public void setNavItemReflashListener(NavItemReflashListener navItemReflashListener) { this.navItemReflashListener = navItemReflashListener; } 

3）在imageView_Shuaxin的点击事件中调用onReflash(View v)方法

imageView_Shuaxin.setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { imageView_Shuaxin.startAnimation(rotateAnimation); if(navItemReflashListener!=null){ navItemReflashListener.onReflash(v); } } }); 

5.在MainActivity中将想要显示刷新控件的NavItemView设置ShowReflashImagewei为true并加上刷新事件

navItemView1.setShowReflashImage(true); navItemView1.setNavItemReflashListener(new NavItemReflashListener() { @Override public void onReflash(View v) { Toast.makeText(MainActivity.this, "刷新", Toast.LENGTH_SHORT).show(); } }); 

最后附上完整代码https://gitee.com/itfittnesss/DouYin