Learning goals

Complete the dog App with a list of dog names and pictures. The effect is as follows:

Source code address: github.com/uncleleonfa…

Dog daqo interface

The network data used by Android applications are generally obtained by the API provided by the application background. Here, we do not build the server background, but use the open API provided by Apishop:www.apishop.net/#/api/detai…We use the API in the dog list:After registering an Apishop account, the corresponding apiKey will be generated. You can view your API KEY on the console of Apishop. After applying for the use of The Daqo API, there will be 20 free calls. Interface return Example:

{" statusCode ":" 000000 ", "desc" : "request is successful", "result" : {" petFamilyList ": [{" petID:" 77, "name" : "Dachshund", "engName" : "Dachshund." "Price", "2000", "coverURL" : "http://img.boqiicdn.com/Data/BK/P/img22101406708896.jpg"}], "totalCount" : 1}}Copy the code

Get the dog list

We changed the sendRequest() method in mainActivity.java to replace the URL with an API to get the list of dogs

The String url = "https://api.apishop.net/common/dogFamily/queryDogList?apiKey= your API KEY";Copy the code

Replace “your API KEY” with the API KEY in your own APishop. Rewrite OKHttp’s callback method onResponse to parse the dog list data, which we can do against the example returned by the interface.

The member variable mPetFamilyList receives the list of dogs that we will eventually fetch.

Notify RecyclerView refresh list

After the dog list data is retrieved, the RecylerView list needs to be refreshed. First we turn RecyclerView into a member variable so that we can get the RecyclerView object in the onResponse method.

In the onResponse method, we notify the main thread that the Adapter of RecyclerView data has changed and the view needs to be rebound.

Build the dog list entry view

Before, we created the view of RecyclerView list items by the way of new control object, but when the item view is more complex, we generally use the layout file to build the view. Create the item layout file dog_list_item. XML in the RES/Layout directory of the APP module, and use the layout LienarLayout to arrange the ImageView corresponding to the dog picture and the TextView corresponding to the dog name.

The adapter binds the dog list view

The onCreatViewHolder method transforms the layout file dog_list_item. XML into an item view item via LayoutInflater and holds the item in MyViewHolder. In the onBindViewHolder method, bind the entry view to the dog list data, set the dog title and load the dog image. GetItemCount returns the number of entries in the list, that is, the number of dog list data.

Dog network picture loading

The dog image is a web image that needs to be loaded using the web image library. Here we use the popular Open image loading library Glide in Android to load. Glide Project Address: github.com/bumptech/gl…

Add a dependency on Glide

Add Glide dependency to build.gradle under app module:

After adding, click Sync Now in the upper right corner to download Glide related library.

Load the dog network picture

Call the API provided by Glide to load the dog’s network picture

Glide.with(MainActivity.this).load(coverUrl).into(imageView);
Copy the code

The URL of the returned dog image is HTTP, but Android 9 enforces HTTPS, so the image may not be loaded. You can configure androidmanifest.xml to skip the mandatory HTTPS restriction.