Bmob后端云+ImageLoader框架实现图文列表
1.了解什么是Bmob后端云
对于很多Android/ios/wp个人移动开发者来说,开发一个具有网络功能的应用不是一件容易的事,不仅需要购买/租赁服务器,还必须掌握一门诸如Java/.net/php这类的服务器开发语言,每开发一款移动应用程序,就必须开发维护对应的服务器程序。这一切对于移动开发者来说,都是一个冗长的噩梦。
如何让移动开发者从繁琐的机械劳动中解脱出来,将更多精力投入到移动应用程序的创意研发,从而不断提升产品质量呢?Bmob移动应用云存储平台的诞生就很好地解决了以上难题。
在Bmob平台上,您只需注册一个帐号,成功后申请创建任意多个数据库,获得对应的Key,下载对应版本的SDK并将其嵌入到移动应用中,便可以调用存取API,进行数据的任意操作。有了Bmob,您在5分钟内就可以学会如何开发一个云存储的移动应用软件,给应用软件快速添加一个安全灵活的后台管理系统,方便您浏览终端保存的各种信息。
2.了解什么是ImageLoader开源框架
ImageLoader是一个开源的UI组件程序,该项目的目的是提供一个可重复使用的仪器为异步图像加载,缓存和显示。
2.1特征
1、多线程下载图片,图片可以来源于网络,文件系统,项目文件夹assets中以及drawable中等。
2、支持随意的配置ImageLoader,例如线程池,图片下载器,内存缓存策略,硬盘缓存策略,图片显示选项以及其他的一些配置
3、支持图片的内存缓存,文件系统缓存或者SD卡缓存
4、根据控件(ImageView)的大小对Bitmap进行裁剪,减少Bitmap占用过多的内存
5、较好的控制图片的加载过程,例如暂停图片加载,重新开始加载图片,一般使用在ListView,GridView中,滑动过程中暂停加载图片,停止滑动的时候去加载图片
6、支持图片下载过程的监听
7、提供在较慢的网络下对图片进行加载
2.2 设计图
3.如何实现图文列表
3.1在Bmob后端云应用数据库中新建表
注册Bmob帐号:
在网址栏输入www.bmob.cn或者在百度输入Bmob进行搜索,打开Bmob官网后,点击右上角的“注册”,在跳转页面填入你的姓名、邮箱、设置密码,确认后到你的邮箱激活Bmob账户,你就可以用Bmob轻松开发应用了。
网站后台创建应用
登录账号进入bmob后台后,点击后台界面左上角“创建应用”,在弹出框输入你应用的名称,然后确认,你就拥有了一个等待开发的应用。
获取应用密钥和下载SDK
选择你要开发的应用,进入该应用
获取应用Application ID
在跳转页面,进入设置/应用密钥,点击复制,即可得到Application ID
SDK导入
1.在 Project 的 build.gradle 文件中添加 Bmob的maven仓库地址
buildscript {
repositories {
google()
jcenter()
}
dependencies {
classpath 'com.android.tools.build:gradle:3.3.1'
// NOTE: Do not place your application dependencies here; they belong
// in the individual module build.gradle files
}
}
allprojects {
repositories {
google()
jcenter()
//Bmob的maven仓库地址--必填
maven { url "https://raw.github.com/bmob/bmob-android-sdk/master" }
}
}
task clean(type: Delete) {
delete rootProject.buildDir
}
2.在app的build.gradle文件中添加依赖文件
dependencies {
implementation fileTree(include: ['*.jar'], dir: 'libs')
implementation 'com.android.support:appcompat-v7:28.0.0'
implementation 'com.android.support.constraint:constraint-layout:1.1.3'
testImplementation 'junit:junit:4.12'
androidTestImplementation 'com.android.support.test:runner:1.0.2'
androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.2'
implementation 'cn.bmob.android:bmob-sdk:3.6.9'
implementation 'io.reactivex.rxjava2:rxjava:2.2.2'
implementation 'io.reactivex.rxjava2:rxandroid:2.1.0'
implementation 'com.squareup.okio:okio:2.1.0'
implementation 'com.google.code.gson:gson:2.8.5'
implementation 'com.squareup.okhttp3:okhttp:3.12.0'
implementation 'com.nostra13.universalimageloader:universal-image-loader:1.9.5'
}
配置AndroidManifest.xml
在你的应用程序的AndroidManifest.xml文件中添加相应的权限:
<!--允许联网 -->
<uses-permission android:name="android.permission.INTERNET" />
<!--获取GSM(2g)、WCDMA(联通3g)等网络状态的信息 -->
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<!--获取wifi网络状态的信息 -->
<uses-permission android:name="android.permission.ACCESS_WIFI_STATE" />
<!--保持CPU 运转,屏幕和键盘灯有可能是关闭的,用于文件上传和下载 -->
<uses-permission android:name="android.permission.WAKE_LOCK" />
<!--获取sd卡写的权限,用于文件上传和下载-->
<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE" />
<!--允许读取手机状态 用于创建BmobInstallation-->
<uses-permission android:name="android.permission.READ_PHONE_STATE" />
配置ContentProvider
同样在的AndroidManifest.xml文件中添加相应的权限:
<provider
android:name="cn.bmob.v3.util.BmobContentProvider"
android:authorities="com.example.list_dome.BmobContentProvider">
</provider>
初始化BmobSDK
在应用的onCreate方法中初始化BmobSDK
Bmob.initialize(this, "4943e6a9dd93e0df1aee0fc6d54239d9");
新建list表
对以上都配置完成以后,请到应用的数据库中新建list表,此表中有两列分别为
(列名:name 属性:String 描述:每列的文字信息)
(列名:icon 属性:File 描述:每列的)
3.2在项目中新建list类
新建的list类应与在Bmob云后端建立list表一 一对应
public class list extends BmobObject {
private String name;
private BmobFile icon;
public String getName() {
return name;
}
public void setName(String name) {
this.name = name;
}
public BmobFile getIcon() {
return icon;
}
public String getIconUrl(){
return icon.getFileUrl();
}
public void setIcon(BmobFile icon) {
this.icon = icon;
}
}
其中类中的BmobFile对应表中的File,代码块中的getIconUrl()方法用来获取图片的url。
3.3在项目中导入ImageLoader框架
第一种方法:导入imageloader的jar包
点击跳转到下载地址
第二种方法:在Android Studio中导入依赖使用快捷键Alert+ctrl+shift+s,然后点击Dependencies再点击右面的“+”号选择“Library dependency”,把com.nostra13.universalimageloader:universal-image-loader:1.9.5复制在输入框中。
缓存图片配置(初始化ImageLoader)
imageLoader.init(ImageLoaderConfiguration.createDefault(MainActivity.this));
3.4编写ListView适配器
以下代码是对ListView适配器进行的编写,如果想要了解详细的ListView适配器请点击链接
点击跳转到ListView适配器详细编写博客
实例化ImageLoader对象
// 创建ImageLoader对象
private ImageLoader imageLoader = ImageLoader.getInstance();
主页面的布局文件
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:paddingBottom="16dp"
android:paddingTop="16dp">
<ListView
android:id="@+id/main_list_view"
android:layout_width="match_parent"
android:layout_height="match_parent">
</ListView>
</RelativeLayout>
列表每项布局文件
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="100dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_margin="10dp">
<ImageView
android:id="@+id/title_pic"
android:layout_width="80dp"
android:layout_height="60dp"
android:layout_centerVertical="true"
android:layout_alignParentLeft="true"
android:src="@mipmap/ic_launcher"/>
<TextView
android:id="@+id/title_content"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:textSize="16sp"
android:layout_marginLeft="10dp"
android:layout_toRightOf="@id/title_pic"
/>
</RelativeLayout>
</RelativeLayout>
适配器编写
//适配器用来进行视图与数据的适配作用
public class NewListAdapter extends BaseAdapter {
private List<list> lists= new ArrayList<>();
public NewListAdapter(List<list> list) {
this.lists=list;
}
@Override
public int getCount() {
return lists.size();
}
@Override
public Object getItem(int position) {
return lists.get(position);
}
@Override
public long getItemId(int position) {
return position;
}
@Override
public View getView(final int position, View convertView, ViewGroup parent) {
ViewHolder viewHolder = new ViewHolder();
if (convertView == null) {
LayoutInflater layoutInflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
convertView = layoutInflater.inflate(R.layout.item_news_list, null);
viewHolder.titleContent = (TextView) convertView.findViewById(R.id.title_content);
viewHolder.icon = (ImageView) convertView.findViewById(R.id.title_pic);
convertView.setTag(viewHolder);
}else {
viewHolder = (ViewHolder) convertView.getTag();
}
// 创建DisplayImageOptions对象并进行相关选项配置
DisplayImageOptions options = new DisplayImageOptions.Builder()
.showImageOnLoading(R.drawable.ic_launcher_background)// 设置图片下载期间显示的图片
.showImageForEmptyUri(R.drawable.ic_launcher_background)// 设置图片Uri为空或是错误的时候显示的图片
.showImageOnFail(R.drawable.ic_launcher_background)// 设置图片加载或解码过程中发生错误显示的图片
.cacheInMemory(true)// 设置下载的图片是否缓存在内存中
.cacheOnDisk(true)// 设置下载的图片是否缓存在SD卡中
.displayer(new RoundedBitmapDisplayer(20))// 设置成圆角图片
.build();// 创建DisplayImageOptions对象
// 使用ImageLoader加载图片
imageLoader.displayImage(lists.get(position).getIcon().getFileUrl(),viewHolder.icon);
viewHolder.titleContent.setText(lists.get(position).getName());
return convertView;
}
public class ViewHolder{
TextView titleContent;
ImageView icon;
}
}
其中displayImage(参数1,参数2)方法用来加载图片,参数1为想要加载图片的url(图片的url通过getFileUrl()方法获取),参数2为ImageView控件。
重写onDestroy()方法回收缓存在内存中的图片
@Override
protected void onDestroy() {
// 回收该页面缓存在内存中的图片
imageLoader.clearMemoryCache();
super.onDestroy();
}
3.5批量的从Bmob云后端的数据库获取数据
//查询所有数据
public void queryPage(){
BmobQuery<list> query = new BmobQuery<>();
//查询存在“objectId”字段的数据。
query.addWhereExists("objectId");
//获取查询数据
query.findObjects(new FindListener<list>() {
@Override
public void done(List<list> list, BmobException e) {
if (e == null) {
try {
listView.setAdapter(new NewListAdapter(list));
Toast.makeText(MainActivity.this, "更新列为" + list.size()+"条", Toast.LENGTH_LONG).show();
}catch (Exception es){
es.printStackTrace();
}
}else {
Toast.makeText(MainActivity.this, e.toString(), Toast.LENGTH_LONG).show();
}
}
});
}
其中query.addWhereExists(“objectId”)是用来查询存在“objectId”字段的数据。
3.6效果截图
4.资料参考
此项目的源码链接:https://github.com/huangzichun666/tart
Bmob官方文档参考链接:http://doc.bmob.cn/data/android/index.html
Bmob官方视频教程链接:http://doc.bmob.cn/video/index.html
ImageLoader开源框架详细介绍:https://blog.csdn.net/qq_26446715/article/details/79767493
ListView适配器参考链接:https://www.cnblogs.com/smyhvae/p/4477079.html
以上是本片博客主要的介绍内容,希望通过这篇博客可以帮助更多的人,此博客也一定存在诸多的问题,希望读者留言赐教,我也会尽一步完善这篇博客。
作者:黄子淳
原文地址:https://blog.csdn.net/zgkxydxzhfch/article/details/87989609