效果图
录出来的效果不是很好,真机上展示效果还算完美。
如图所示该效果的实现依赖三个库:
1,顶部Tab导航:比TabLayout功能更强大的FlycoTabLayout,具体使用查看本人之前博客:安卓项目实战之:FlycoTabLayout和FlycoRoundView的介绍及使用
2,精美的Toast:查看之前博客:安卓项目实战之:基于Toasty库封装的精美的Toast工具类
3,Fragment使用了懒加载:具有懒加载功能的 Fragment基类封装
4,四种状态页面切换库:LoadDataLayout
本篇我们通过一个实例来具体讲解LoadDataLayout开源库的简单使用,相关的其他功能在其他文章中都有详细介绍。
相关库引用:
compile 'com.flyco.tablayout:FlycoTabLayout_Lib:2.0.2@aar'
compile 'com.github.GrenderG:Toasty:1.1.5'
compile 'com.ganxin.library:loaddatalayout:1.0.1'
具体使用
1,Fragment的布局:
<?xml version="1.0" encoding="utf-8"?>
<com.ganxin.library.LoadDataLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/loadDataLayout"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="@+id/tv"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:ellipsize="marquee"
android:focusable="true"
android:marqueeRepeatLimit="marquee_forever"
android:singleLine="true"
android:textColor="#ff0000"
android:textSize="30sp" />
</LinearLayout>
</com.ganxin.library.LoadDataLayout>
注意:根布局使用LoadDataLayout,该布局和ScrollView的用法一样只允许添加一个子View,我们可以将所有的内容通过一个根布局包裹然后作为它的子View,此处顺便再给大家推荐一个新布局容器:约束布局ConstraintLayout,网上关于它的介绍也比较多,读者自行去了解,本例中布局比较简单,暂时没有用到。
2,对应Fragment代码如下:
public class MyFragment extends BaseLazyLoadFragment {
private String str;
private LoadDataLayout loadDataLayout;
private TextView tv;
public MyFragment() {
}
public MyFragment(String str) {
this.str = str;
}
@Override
public int setLayoutResourceID() {
return R.layout.fragment;
}
@Override
public void initView() {
tv = view.findViewById(R.id.tv);
loadDataLayout = view.findViewById(R.id.loadDataLayout);
loadDataLayout.setStatus(LoadDataLayout.LOADING);
// 重新加载点击监听
loadDataLayout.setOnReloadListener(new LoadDataLayout.OnReloadListener() {
@Override
public void onReload(View v, int status) {
ToastUtils.toastInfo("重新加载了!",true);
loadDataLayout.setStatus(LoadDataLayout.LOADING);
new Handler().postDelayed(new Runnable() {
@Override
public void run() {
// tv.setText(str); // 该句模拟有数据的情况,直接给TextView赋值
loadDataLayout
.setReloadBtnVisible(false) // 默认数据为空的时候也会显示重新加载按钮,此处设置不显示,具体视需求而定
// .setEmptyImage(R.mipmap.ic_launcher) // 可以替换成自己的图片
.setEmptyText("Sorry!该分类下数据暂时为空QwQ")
.setStatus(LoadDataLayout.EMPTY);
}
},2000);
}
});
}
@Override
public void onLazyLoad() {
new Handler().postDelayed(new Runnable() {
@Override
public void run() {
loadDataLayout
// 设置重新加载触发的区域,默认为LoadDataLayout.BUTTON,即按钮所在区域
.setReloadClickArea(LoadDataLayout.FULL) // 点击屏幕任意区域重新加载
.setStatus(LoadDataLayout.ERROR);
}
},3000);
}
}
具体的懒加载Fragment基类封装查看之前博客,Copy过来即可。
3,最后在贴上Activity代码:
public class MainActivity extends AppCompatActivity {
private ImageView add;
private SlidingTabLayout tablayout;
private ViewPager viewPager;
private ArrayList<BaseLazyLoadFragment> mFagments = new ArrayList<>();
private String[] mTitles = {"头条", "社会", "国内", "国际", "游戏", "体育"};
private MyPagerAdapter adapter;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
add = findViewById(R.id.add);
tablayout = findViewById(R.id.tab_layout);
viewPager = findViewById(R.id.viewpager);
mFagments.add(new MyFragment("头条"));
mFagments.add(new MyFragment("社会"));
mFagments.add(new MyFragment("国内"));
mFagments.add(new MyFragment("国际"));
mFagments.add(new MyFragment("游戏"));
mFagments.add(new MyFragment("体育"));
adapter = new MyPagerAdapter(getSupportFragmentManager());
viewPager.setAdapter(adapter);
tablayout.setViewPager(viewPager, mTitles);
add.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
// Toast.makeText(MainActivity.this, "点击了添加按钮333!", Toast.LENGTH_SHORT).show();
ToastUtils.toastInfo("点击了按钮222!",true);
// 跳转到频道分类管理页面
// startActivity(new Intent(MainActivity.this,TypeManageActivity.class));
}
});
}
private class MyPagerAdapter extends FragmentPagerAdapter {
public MyPagerAdapter(FragmentManager fm) {
super(fm);
}
@Override
public int getCount() {
return mFagments.size();
}
@Override
public CharSequence getPageTitle(int position) {
return mTitles[position];
}
@Override
public Fragment getItem(int position) {
return mFagments.get(position);
}
}
}
至此上面的效果就完美实现了,关于该库的使用所有的代码都在MyFragment里面了,这里再强调一下:
1,该库支持在Application里面进行全局配置(上面例子没有提到,可查看GitHub官网),同时也支持在使用时的局部配置(上面例子展示到了并演示了部分设置)
2,所有的样式,图片,文字,包括文本大小颜色等等都是可以配置的,配置方式具体查看GitHub。
关于其他使用点此查看GitHub介绍:LoadDataLayout