Git Product home page Git Product logo

uistatus's Introduction

UiStatus 一个简单且强大的Android Ui视图状态控制库.

我一直觉得程序员就像诗人一样,敲代码就像写诗,好的代码何尝不是一首优美的诗!

所以我把项目中的视图控制部分抽取出来,单独封装成了UiStatus这个库。希望可以帮助大家简化这部分操作,也希望对大家有用。 话不多说先上效果图:

演示gif

优点:

1.轻量:简单且够用!!!

2.省内存:使用ViewStub,所有未使用到的状态均不会初始化,减少视图初始化开销。

3.解耦、封装:降低各种视图状态和业务层耦合,使用者只需要关心业务层逻辑而无需知道视图状态管理内部逻辑。

4.自由:不提供任何状态视图,高度可配置,完全由开发者自己定义。

5.强大:可以使用在任何Activity、Fragment、View当中。

目前该库包含的状态有10种:

常量名称 含义 使用场景
LOADING 加载中 页面加载中状态
NETWORK_ERROR 网络错误 当网络连接错误时展示的界面
LOAD_ERROR 加载失败 接口请求失败时展示给用户的界面
EMPTY 空布局 当获取的数据为空时展示的界面
NOT_FOUND 未找到内容布局 有时获取的内容已被服务器删除,此时展示给用户一个404内容被删除的界面
CONTENT 内容 真正需要展示给用户的内容视图,也是开发者在layout里实际布局的视图
WIDGET_NETWORK_ERROR 网络错误小部件 一个类似于QQ、微信断网时顶部显示的网络错误提示视图
WIDGET_ELFIN 小精灵(提示布局) 一种顶部出现的提示布局,可以做类似于简书刷新时提醒推荐内容条数的小部件
WIDGET_FLOOR 底部Floor 一种底部弹出的浮动布局,可以实现底部弹出小组件的功能
WIDGET_FLOAT 浮动Float 一个可以浮动在内容视图上的视图状态

在这里我们将前6种状态称之为普通状态视图,后面4种统称为Widget小部件。下文不再赘述! 其中,普通状态视图不会同时显示,Widget小部件状态的显示和前6种状态不冲突(可以同时显示), 视图层次上Widget在普通状态视图之上,WIDGET_ELFIN在WIDGET_NETWORK_ERROR之下。

使用步骤

1.添加依赖

step one:

allprojects {
    repositories {
        maven { url 'https://www.jitpack.io' }
    }
}

step two :

dependencies {
        implementation 'com.github.FengChenSunshine:UiStatus:1.0.5'
}

2.全局配置

UiStatus库不提供任何状态的视图,完全由开发者自己自定义提供。

①.获取全局视图控制管理者.

UiStatusManager.getInstance()

②.配置状态视图.

/**
* @params uiStatus    视图状态.
* @params layoutResId 开发者自定义的该状态视图.
*/
addUiStatusConfig(@UiStatus int uiStatus, @LayoutRes int layoutResId);

/**
* @params uiStatus           视图状态.
* @params layoutResId        开发者自定义的该状态视图.
* @params retryTriggerViewId 该状态视图上点击事件的触发控件id.
* @params retryListener      点击事件触发后的回调.
*/
addUiStatusConfig(@UiStatus int uiStatus, @LayoutRes int layoutResId, @IdRes int retryTriggerViewId, OnRetryListener retryListener);

/**
* 该方法只针对Widget相关状态有效.
* @params uiStatus       视图状态.
* @params topMarginPx    widget相对于内容视图的顶部距离,比如可能需要预留出顶部Toolbar高度的距离.
* @params bottomMarginPx widget相对于内容视图的底部距离,比如可能需要预留出底部导航栏高度的距离.
*/
setWidgetMargin(@UiStatus @IntRange(from = 7L,to = 9L) int uiStatus, int topMarginPx, int bottomMarginPx);

③.配置网络状态提供者.

考虑到开发者项目中都有自己的网络状态监听、判断的工具类,
所以UiStatus没有必要额外编辑这段功能代码,仅需要开发者配置一个回调即可。
配置网络状态提供者后,在请求显示普通的状态时如果是没有网络那么将自动重定向到NETWORK_ERROR网络错误状态界面。
具体配置方法如下:
UiStatusNetworkStatusProvider
        .getInstance()
        .registerOnRequestNetworkStatusEvent(OnRequestNetworkStatusEvent networkStatusEvent);

3.具体使用

UiStatus可以使用在任何Activity、View以及Fragment中.

①.Activity中:

UiStatusController.get().bind(activity);

②.View中:

UiStatusController.get().bind(view);

③.Fragment中:

由于Fragment的特殊性,所以这里稍微麻烦一点点:
public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view;
        //你的视图初始化...
        mUiStatusController = UiStatusController.get();
        return mUiStatusController.bindFragment(view);
}
看以看出这里是使用bindFragment(view)方法将原本的内容视图传递给UiStatus,并将该方法返回的控件作为onCreateView的返回值即可。

④.视图状态切换:

对于普通视图切换使用UiStatusController.changeUiStatusIgnore(uiStatus)切换;
对于Widget视图使用UiStatusController.showWidget(uiStatus)进行显示;
或者使用其重载方法showWidget(uiStatus,duration)方法进行显示,使用该方法时会在duration时间后自动隐藏;
也可以使用UiStatusController.hideWidget()方法进行隐藏Widget小部件。

