Zhao-Yan-Yan / Multistatepage
Licence: apache-2.0
Android APP缺省页的正确打开方式 高度解耦、低侵入、易拓展 多状态视图状态切换器
Stars: ✭ 433
Programming Languages
kotlin
9241 projects
Projects that are alternatives of or similar to Multistatepage
Pagestatemanager
manage the loading,emtpy,error state of page, use in xml or just in code
Stars: ✭ 173 (-60.05%)
Mutual labels: state, loading
Stateviews
Create & Show progress, data or error views, the easy way!
Stars: ✭ 367 (-15.24%)
Mutual labels: state, loading
PageStatusTransformer
A low invasive state management on Android
Stars: ✭ 12 (-97.23%)
Mutual labels: state, loading
Stateview
✨ StateView is an invisible, zero-sized View that can be used to lazily inflate loadingView/emptyView/retryView at runtime.
Stars: ✭ 573 (+32.33%)
Mutual labels: state, loading
Statefulviewcontroller
Placeholder views based on content, loading, error or empty states
Stars: ✭ 2,139 (+394%)
Mutual labels: state, loading
react-apollo-mutation-state
A React HOC wrapper for Apollo GraphQL mutation, provides loading and error in props
Stars: ✭ 16 (-96.3%)
Mutual labels: state, loading
React Loads
React Loads is a backend agnostic library to help with external data fetching & caching in your UI components.
Stars: ✭ 268 (-38.11%)
Mutual labels: state, loading
Hgrippleradarview
A beautiful radar view to show nearby items (users, restaurants, ...) with ripple animation, fully customizable
Stars: ✭ 309 (-28.64%)
Mutual labels: loading
Ngx Ui Loader
Multiple Loaders / spinners and Progress bar for Angular 5, 6, 7 and 8+
Stars: ✭ 368 (-15.01%)
Mutual labels: loading
Loading Bar
Flexible, light weighted and super fast Progress Bar Library
Stars: ✭ 300 (-30.72%)
Mutual labels: loading
Onedrawable
✏️ Use only one image to set a background with a click effect for the View
Stars: ✭ 298 (-31.18%)
Mutual labels: state
Circleprogressview
🎡 CircleProgressView是一个圆形渐变的进度动画控件(支持外环显示刻度,内环随之变化,配置参数完全可配),动画效果纵享丝滑。
Stars: ✭ 314 (-27.48%)
Mutual labels: loading
Materialimageloading
Material image loading implementation
Stars: ✭ 396 (-8.55%)
Mutual labels: loading
Ng2 Slim Loading Bar
Angular 2 component shows slim loading bar at the top of the page.
Stars: ✭ 376 (-13.16%)
Mutual labels: loading
Rtextview
基于TextView 1.直接设置selector背景2.直接设置drawableLeft大小 3.圆角,圆形,背景/边框/文字根据状态变色
Stars: ✭ 359 (-17.09%)
Mutual labels: state
Waitme
jquery plugin for easy creating loading css3/images animations
Stars: ✭ 302 (-30.25%)
Mutual labels: loading
Ssspinnerbutton
Forget about typical stereotypic loading, It's time to change. SSSpinnerButton is an elegant button with a diffrent spinner animations.
Stars: ✭ 357 (-17.55%)
Mutual labels: loading
React Top Loading Bar
A very simple, highly customisable youtube-like react loader component.
Stars: ✭ 367 (-15.24%)
Mutual labels: loading
MultiStatePage
下载Demo
点击或者扫描二维码下载
Activity | Fragment | View | ViewPager2 |
---|---|---|---|
Lottie拓展(自定义State) | State刷新 | 网络请求 | sample |
---|---|---|---|
MultiStatePage的功能及特点
- 无需在布局添加视图代码
- 可显示自定义状态视图,任意拓展
- 可用于 Activity、Fragment、或指定的 View
- 自定义重新请求监听
- 支持xml直接嵌套且不限制要展示状态内容
- 可动态更新视图样式
- 可结合第三方控件使用
- 支持状态回调监听
- kotlin开发更易用的API
开始
添加依赖
Step1. Add the JitPack repository to your build file
allprojects {
repositories {
maven { url 'https://jitpack.io' }
}
}
dependencies {
implementation 'com.github.Zhao-Yan-Yan:MultiStatePage:2.0.1'
}
1.生成MultiStateContainer
在View上使用
kotlin
基础用法
val multiStateContainer = MultiStatePage.bindMultiState(view)
val multiStateContainer = MultiStatePage.bindMultiState(view) { multiStateContainer: MultiStateContainer ->
// 重试事件处理
}
拓展方法
val multiStateContainer = view.bindMultiState()
val multiStateContainer = view.bindMultiState() { multiStateContainer: MultiStateContainer ->
// 重试事件处理
}
java
MultiStateContainer multiStateContainer = MultiStatePage.bindMultiState(view)
MultiStateContainer multiStateContainer = MultiStatePage.bindMultiState(view, new OnRetryEventListener() {
@Override
public void onRetryEvent(MultiStateContainer multiStateContainer) {
// 重试事件处理
}
});
在Activity 根View中使用
kotlin
基础用法
val multiStateContainer = MultiStatePage.bindMultiState(this)
val multiStateContainer = MultiStatePage.bindMultiState(this) { multiStateContainer: MultiStateContainer ->
// 重试事件处理
}
拓展方法
val multiStateContainer = bindMultiState()
val multiStateContainer = bindMultiState() { multiStateContainer: MultiStateContainer ->
// 重试事件处理
}
java
MultiStateContainer multiStateContainer = MultiStatePage.bindMultiState(this);
MultiStateContainer multiStateContainer = MultiStatePage.bindMultiState(this, new OnRetryEventListener() {
@Override
public void onRetryEvent(MultiStateContainer multiStateContainer) {
// 重试事件处理
}
});
在Fragment根View中使用
kotlin
class MultiStateFragment : Fragment {
private lateinit var multiStateContainer: MultiStateContainer
override fun onCreateView(
inflater: LayoutInflater,
container: ViewGroup?,
savedInstanceState: Bundle?
): View? {
val root = inflater.inflate(R.layout.fragment, container, false)
multiStateContainer = MultiStatePage.bindMultiState(root) { multiStateContainer: MultiStateContainer ->
// 重试事件处理
}
//或者
multiStateContainer = root.bindMultiState() { multiStateContainer: MultiStateContainer ->
// 重试事件处理
}
return multiStateContainer
}
}
java
class JavaFragment extends Fragment {
@Nullable
@Override
public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
View root = inflater.inflate(R.layout.activity_main, container, false);
MultiStateContainer multiStateContainer = MultiStatePage.bindMultiState(root);
return multiStateContainer;
}
}
xml中引用
<com.zy.multistatepage.MultiStateContainer
android:id="@+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent">
<androidx.recyclerview.widget.RecyclerView
android:id="@+id/recycler_view"
android:layout_width="match_parent"
android:layout_height="match_parent" />
</com.zy.multistatepage.MultiStateContainer>
// 重试事件
viewBinding.container.onRetryEventListener = OnRetryEventListener {
loadData()
}
2.切换状态
MultiStateContainer.show<T>()
multiStateContainer.show<XXXState>()
MultiStateContainer.show(MultiState)
val state = XXXState()
multiStateContainer.show(state)
默认内置3种状态
val multiStateContainer = MultiStatePage.bindMultiState(view)
//成功页
multiStateContainer.show<SuccessState>()
//错误页
multiStateContainer.show<ErrorState>()
//空页面
multiStateContainer.show<EmptyState>()
//加载状态页
multiStateContainer.show<LoadingState>()
1.1.0新增 show(multiState: MultiState)
val lottieOtherState = LottieOtherState()
lottieOtherState.retry = {
Toast.makeText(this, "retry...", Toast.LENGTH_SHORT).show()
}
multiStateContainer.show(lottieOtherState)
动态设置state
multiStateContainer.show<ErrorState>{errorState ->
errorState.setErrorMsg("xxx出错了")
}
设置重试回调
val multiStateContainer = MultiStatePage.bindMultiState(view){
Toast.makeText(context, "retry", Toast.LENGTH_SHORT).show()
}
自定义State
MultiState
1.继承class LottieWaitingState : MultiState() {
override fun onCreateMultiStateView(
context: Context,
inflater: LayoutInflater,
container: MultiStateContainer
): View {
return inflater.inflate(R.layout.multi_lottie_waiting, container, false)
}
override fun onMultiStateViewCreate(view: View) {
//逻辑处理
}
//是否允许重试
override fun enableReload(): Boolean = false
//指定重试 view
override fun bindRetryView(): View? {
return retryView
}
}
enableReload()
是否允许retry
回调 false
不允许
bindRetryView
绑定重试点击事件的view
默认为根view
结合ViewBidng
参考 demo
MultiStateBinding 和 WithBindingState
2.show (1.0.3后无需register)
class LottieExtActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
val multiStateContainer = bindMultiState()
multiStateContainer.show<LottieWaitingState>()
}
}
使用内置状态配置
class App : Application() {
override fun onCreate() {
super.onCreate()
val config = MultiStateConfig.Builder()
.alphaDuration(300)
.errorIcon(R.mipmap.state_error)
.emptyIcon(R.mipmap.state_empty)
.emptyMsg("emptyMsg")
.loadingMsg("loadingMsg")
.errorMsg("errorMsg")
.build()
MultiStatePage.config(config)
}
}
method | 作用 |
---|---|
alphaDuration |
alpha动画时长 |
errorIcon |
错误状态默认图标 |
emptyIcon |
空数据状态默认图标 |
emptyMsg |
空数据状态默认提示信息 |
errorMsg |
错误状态默认提示信息 |
loadingMsg |
loading状态默认提示信息 |
小技巧
可以借助kotlin的拓展函数封装常用的状态
fun MultiStateContainer.showSuccess(callBack: (SuccessState) -> Unit = {}) {
show<SuccessState> {
callBack.invoke(it)
}
}
fun MultiStateContainer.showError(callBack: (ErrorState) -> Unit = {}) {
show<ErrorState> {
callBack.invoke(it)
}
}
fun MultiStateContainer.showEmpty(callBack: (EmptyState) -> Unit = {}) {
show<EmptyState> {
callBack.invoke(it)
}
}
fun MultiStateContainer.showLoading(callBack: (LoadingState) -> Unit = {}) {
show<LoadingState> {
callBack.invoke(it)
}
}
调用
val multiStateContainer = bindMultiState()
multiStateContainer.showLoading()
multiStateContainer.showSuccess()
更新日志
- 2.0.1(2021/03/06) fix 重复状态切换判断异常
- 2.0.0(2021/03/06) 支持xml中引用MultiStatePage, 代码优化
- 1.1.1(2021/01/12) 优化
enableReload
处理 - 1.1.0(2021/01/04) 新增
show(multiState: MultiState)
- 1.0.9(2020/12/24) demo 包名调整
enableReload
不强制实现,默认false
- 1.0.8(2020/12/09) 修复
LinearLayout
权重异常 - 1.0.7(2020/11/26) 小优化 移除部分
log
打印 - 1.0.6(2020/11/06) 优化
state
切换策略 保留原view
- 1.0.5(2020/11/04)
kotlin
函数类型参数更换为java interface
对java
的调用更友好 - 1.0.4(2020/11/04) api重命名
Activity
和View
统一为bindMultiState()
- 1.0.3(2020/10/26) 修复
state
内存泄漏, 移除register
函数 - 1.0.2(2020/10/23) 支持指定重试
view
, 支持ViewBinding
- 1.0.1(2020/09/22) 支持内置状态页信息配置, 支持
alpha
动画时长配置
Thanks
TODO
- 支持xml中引用
如果对你有帮助的话可以点个star支持一下子 谢谢亲
本项目会长期维护 欢迎issue指正
License
Copyright (C) 2020. ZhaoYan
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at
http://www.apache.org/licenses/LICENSE-2.0
Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].