Android带数字或红点的底部导航拦和联网等待加载动画示例

android带数字或红点的底部导航拦和联网等待加载动画

首先展示一下截图效果，下载地址在文章最后

一、android带红点的底部导航拦

1.首先写底部导航栏的界面view_main_tab.xml.

<?xml version="1.0" encoding="utf-8"?>
<linearlayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/tab_layout"
android:layout_width="match_parent"
android:layout_height="56dp"
android:layout_alignparentbottom="true"
android:orientation="horizontal"
android:background="#27282c"
>

<relativelayout
android:id="@+id/rl_1"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margintop="4dp"
android:layout_weight="1">

<radiobutton
android:id="@+id/rb_1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerinparent="true"
android:button="@null"
android:background="@null"
android:checked="true"
android:clickable="false"
android:drawablepadding="5dp"
android:drawabletop="@drawable/selector_tab_home"
android:gravity="center"
android:text="首页"
android:textcolor="@drawable/tab_text_selector"
android:textsize="10sp" />

<textview
android:id="@+id/tv_1"
android:layout_width="16dp"
android:layout_height="16dp"
android:layout_alignright="@id/rb_1"
android:layout_aligntop="@id/rb_1"
android:layout_margintop="-6dp"
android:layout_marginright="-6dp"
android:layout_gravity="right"
android:background="@drawable/msg_num_shape"
android:clickable="false"
android:gravity="center"
android:text="3"
android:textcolor="@color/white_1"
android:textsize="10sp"
/>

</relativelayout>

<relativelayout
android:id="@+id/rl_2"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margintop="4dp"
android:layout_weight="1"
android:focusable="true">

<radiobutton
android:id="@+id/rb_2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerinparent="true"
android:background="@null"
android:button="@null"
android:clickable="false"
android:drawablepadding="5dp"
android:drawabletop="@drawable/selector_tab_goods_divide"
android:gravity="center"
android:text="商品"
android:textcolor="@drawable/tab_text_selector"
android:textsize="10sp" />

<textview
android:id="@+id/tv_2"
android:layout_width="16dp"
android:layout_height="16dp"
android:layout_alignright="@id/rb_2"
android:layout_aligntop="@id/rb_2"
android:layout_margintop="-6dp"
android:layout_marginright="-6dp"
android:layout_gravity="right"
android:background="@drawable/msg_num_shape"
android:clickable="false"
android:gravity="center"
android:text="3"
android:textcolor="@color/white_1"
android:textsize="10sp"
/>
</relativelayout>

<relativelayout
android:id="@+id/rl_3"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margintop="4dp"
android:layout_weight="1">

<radiobutton
android:id="@+id/rb_3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerinparent="true"
android:background="@null"
android:button="@null"
android:clickable="false"
android:drawablepadding="5dp"
android:drawabletop="@drawable/selector_tab_stock_list"
android:gravity="center"
android:text="进货单"
android:textcolor="@drawable/tab_text_selector"
android:textsize="10sp" />

<textview
android:id="@+id/tv_3"
android:layout_width="16dp"
android:layout_height="16dp"
android:layout_alignright="@id/rb_3"
android:layout_aligntop="@id/rb_3"
android:layout_margintop="-6dp"
android:layout_gravity="right"
android:background="@drawable/msg_num_shape"
android:clickable="false"
android:gravity="center"
android:text="3"
android:textcolor="@color/white_1"
android:textsize="10sp"
/>

</relativelayout>


<relativelayout
android:id="@+id/rl_4"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_margintop="4dp"
android:layout_weight="1">

<radiobutton
android:id="@+id/rb_4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerinparent="true"
android:background="@null"
android:button="@null"
android:clickable="false"
android:drawablepadding="5dp"
android:drawabletop="@drawable/selector_tab_member"
android:gravity="center"
android:text="会员"
android:textcolor="@drawable/tab_text_selector"
android:textsize="10sp" />


<textview
android:id="@+id/tv_4"
android:layout_width="16dp"
android:layout_height="16dp"
android:layout_alignright="@id/rb_4"
android:layout_aligntop="@id/rb_4"
android:layout_margintop="-6dp"
android:layout_marginright="-6dp"
android:layout_gravity="right"
android:background="@drawable/msg_num_shape"
android:clickable="false"
android:gravity="center"
android:text="3"
android:textcolor="@color/white_1"
android:textsize="10sp"
/>
</relativelayout>

</linearlayout>

2.修改底部导航栏的数字，在mainactivity中

 /**
 * -1:表示没有新消息
 * -2:表示新消息用红点的方式显示
 * 0-99：直接显示数字
 * >=100:用99+显示
 */
private void messagetips(int num, textview tv) {
if(num==-1){
 tv.setvisibility(view.gone);
}else if(num==-2){
tv.setvisibility(view.visible);
tv.settext("");
relativelayout.layoutparams layoutparams = (relativelayout.layoutparams) tv.getlayoutparams();
layoutparams.height= densityutil.dip2px(this,10);
layoutparams.width= densityutil.dip2px(this,10);
tv.setlayoutparams(layoutparams);
}else if(num>=0&&num<=99){
tv.setvisibility(view.visible);
tv.settext(num+"");
relativelayout.layoutparams layoutparams = (relativelayout.layoutparams) tv.getlayoutparams();
layoutparams.height= densityutil.dip2px(this,16);
layoutparams.width= densityutil.dip2px(this,16);
tv.setlayoutparams(layoutparams);
}else if(num>=100){
tv.setvisibility(view.visible);
tv.settext("99+");
relativelayout.layoutparams layoutparams = (relativelayout.layoutparams) tv.getlayoutparams();
layoutparams.height= densityutil.dip2px(this,16);
layoutparams.width= densityutil.dip2px(this,16);
tv.settextsize(densityutil.sp2px(this,3));
tv.setlayoutparams(layoutparams);
}else{
tv.setvisibility(view.gone);
}

}

