Stylish Progress Bar For Sketchware

Using API in Sketchware- Dog CEO


Dog Api in sketchware
Hello everyone,
This is Naveen with the next post in continuation of the series of tutorials of Sketchware. Now let's work with some of the famous api providers. At first I would work with dog 🐕 api. I am sure that you could be wondering what it would do.
Dog api hosted by dog.ceo has a very simple api which does nothing but just display a random dog picture. This app today is going to use it. The app is just goin to show a random dog picture.

Prerequisite Knowledge.


  1. Download Sketchware
  2. A basic understanding of what is Sketchware.
  3. Know use request network in Sketchware.
  4. Have read dog ceo docs. Which is available here.

Curiosity to learn and do something new.

Now to begin with follow the steps below.

First, create an new app in Sketchware. Name it as whatever you want and add whatever picture you want as icon. I have name it as dog CEO. Check the pictures below.
Sketchware Dog CEO

Then, set the UI design as I have done. I have named the linear as linear1, imageview as imageview1, refresh button as button1.
UI of Dog CEO

Next move to the component section of Sketchware. Create a new RequestNetwork component named as "dog_ceo". Refer the pictures below.

Now select the onResponse event in dog_ceo, create blocks as shown below.
Blocks in Sketchware for dog-ceo

Actually dog api provide as json array which contains the image URL from which we are going to load the url. So in this blocks we convert the JSON to map variable. From the map variable we get url and load it in imageview1. Check the picture above for help.

Now after completing the requesting part we shall now start to request. In the onCreate activity create blocks as I did.
Here I just request the url where the JSON is available.

After do the same in refresh button onClick event. Just change the tag value to prevent app crashing. Check the picture.

Only one step more that is to save and run the app. Check the picture.

Hope you have got some idea about it.

Next I will make it with python.

Comments

This Blog is protected by DMCA.com

Donate Me

Donate Me
Do something Great