4.成功

经过上面的步骤之后您已经成功的集成并且可以使用UiStatus库了,并且您肯定也看到了想要看到的各种状态下的视图成功切换。 如果您不需要某些页面的个性化定制,那么到这里就OK了;否则请看下面的步骤会满足你的需求。

5.个性化配置

一般情况下使用在Application中的全局配置已经能满足大部分页面视图状态的需求, 如果某些个别界面需要特殊配置那么UiStatus也是支持的。 只需要使用持有的UiStatusController对象,调用其addUiStatusConfig()或其他任何可以在全局配置中使用的方法重新配置即可。

6.优化

一般的开发者只需要在自定义的Application中全局配置一次即可,并且对于LOADING、LOAD_ERROR、EMPTY、NOT_FOUND、CONTENT这些普通视图的切换可以下沉到 统一在基类Activity、Fragment或者网络加载框架中处理,具体使用大同小异,可参考Demo,这里不再赘述。

7.UiStatus可实现效果部分展示

注:图片来自其他APP,仅供参考实现效果使用。其他未列出效果不代表不能实现,具体可实现效果尽情发挥想象!!!

status_load_error status_not_found status_widget_elfin status_widget_elfin_2 status_widget_float status_widget_float_2 status_widget_network_error

8.版本说明

1.0.5

1.修复当被绑定的View parent是LinearLayout并且使用了weight属性时内容视图weight属性无效问题.

2.优化绑定流程,使其可以绑定任何视图为内容视图而不会导致View原属性改变.

1.0.4

新增:

1.UiStatusController里增加getView(@UiStatus int uiStatus),通过该方法可以获取到已经显示过的(初始化过的)视图.

该方法可以解决类似[能改变布局中文本的值吗?](https://github.com/FengChenSunshine/UiStatus/issues/6)  
或者[如何动态更改widget里的文本](https://github.com/FengChenSunshine/UiStatus/issues/5)等问题.

2.UiStatusController里增加getViewStrong(@UiStatus int uiStatus)方法.

该方法与前一个方法相比较不同点是当该状态视图没有初始化时会尝试先初始化再返回.

3.增加UiStatus.WIDGET_FLOAT小部件,这是一个可以浮动在UiStatus.CONTENT之上的部件.

通过这个小部件可以实现类似在CONTENT状态上展示LOADING视图效果来代替UiStatus.LOADING效果.

更改:

1.原UiStatus.WIDGET_FLOAT更名为UiStatus.WIDGET_FLOOR,底部小部件,使其更加见名知意,之前使用了这个部件的需要格外注意.

Bug修复:

1.当view设置margin时布局显示异常问题

1.0.1

1.minSdkVersion从19降低到14;

2.增加 OnCompatRetryListener 监听器,可以统一添加普通状态的重试监听。

10.最后,喜欢的话可以点个赞哦!!!

11.我的开源库链接

1.是我的另一个开源库:一个简单且强大的Ui状态视图控制库!喜欢的可以看看,欢迎start!!!

2.是我的另一个开源库:一个追求简单够用且强大的UI组件库!喜欢的可以看看,欢迎start!!!

3.是我的另一个开源库:提供一个应用版本更新功能的库!喜欢的可以看看,欢迎start!!!

uistatus's People

Contributors

fengchensunshine avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

uistatus's Issues

结合SmartRefreshLayout使用绑定无效

SmartRefreshLayout
https://github.com/scwang90/SmartRefreshLayout


按找你在简书上所说的绑定方式在空数据或者错误页面实现下拉刷新的功能
使用SmartRefreshLayout作为下拉刷新控件,绑定到RecyclerView但是绑定后什么也不显示

xml布局

<?xml version="1.0" encoding="utf-8"?>
<com.scwang.smart.refresh.layout.SmartRefreshLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/installed_refresh"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <com.scwang.smart.refresh.header.MaterialHeader
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <androidx.recyclerview.widget.RecyclerView
        android:id="@+id/installed_recycler"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <com.scwang.smart.refresh.footer.ClassicsFooter
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

</com.scwang.smart.refresh.layout.SmartRefreshLayout>

加载框问题请教

请问出现加载的时候怎么保持底部状态也不变。是否可以加个微信指导指导,微信:yww_y9

集成到BaseFragment 中,mUiStatus报空指针

protected UiStatusController mUiStatus; 

@OverRide
public View onCreateView(@NotNull LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {

    View view = inflater.inflate(setContentView(), container, false);
    unbinder = ButterKnife.bind(this, view);
    mRefreshLayout = view.findViewById(R.id.refreshLayout);
    initContentView(view, savedInstanceState);
    mUiStatus = UiStatusController.get();
    mUiStatus.changeUiStatusIgnore(UiStatus.CONTENT); // 报空指针异常
    return mUiStatus.bindFragment(view);

}

view显示不正常

你好,demo中的 ‘在View中使用’ ,如果设置一个marginTop值,真机上跑起来,就变形了(View高度写死的),感觉是像在内部设置了一个padding值,或者是将原View包裹了一个布局,设置了一个margin值

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.