3.需要在fragment中修改mainactivity中的底部导航拦，所以，要在mainactivity中，写一些公用的方法。

 /**
 * 在onefragment中更新，底部导航栏的数字
 * @param num
 */
public void updateone(int num){
messagetips(num,tv_1);
}
/**
 * 在twofragment中更新，底部导航栏的数字
 * @param num
 */
public void updatetwo(int num){
messagetips(num,tv_2);
}
/**
 * 在threefragment中更新，底部导航栏的数字
 * @param num
 */
public void updatethree(int num){
messagetips(num,tv_3);
}
/**
 * 在fourfragment中更新，底部导航栏的数字
 * @param num
 */
public void updatefour(int num){
messagetips(num,tv_4);
}

4.在fragment中修改底部导航拦，得到主页面，调用主页面的修改方法。

mactivity = (mainactivity) getactivity();
number++;
mactivity.updatetwo(number);

二、activity加载动画。

1.activity中的加载动画，要写一个baseactivity。布局如下

<?xml version="1.0" encoding="utf-8"?>
<linearlayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_base"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.hrobbie.loadingproject.activity.baseactivity">


<android.support.v7.widget.toolbar xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/tool_bar"
android:layout_width="match_parent"
android:layout_height="?attr/actionbarsize"
app:contentinsetstart="0.0dp"
android:background="@color/colorprimary"
app:layout_scrollflags="enteralways|scroll"
app:popuptheme="@style/apptheme.popupoverlay"
/>
<framelayout
android:id="@+id/fl_content"
android:layout_width="match_parent"
android:layout_height="match_parent">
<include layout="@layout/loading_anim"/>
</framelayout>

</linearlayout>

注意：id为fl_content的framelayout的布局里，包含了一个loading_anim的布局，这就是加载布局。加载布局，里面氛围三个线性布局，分别是：加载中布局，加载错误布局，没有数据布局，其中加载失败布局，还需要点击重新加载。内容如下：

<?xml version="1.0" encoding="utf-8"?>
<framelayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
>
<!--加载中-->
<linearlayout android:id="@+id/ll_loading"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginbottom="90dp"
android:gravity="center"
android:orientation="vertical"
>

<imageview
android:id="@+id/iv_loading"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/loading_everyday" />

<textview
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margintop="15dp"
android:text="正在为您开启干货推荐.."
android:textcolor="@color/colortitle"
android:textsize="14sp" />

<textview
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margintop="7dp"
android:text="看的越多，推荐越准"
android:textcolor="@color/colorsubtitle"
android:textsize="12sp"
android:visibility="visible" />

</linearlayout>


<!--加载失败-->
<linearlayout
android:id="@+id/ll_error_refresh"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical"
android:visibility="gone">

<imageview
android:id="@+id/img_err"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/load_err" />

<textview
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margintop="15dp"
android:text="加载失败,点击重试"
android:textsize="15sp" />
</linearlayout>
<!--加载失败-->
<linearlayout
android:id="@+id/ll_no_data"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical"
android:visibility="gone">

<imageview
android:id="@+id/img_no_data"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="@drawable/load_err" />

<textview
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margintop="15dp"
android:text="sorry，没有您想要的数据"
android:textsize="15sp" />
</linearlayout>
</framelayout>

2.baseactivity的代码太多，讲一下主要的，重写setcontentview方法，把新布局放入id为fl_content的布局中，调用getwindow()。setcontentview(rootview);剩下的就跟普通个activity操作一样了。

@override
public void setcontentview(@layoutres int layoutresid) {
 view rootview = layoutinflater.from(this).inflate(r.layout.activity_base,null,false);
addview = layoutinflater.from(this).inflate(layoutresid, null, false);


//content
framelayout.layoutparams params = new framelayout.layoutparams(viewgroup.layoutparams.match_parent, viewgroup.layoutparams.match_parent);
addview.setlayoutparams(params);
fl_content = (framelayout) rootview.findviewbyid(r.id.fl_content);
fl_content.addview(addview);
getwindow().setcontentview(rootview);

initview();
showloading();
}

3.新的activity只需集成baseactivity，当需要加载成功是，调用loadsuccess()方放，加载失败时调用loaderror()，失败后重新加载，需要调用reloading()重新加载，并调用onrefresh()重新加载数据。如果没有数据调用nodata()

三、fragment中加载动画，把加载布局，放入fragment中，我暂时没有好的办法提出basefragment进行统一加载。有一些注意事项。

1.viewpager进行布局加载时，最好能够预加载一个屏幕的数据。

 vp_main.setoffscreenpagelimit(3);//最好是一屏能显示的fragment数-1。

2.在basefragment重写setuservisiblehint方法，当fragment可见时，才联网加载数据。

@override
public void setuservisiblehint(boolean isvisibletouser) {
super.setuservisiblehint(isvisibletouser);

if (getuservisiblehint()){
isvisible=true;
onvisible();
}else {
isvisible=false;
oninvisible();
}
}

3.fragment继承basefragment需要在onviewcreated中调用一下联网加载方法，因为，setuservisiblehint执行比较靠前，页面还没有添加到布局，就加载数据，会造成填充数据失败，需要当页面完全添加到布局中，再联网请求。

 @override
public void onviewcreated(view view, @nullable bundle savedinstancestate) {
super.onviewcreated(view, savedinstancestate);
mactivity= (mainactivity) getactivity();
showloading();
lazyload();
}

下载地址：loadingproject_jb51.rar

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。