继续实现仿抖音底部导航
今天要实现效果如下图
首先在原基础的布局中加入一个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();
}
});