妹子图APP(一)—— Retrofit+Glide+Gson加载网络图片

网络请求:Retrofit    地址: https://github.com/square/retrofit
图片加载:Glide       地址: https://github.com/bumptech/glide
数据解析:Gson
1.添加依赖:
Retrofit
    compile 'com.squareup.retrofit2:retrofit:2.0.0-beta4'//Retrofit2所需要的包
    compile 'com.squareup.retrofit2:converter-gson:2.0.0-beta4'//ConverterFactory的Gson依赖包
    compile 'com.squareup.retrofit2:converter-scalars:2.0.0-beta4'//ConverterFactory的String依赖包
Glide 
//工程的build.gradle文件中
repositories {
    mavenCentral() 
}
//Module的build.gradle文件中
dependencies {
    compile 'com.github.bumptech.glide:glide:3.7.0'
    compile 'com.android.support:support-v4:19.1.0'
}
网络请求需要权限
    
2.准备数据
图片数据来源:易源数据( https://www.showapi.com/)300次每天
http://route.showapi.com/197-1?showapi_appid=34276&showapi_sign=731d68d6d56b4d789d6571f530ee28ef&num=10
请求地址分为几部分:
    https://www.showapi.com/ //接口基地址
    197-1 //接口地址
    showapi_appid //易源应用ID
    showapi_sign  //身份验证
    num  //每页返回的数据条数
    page //页数(非必须)
访问上述网址,获得Json数据,使用Gson的GsonFormat插件将Json数据转换为GirlBean对象
3.Retrofit的使用
@Query、@QueryMap://用于Http Get请求传递参数
@Field://用于Post方式传递参数,需要在请求接口方法上添加@FormUrlEncoded,即以表单的方式传递参数
@Body: //用于Post,根据转换方式将实例对象转化为对应字符串传递参数.
        //比如Retrofit添加GsonConverterFactory则是将body转化为gson字符串进行传递
@Path: //用于URL上占位符
@Part: //配合@Multipart使用,一般用于文件上传
@Header://添加http header
@Headers://跟@Header作用一样,只是使用方式不一样,@Header是作为请求方法的参数传入,@Headers是以固定方式直接添加到请求方法上POST请求
3.1自定义请求接口
public interface ApiService {

    @POST("197-1")
    @FormUrlEncoded
    Call getGirls(@Field("showapi_appid") String showapi_appid,
                               @Field("showapi_sign") String showapi_sign,
                               @Field("num") int num ,
                               @Field("page") int page);
//    //GET请求
//    @GET("197-1")
//    Call getGirls(@Query("showapi_appid") String showapi_appid,
//                            @Query("showapi_sign") String showapi_sign,
//                            @Query("num") int num ,
//                            @Query("page") int page);

}
3.2请求数据
定义一个类,用于Retrofit请求数据
public class GirlsRequest {
    public static final String baseurl = "http://route.showapi.com/";
    public static final String showapi_appid = "34276";
    public static final String showapi_sign = "731d68d6d56b4d789d6571f530ee28ef";
    public static final int num = 10;

    //创建Retrofit对象
    Retrofit mRetrofit = new Retrofit.Builder()
            .baseUrl(baseurl)//请求基地址
            //添加转换器,直接将内容转换成String或者json
            //.addConverterFactory(ScalarsConverterFactory.create())
            .addConverterFactory(GsonConverterFactory.create())
            .build();
    public void getGirlList(final RequsetCallback requsetCallback, int page) {
        //创建请求的接口
        ApiService mApiService = mRetrofit.create(ApiService.class);
        Call mCall = mApiService.getGirls(showapi_appid,showapi_sign,num,page);
        //利用Call对象,发起网络请求
        mCall.enqueue(new Callback() {
            //请求成功
            @Override
            public void onResponse(Call call, Response response) {
                //成功获得正确数据
                if (response.body().getShowapi_res_code() == 200) {
                    requsetCallback.onFinish(response.body());
                } else {
                    //错误数控
                    requsetCallback.onError(response.body().getShowapi_res_error());
                }
            }
            //失败
            @Override
            public void onFailure(Call call, Throwable t) {
                requsetCallback.onError("网络请求失败");
            }
        });
    }
    //自定义回调接口
    public interface RequsetCallback{
        void onFinish(T data);

        void onError(String msg);
    }
}
4.显示数据
Glide的使用: http://www.cnblogs.com/guilin-hu/p/5706916.html
         a).网络加载图片到ImageView中
Glide.with(context).load(imageUrl).into(imageView);
         b). 当加载网络图片时,由于加载过程中图片未能及时显示,此时可能需要设置等待时的图片
Glide.with(context).load(imageUrl).placeholder(R.mipmap.ic_launcher).into(imageView);
         c). 当加载图片失败时,通过error(Drawable drawable)方法设置加载失败后的图片显示
Glide.with(context).load(imageUrl).error(R.mipmap.ic_launcher).into(imageView);
图片列表使用RecyclerView 实现
在适配器中的onBindViewHolder方法中使用Glide设置图片
    @Override
    public void onBindViewHolder(final MyViewHolder holder, int position) {
        //Glide设置图片(未加载则用粉色替代)
        Glide.with(mContext)
                .load(mList.get(position).getPicUrl())
                .centerCrop()
                .placeholder(R.color.colorAccent)
                .into(holder.mImageView);
    }
5.完成加载图片的功能
public class MainActivity extends AppCompatActivity implements 
        GirlsRequest.RequsetCallback{

    private  RecyclerView mRecyclerView;
    private MyAdapter mAdapter;
    private GridLayoutManager mGridLayoutManager;
	
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        mRecyclerView = (RecyclerView) findViewById(R.id.recyclerview);
        //RecyclerView 设置行列
        mGridLayoutManager = new GridLayoutManager(this,2);
        //VERTICAL代表有多少列,HORIZONTAL就代表有多少行,
        mRecyclerView.setLayoutManager(mGridLayoutManager);

        GirlsRequest request = new GirlsRequest();
        //调用getGirlList方法请求数据
        request.getGirlList(this,1);
    }

    @Override
    public void onFinish(GirlsBean data) {
        //得到适配器
        mAdapter = new MyAdapter(this,data.getShowapi_res_body().getNewslist());
        //设置适配器
        mRecyclerView.setAdapter(mAdapter);
    }

    @Override
    public void onError(String msg) {
        //吐司错误信息
        Toast.makeText(this,msg,Toast.LENGTH_SHORT).show();
    }
}
详细代码: https://github.com/897532167/LoadNetworkPicture
如有兴趣可看: 妹子图APP(二)—— SwipeRefreshLayout+RecyclerView下拉刷新上拉加载
暂时的效果
妹子图APP(一)—— Retrofit+Glide+Gson加载网络图片_第1张图片

你可能感兴趣的:(Android)