Let's Make a Dictionary App | Android Project | REST API

[Music] hello everyone welcome to coding with ivan and in this video we are going to see how we can make a dictionary application with rest api like this it says loading and it fetched the response for a default word coding that we said okay we can search for any other word like if i search for clever it's fetching the response for clever and here are the responses as you can see inside the response we have got the parts of speech the definition the example and also some synonyms and antonyms and up here if we click on this audio button we can hear the audio of that particular word so let's click on that clever clever all right so now let's build that application so as you can see i have already opened a new project called dictionary in my android studio and now at first let's see the api that we are going to use to fetch the data so here is the url it is the dictionary api.dev i'll give the link of this in the description from there you can visit the site and here is the api that we are going to use and this is the definition of the api or the response body so the response body is an array and inside this array we have an object uh where there is a element called word which is a string then we have the phonetics which is an array inside that array we have another or some objects of a particular type where we'll have a text which is a string then we'll get the audio variable which is also a string but it contains the url of the audio file and then we have the meanings which is also an array inside that we have the parts of speed and the definitions and the definitions is also an array where we'll get the definition and the example okay so now let's make model classes for all of the uh objects so i'll go to my android studio and inside here i'll create a new package first i'll call this sorry models and inside this models will create all the model classes so let's create a java class called api response so now we have to add some objects inside our api response class so as you can see from the api documentation inside the api response will get an object called word which is a string so let's copy this value and go to our android studio and here i'll create a string type object string i'll call this word equals empty so one thing you have to make sure here is that the object name that you are giving here should be same as what's written inside the api response body okay you have to use the exact spelling of that object okay so we have added the word and now we have to add the phonetics so for the phonetics it's an array of this particular type which will have the text and the audio object so let's create a custom model for the phonetics go back to android studio and here inside the models i'll create a new java class i'll call this phonetics and inside the phonetics will create two objects the text and the audio so i'll copy the text here and i'll write string text equals empty and then string audio equals empty okay so the phonetics is now complete so we just have to add the getter and setter here so right click here and click on generate then i'll click on the getter and setter we have to select both of them and click on ok so here we have got the get text set text method okay so phonetics object is done let's go back to our api response and here we have to add the list of the phonetics as we have a list of phonetics inside our apa response so i'll call phonetics and the object name would be same as here so i'll copy the phonetics from here and paste it here equals let's say null okay it's not okay because the phonetics inside our ap response is an error list or a list okay so i'll just change this into a list of phonetics okay so it's now done so the next object of our api response is the meanings so meanings is also a list which have all of these objects the parts of a speech and the definition so let's create a model class for the meanings type so we'll go back to my android studio and here i'll create a new class java class and i'll name this as meanings okay so inside the class we have to create some objects and the objects will be the parts of speech and the definitions okay so i'll just copy the word parts of speech from here this is a string type so i'll write string parts of speech equals empty and the second parameter is the definitions which is also another custom object and that's also an array okay so let's create another model class for the definitions so i'll go back to android studio right click here and create a new java class called definitions okay so inside the definitions we have to create some objects the definition and the example both here are string types so i'll copy the definition from here and here i'll create a new string object called definition and similarly another string will be the example okay so the definition model is now done yes and now we can just uh close this oh but before closing we have to create the getter setter method here so i'll go to generate gator and setter select both of them and hit enter okay so now you can close the definitions.java so the definitions was inside the meanings model so inside the meanings we have the parts of speech and a list of the type definitions so after these parts of speech i'll create a new list of definitions and i'll call this by the name definitions okay initialize it with null all right so our meanings are objects are now ready so we have to also create the getter setter methods here also so right click here click on generate click on getter and setter select both of them and hit enter so you have the get our setter methods okay we can close this for now and now we are back to the apa response here we can also close the phonetics.java okay so insert the api response what else we are going to have so where we have wrote the word and the phonetics okay so after the phonetics we have the meanings which is also an array of type meanings so let's define here a list of meanings and i'll call this with the word meanings so i'll copy paste the meanings here and initialize it with null all right and similarly here we will also create the getter setter method right click here click on generate getter setter select all of three and hit enter okay so our model classes are now ready so now uh for the api calling we are going to use the retrofit so let's actually uh add the dependencies for the retrofit but before that we have to do the main or the very important part here inside the manifest file we have to add the internet permission so here i'll write users permission android.permission.internet okay make sure you add that otherwise you'll end up with an empty or a blank screen okay so after adding that we can close the android manifest file and let's also close this so now we're going to add the dependencies for the retrofit so i'll go to the gradle scripts inside the module level little file here we have to add the dependencies so here i have opened the retrofits github repository so here as you can see this is the dependency of retrofit so i'll just copy this go back to android studio and inside here i'll write implementation and inside here i'll paste the dependency that i just copied and then we have to add the json converter for the retrofit so for the dependency of the json converter we'll go again the github repository of the retrofit so i'll give all the links of the json converter dependency and the retrofit dependency in the description so make sure to check that so from here we'll just copy the dependency of the json converter so i'll just copy this and go back here here i'll create or paste the dependency for the json converter and here as you can see it says the latest version to add so i'll just remove this latest dot version and here i'll add the latest version of the retrofit which is 2.9.0 so i'll just copy this and paste it here all right so now let's click on sync now okay so once it's done we can go back to our main activity.java here and here we have to create the object of our retrofit but we are not going to add it inside our main activity we are going to use or create a separate class for our api calling so i'll create a new class here i'll call this as request manager okay and inside this class i'll create a object for the context context context and then we'll create an object for the retrofit so let retrofit i'll call this retrofit equals new retrofit.builder this one and then we have to add the base url of our api so for the base url we have to pass only this part of our url until the v2 slash so i'll just copy this part and go back to our android studio and inside the base url's parameter i'll paste it okay and then we have to add the add converter factory method and here for the converter factory we will pass the json converter factory so i'll write json converter factory dot create okay and finally we can build this and after that we can create a constructor for our request manager class so i'll right click here click on generate click on this constructor and here we won't select the retrofit we'll only select this context and i'll click on ok so this is our constructor for the request manager so let's go after this constructor and here we'll create an interface for our api calling so let's create the interface i'll call this public interface i'll name this as call dictionary and here inside the interface body i'll add the annotation get as our api calling method is get and inside the bracket will pass the end point of our api so if we go to the api url or the website so here for the end point we have to pass the rest url of the total url so this part of the url was the base url and this part will be the end point so for the end point i'll just copy until this en slash i'll copy this go back to android studio and here inside the quotation i'll paste it so for the rest of the url if we go to the website you can see for each of the word that we are searching for it it gets added to the url path so for this let's go back to our android studio and here the query we have to pass as a path of the url so to add that we we'll add a second bracket here and inside this bracket will pass a parameter word and we'll define this word inside our method of this interface okay so here i'll create a call of retrofit and the call will be for a list of api response so why i am adding a list of api response that is because the response we are getting here the whole response is a is an array okay so let's minimize this and let's write list of api response and the calling name will be call let's say meanings okay and inside the parameter will pass the path that we want to uh provide here so for this i'll write annotate path sorry path and inside the path as we have written here the word i'll just copy and paste it here and then for the uh path this one will pass a string so i'll write a string word okay and here we have to add a semicolon all right so our interface is now ready now here we have to just create a new method here to handle our calling so here let's create the public method so i'll write public void get word meaning and inside the parameter of the gate word meaning we'll pass uh two things we'll pass at first we'll pass a listener that will capture the response inside our main activity and then we'll pass the word that we are searching for so let's create a custom interface for the listener so for this we'll go here and we'll create a new java class i'll call this as on fetch data listener okay and that will be a type of interface okay so inside this interface body will create two methods the first one is the on fetch data on fetch data sorry on fetch data and which will return as the api response and then it will also return a message string message okay and then we will add another method of on error and the on error will only return the string message okay so now let's go back to the request manager here so inside the methods parameter will pass the on phase data listeners object on fetch data listener i'll call this as listener and then we'll also pass a string of the word that we are searching for so now let's go inside the method body so inside the method body will create an object of our interface called dictionary so i'll write call dictionary i'll call the object as call dictionary equals retrofit dot create and here as the parameter i'll pass the call dictionary dot class so call dictionary dot class all right and then we'll create a call object so i'll write a call and the call will be for a list of api response a list of api response i'll name this call equals the call dictionary object dot the method call meanings okay and for the parameter of the call meanings we have to pass a string so here we'll pass the word that we got from the methods parameter so i'll just pass here the word okay so now let's try to get the response so i'll add the add a try catch block to get the response because if we don't get any response for any particular string or particular weird string then we can easily show an error message for that so i'll write a try block here and inside the try block we'll try to get the apa response so i'll write call dot enqueue and here i'll create a new callback so i'll write new callback here it's suggesting already the callback list of ap response so here we got the on response method and the on failure method and here we're getting an error because we have to add the catch block so i'll write catch exception e and inside the body i'll write e dot print stack trace we can also show a toast message let's pass the context first and inside the text of the toast i'll write an error occurred okay so now let's handle the on response and the on failure methods so inside the on response we will check if the response is not successful so here i'll check if the response dot is successful and we'll add a not here so that we can check for the if the response is not successful so if it is not successful then we will just show a message to pass the context and here we will say error okay and after showing the toast message we'll just return okay and then after this if statement we will call our listener and from the listener we'll call the on fetch data method and for the on face data we have to pass the apa response object and also a string message so for the api response we'll pass the response dot body and as you can see the response body is a list of api response from here we have to pass only an object of the api response so for this i we have to write dot get zero so that will send the first object of the ap response so after that we have to pass a message so for the message i'll pass response dot message okay so that's it for the on response method now let's go into this on failure method so for the on failure method we will just call the listener dot on error and here we will just pass a message so for the message i'll pass request failed all right so that's it for the api handling so now we just have to show the data inside our app ui and we'll get all the data from the request manager class inside our main activity so before calling the api from the main activity let's design our ui first all right so at first we'll go into the activity main.xml file so for this i'll open this rest folder inside this layouts i'll go to the activitymain.xml and here let's resize this first okay so here at first i'll remove this constraint layout and i'll add a new scroll view here all right and inside this scroll view i'll remove this text view from here and i'll add a new linear layout i'll set the width as match parent and the height as wrap content all right and before we start we should add some colors for our ui so i'll go into these values and the colors.xml file so here let's add two colors so i'll just copy this two more times okay and then i'll change the name of this color to yellow and for the color code i'll pass f7 uh cd to e all right and then the second color i'll change it to change its name to gray and for the color code i'll pass 2 4 2 b to e all right and i'll also change the default colors of these purple 500 and 700 for the status bar and the the action bar so i'll just paste the yellow color code here also here all right so now let's go back to our activity main.xml file here so here inside this is scrollview attributes we'll add the background color so i'll pass the attribute called background and here i'll pass the color gray all right and then let's go inside this linear layout and i'll set its orientation to vertical all right and then inside this linear layout we will add a card view and i'll set the width of this card view to match parent and the height to wrap content then let's give this card view um a layout margin of 16 dp and then we will add the current corner radius of this card view to 8 dp and also add a card elevation of 8 db also and then i'll change the card background color to color yellow all right and now inside this card view we are going to add a search view so for the search view here i'll write the tag search view and we are going to add the android x dot search view and here for the width i'll pass match parent and for the height i'll pass attr slash action bar size okay so that will get the default size of the action bar as the search views height okay now let's give an id of the search view so for the id i'll pass search underscore view and it'll also set a query hint for the search view so i'll write default query hint and here i'll pass search words okay and i want to set the search view as iconified by default to false because if we don't add that then the user have to click on this search icon and then the search view will expand i want to keep it expanded by default so for this i'll write iconified by default to false okay so now under this uh search view sorry the card view we have to create another linear layout so i'll create another linear layout i'll set its width to match parent and the height to also match parent and let's add a margin for this layout also so i'll write the margin as 16 dp sorry to sp it should be dp okay 16 dp and then i'll also add the orientation as vertical and then we'll go inside this linear layout and here we'll add a text view and the width of the text view will be matched parent and the height will be wrap content here let's give an id to this text view so actually inside this text view we'll just show the word name that we're searching for so i'll write this ideas text view underscore word okay and now let's give this some more attributes like the text size i'll show as 24 sp let's set the default text as uh word let's change the text color here so i'll say i'll change the text color to color yellow here and let's put this text inside center so i'll write text alignment to be center okay let's give this a small padding of 8dp and we'll also change the text style of from normal to italic okay i guess that's enough then under this text view we are going to show a recycler view so inside this recycler view i'll set the width as match parent and the height as wrap content i'll give an id for this recycler view so for the id i'll pass recycler underscore phonetics because we are going to show the list of the phonetics that you will get from the api if you see here the phonetics is a list so we'll just show the text and audio here all right let's go back to our android studio and then under this recycler view we can show another text view which will define that the below below items are the meaning of that word so here i'll just copy this text view that we defined earlier i'll copy this here and i'll just remove this id from here and i'll change the text to meanings and i'll change the okay let's keep it as it is and then under this i'll again uh copy this recycler view and paste it here i'll change the id from recycler phonetics to recycler meanings this time because here we'll show the list items of the meanings object alright so activity main is now done now just we have to add the custom [Music] custom layout for our uh recycler view items so for this let's create two items here at first i'll right click on the layout and i'll create a new layout resource file i'll call this as let's say phonetic underscore list underscore items and click on ok so here it is so at first we will change the constraint layout to a card view and i'll change the height of this card view to wrap content and then inside this i'll pass some more attributes like the uh card elevation as 8 db and the card corner radius as 8 db and the card background color as color yellow all right and then inside this card view i'm going to add a new linear layout i'll set its width as match parent and the height as wrap content here i'll add a margin to this linear layout i'll set the margin to hdp and then i'll go inside this linear layout and here i'll add a new text view and for the text views width i'll pass 0 db because we'll use weights here so i'll pass 0 dp and for the height i'll pass wrap content and then for the weight i'll pass one all right then let's give this textview an id so for the id of this text view i'll pass text view underscore phonetic let's set a default text here and low okay and let's change the text alignment here text alignment to center and then also let's change the text color to color black maybe yes and then let's change the text uh text size let's set it to 8 db 18 db sorry not 8 18 sp all right all right so our text view is now done now we have to add a new image button uh for playing the audio of that particular word so for the image button uh after this text view i'll write image button and here for the layout width similarly i'll pass 0 dp for the height i'll pass here wrap content and then for the weight i'll pass one here okay let's keep this image we run an id i'll pass as image button underscore audio and then for the image here we have to create a image inside our drawable folder so i'll just right click into our drawable and i'll create a new vector asset and here i'll click on this clipboard and here i'll search for the volume icon okay let's say volume yes the volume up click on okay let's change the icons color okay let's keep it black and i'll change the name to ic underscore play and i'll click on next and then finish so now to add this uh inside this image button tag i'll pass src and here i'll pass at the rate drawable slash ic underscore play so here we got the image and now let's change the background so i'll write the background as at android color transparent okay so it looks nice now okay we can also add some um margin here so let margin as let's say 4 db here and let's decrease this to 4 db also okay so now uh our phonetic list items is done we can create another uh xml file for the meanings list item so i'll right click here create a new layout resource file and this time i'll call this as meanings underscore list underscore items click on ok go to split view and here again i'll remove the constraint layout to a card view here and similarly i'll just change the layout height of this card view to wrap content and i'll add some more attributes like the card elevation to 80p the card corner radius to 80p and the card background color to color yellow here okay and let's also add some margin to the top of the layout so layout margin top to let's say 8 db so it gives a gap to the from the uh list items here okay so inside this card view we have to add a linear layout and i'll set the width as match parent and the height as wrap content here and i'll set the orientation of this linear layout here to vertical okay the previously uh the phonetic list item here the we haven't defined the orientation of this linear layout because by default it takes the orientation as horizontal so in this case we are going to use the vertical orientation that's why we defined it here okay so inside the meanings list item if we see the api will only show the parts of speech and the definitions so we'll show the parts of speech inside a text view because it's a text and then for the definition it's a list item so the definitions we have to show inside a recycler view okay so let's do that i'll go back to the android studio again and inside this linear layout will create a new text view i'll set the width as match parent and the height as wrap content here and then let's add an id for this text view so for the id of the text view i'll pass text view underscore parts of parts of speech all right and then let's add a custom text here let's write exclamatory all right okay let's see the ui also how it's going okay let's change the text alignment of this to be center let's also change the text color to be color uh black we have to also change the text size here so i'll change the text size to 18 sp let's give this also a padding of 8 db and then we'll change the text style here to bold now we can add the recycler view under here so i'll add the recycler view here and here for the width of the recycler view i'll pass match parent and for the height i'll pass wrap content let's give this recycler view an id i'll call this recycler underscore definitions because we're going to show the definitions list inside here and then we'll add a margin here so i'll write margin for a total of 8 db all right so now the fun part here is here inside the custom layout of a recycler view we are using another recycler view okay so let's see how it goes so now we have to create another xml file for the list items of the recycler definitions so let's do that also i'll right click on the layout create a new layout resource file and this time i'll call this as definitions underscore list underscore items okay let's go to this split view here and again do the same i'll change this constraint to card view and i'll change the height to wrap content here and i'll also add the attributes the card elevation adp card corner radius 80p and the card background color to color gray this time all right so here i almost forgot to tell you one more thing that is sometimes inside the response of the api we can get the synonym and antonym of the word okay so the synonym and name will get inside these definitions okay so let's add the uh object for the synonym and antonyms and we'll get the synonym as a list so for this we have to go to the definitions here and here previously we have defined the definition string and the example string now this time we will add two more objects first one is the list of string which we'll call as synonym remember to use the exact spelling that i am showing here to avoid any crash issue so i'll initialize it as null and similarly i'll do another one list of string and this one will be the answer name and two names okay senior names and antonyms remember to use the same spelling that i'm using here okay so now we have initialized it and we also have to create the category method for these two objects so again i'll right click here click on generate getter and setter and i'll select both the synonyms dot list and enter names click on okay so you got the uh get resetted methods okay so now let's go back to our where we was inside the definitions list item okay so here as we defined the card view so insert this card view we have to add a new linear layout and for the width of the layout i will press match parent and the height of the layer i'll pass wrap content here and i'll also change the orientation of these two vertical and then inside this linear layout we're going to add a text view so under text view and i'll set the width as match parent height as wrap content here so inside this text view i'll set a let's set the text as definition we have to also give this textview an id i'll call this as text view underscore definition okay and let's set the text style of these two bold and then we'll also change the text size here text size to 18 sp and we'll also change the text color of this to color yellow and then we'll change the text alignment to be center and we'll also add a padding of hdp so now similarly i'll copy this text view and paste under here and this time i'll call this uh id as text view underscore example let's set the text as example okay and let's change the uh text style to normal here and then under this i can also copy this text view paste it here i'll remove this id from here and this time i'll write here synonyms and i'll copy this paste it under here again and this time i'll change the ids text view underscore synonyms synonyms okay and i'll change the text size to 16 sp okay and then i'll copy these two text views that we made for the synonym under here and this time i'll change it to antonyms and i'll make the text viewers text view underscore enter names okay let's remove the placeholder texts from here all right so now as you can see the ui it's almost perfect we just had to we just have to add a margin uh to our card view so let's set the margin of 80p here okay so now that looks nice so our ui elements are now done we can just close all of them from here close all tabs now we can go to our main activity here and here we have to start our coding to show the data inside the ui so at first let's create some objects for our view items so at first i'll create a object for the search view and one thing you have to make sure is that as we have used the android x search view we have to create object for the android x item so search view i'll call this as search underscore view all right and then for the text view there are several text views so inside the main activity we have the text view on the word okay so i'll just copy the id from here and use it here okay then we have the recycler views so there are two recycler views inside this this one is the recyclerview phonetics so i'll just copy and paste it here and the second one was the view meanings so copy and paste it here so now inside the oncreate method we have to initialize these views so let's start from the search view so i'll just copy and paste this here search view equals find view by id r dot id dot search view i'm using the same name for the objects and the ui id okay you can also do the same or if you have used uh custom names for the objects then make sure you for the id you are passing the exact id that you have given inside the xml okay and then let's do all the rest of them [Applause] all right so now let's create some other classes to show the data inside our recyclerview items so for this we have to create a viewholder and a custom adapter okay so let's create a new package here i'll call this as view holders so inside the view holders we will create a java class and i'll name this as phonetic view holder okay and i'll make this extends recycler view sorry recyclerview dot viewholder and we have to click on this red bulb and it's suggesting to create constructor so i'll click on here and here we have the constructor so now for the phonetic recycler view custom items i'll go here we have to initialize all the views that we have defined here so here we have only two views that is one text view and one image view so i'll just copy the text view name go to phonetic view holder and here i'll create a public text view and it will pass the name and similarly a public image button and i'll copy the id of this image button okay so now after this super we have to initialize them so here i'll uh just copy this text view's name equals item view dot find view by id r dot id dot the text views name here it's showing an error inside the r if we click on that it's suggesting to import the class by hitting alt enter so i'll write alt enter i'll press alt enter okay so add the semicolon here let's duplicate this and i'm duplicating this by clicking on ctrl d okay so copy this image button audio paste it here paste it here okay so our uh phonetic view holder is now ready so similarly let's uh create viewholders for uh the other two items like the definition view holder and the meaning view holder okay make this extends [Applause] [Music] view recyclerview.viewholder click here create constructor matching super and here we have to create the objects and let's open the definition list items here here at first we have the text view definition i'll copy this i'll create a public text view text view definition go back again we have the text view example also so i'll add comma text view example and then we have the text view synonyms copy this add after the comma then we have the text view antonyms so comma textview antonyms okay now we have to initialize them so after the super i'll write the text view definition equals item view dot find v by id r dot id dot uh the same textview definition okay now copy this for three more times let's take the textview example paste it here paste it here takes your center name paste it here paste it here takes view enter names copy paste it here paste it here okay so this one is also done now it's time for the meaning view holder so create a java class meanings view holder okay also make this extends recyclerview.viewholder create constructor matching super now for the objects if we go to the meanings list here and this is the textview parts of speech copy the id and text view take a few parts of speech go back again here we only have the recycler view so i'll just copy this and go back again okay we have to end this with a semicolon and then i'll add the recycler view paste the id and we have to define or initialize them here so i'll write item view sorry at first we have to get the name so text view parts of speech equals item view dot find view by id r dot id dot text view parts of speech so similarly i'll do for the recycler view i'll just copy the id of the recycler view control v control v okay so now our meanings viewer is also done and now we can add the custom adapter or create the custom adapter classes for the recycler views so right click here create a new package i'll name this as adapters and inside this adapters package i'll create the custom adapter so i'll create a java class i'll call this as phonetics adapter and here i'll write extends recycler view dot adapter and here i have to pass the view holder so for the phonetics adapter i'll pass the phonetics viewholder okay so click on this red bulb here and click on implement methods select three of them and click on ok so here we have these three methods the oncreateviewholder on bindvigor and get item count so here at first inside this class we have to create two objects so at first i'll create an object of the context so private context context and then i'll get the list of the phonetics that we have to show inside this recycler view so let private list of phonetics i will call this phonetics list okay and then let's go inside this oncreateviewholder here instead of returning null will return a new phonetic view holder and here we will create a layout inflator dot from and i'll pass the context here and then dot inflate and here for the layout i'll pass r dot layout dot phonetic list items and the second parameter is the parent that we got from here and the third parameter is false okay so that's it for the oncreateviewholder then for the onbindviewholder we have to show the data here but before that in the get item count instead of returning 0 will return the phonetics list dot size okay now let's go inside this on bind view holder and inside here at first for the holder dot text view phonetic set text and here we will pass the phonetic text so let phonetic list dot get from the position and from the position of the phonetics list we will get the text okay now we have to add the audio to our image button so that every time the user clicks on the image button it plays the audio so for this we have to write holder dot image button audio dot set on click listener new view dot on click listener and here inside this on click method we have to uh create a instance for our media player class so i'll write media player i'll call this as player equals new media player okay and then we have to [Music] play the audio so let's surround this with a try catch block so inside the try block we'll write player dot uh set audio stream type and here for the stream type i'll write audio manager dot stream music okay and then we'll set the url so i'll write player dot set data source and here for the data source at first we have to manually add the https colon and after that we will add the data that we got from the list so i'll write phonetic list dot get from position dot get audio all right and then i'll prepare the audio player so media player dot prepare and then the player dot start okay and here it's showing an error because we have to add the cache block so let catch exception e and inside the exception uh catch body i'll write e dot print stack trace and we can also show a toast message pass the context and for the text i'll pass couldn't play audio alright so our phonetics adapter is now done we can close this and now similarly we have to create adapters for the uh meaning and definition also so let's create a new adapter for the for the uh meaning first so i'll write meaning adapter and here i'll make this extends recycler view dot adapter i'll pass the meaning view holder here okay it's showing error i will click on implement methods select all the three and click on ok so here at first we'll create a private context object and then a private list of the meanings meanings i'll call this meanings list and then we'll create a constructor so i'll right click here generate constructor i'll select both of them and hit enter so here we have the constructor maybe we forgot to add the constructor on the phonetics adapter yes we did so we'll just recreate that so right click here click on generate constructor select both of them and hit enter so here we have the constructor so let's go back to our meaning adapter here we have the constructor and now inside this meaning view holder similarly like before we will create a new meaning view holder and here i'll pass layout inflator dot from i'll pass the context and then i'll write dot inflate and here i'll pass the layout which is r dot layout sorry r dot layout dot uh meanings list items the second parameter is the parent and the third parameter is false all right and similarly for the get item count i'll pass meaning list dot size and for the on bind view holder here we have to attach the data to the views so i'll write holder dot uh okay it's not getting the data because maybe we forgot to make those view items public so let's go to the view holder the meaning view holder yes we have to make them public all right let's go back to the meaning adapter now and i'll write holder dot text view parts of speech dot set text and here i'll write parts of speech and then i'll concat the meaning list dot get from position dot get parts of speech all right and then we have to add the data for the recycler view so for this i'll write holder dot our recycler definitions dot set has fixed size to true and then i'll set the layout manager so holder dot resetter view definitions dot set layout manager new grid layout manager and here i'll pass the context and then the span count let's pass one and then we have to um add the definitions to the definition adapter but we haven't added or created the definition adapter now so at first let's create the definition adapter so i'll right click on this adapter create a new java class i will call this as definition adapter i'll make this extends recycler view dot adapter i'll pass the definition view holder here implement methods select all of three here we have the definition adapter methods so similarly like before at first we'll create object for the context so context context then for the list of the what the definitions sorry not the adapter definitions i'll call this definitions list okay we have to generate the constructor right click here click on generate constructor select both of them hit enter we have the constructor now for the view uh oncreateviewholder return a new definition view holder layout inflator dot from pass the context here dot inflate r dot layout dot definition list items parent and false all right and similarly for the get count i'll pass definition list dot size okay then the on bind viewholder we have to add the data so i'll write holder dot text view definition dot set text and here i'll write definition and i'll add the definition from the list select definition list dot get from position dot get definition okay that's done now for the example holder dot text view example dot set text here i'll write example and we'll add definition list dot get from position dot get example all right now we have to add the synonyms and antonyms but as the synonym antonym is coming inside a list so we'll just add this to a string with the string builder so i'll create a new string builder i'll call this synonyms equals new string builder okay so similarly i'll create another one for antonyms okay now we have to uh append all the synonyms and antonyms to the string builders so here i'll write synonyms dot append and here i'll pass the definition list dot get from position dot get synonyms all right and same for the antonyms i'll just change this to andronyms okay and i'll change the method get synonyms to get antonyms all right now we have to attach the synonyms and andronyms to the uh synonym text view and antenna text view so let holder dot text view synonyms dot set text and here i'll pass the synonyms and then for the holder dot text view antonyms dot set text i'll pass enter names okay so one more thing that i have missed inside the ui is uh we have to give the text view of the synonym and name a horizontal scrolling automatic horizontal scrolling so for this we have to go to the layout of the uh definition list items so here inside this text view and here inside this text view antonyms we will add a few more attributes like the scroll horizontally to true and then i'll pass single line to true again then i'll pass the ellipse size to marquee and then i'll write the marquee repeat limit to marquee forever let's also change the text style okay we already have the text style okay here we have the text style we will make these two italic okay so now we will just copy these five attributes that we edited now and we'll paste it inside the text view synonyms also okay paste it here okay so that's now done now let's go back to the definition adapter and here after setting the text we have to make those textures selected so that holder dot set uh sorry text view synonyms dot set selected to true and similarly holder dot text view antonyms dot set selected to true all right so our definition adapter is now done now we can go to our meaning adapter that was incomplete so here for the recycler definitions we had to pass the definition adapter so let's create a object for the definition adapter solder definition adapter i call this definition adapter equals new definition adapter and here for the constructor at first we have to pass the context so i'm passing the context from here and the second parameter is the list of the definition so for this i'll pass meaning list dot get from position dot get definitions all right add a semicolon here okay and then we have to add this adapter to our recycler view so i'll write holder dot resetter view definitions dot set adapter and we'll pass the definition adapter here all right so our adapters are now done now we can go to our main activity.java here and here at first let's do one thing we have to add a on query text listener for the search field so that when the user types something inside the search view and queries it we have to call the api with the word that the user typed inside the search view so for this insert the oncreate method i'll call the search view dot set query text listener set on query text listener and here i'll pass in new search view dot on query text listener so here uh we won't do anything inside the onguide exchange we will work on the on query text submit here instead of returning false we will return true here but before that we have to call the api so let's do one thing we can show a progress dialog here so let's define a progress dialog up here so i'll write progress dialog i'll call this progress dialog okay and we have to initialize it here so i'll write progress dialog equals new progress dialog we have to pass the context here so i'll write this okay and inside here i will write progress dialog dot set title and here for the title i'll pass fetching address bonds for then we'll add the query that the user typed on the search view all right and after that we will show the dialog so i'll write progress dialog dot show and then we'll call the api so to call the api at first we will create the request manager class object so request manager i will call this as manager equals new request manager and as for the constructor of the request manager we we have to pass the context so i'll just pass this okay okay it's not working with this so i'll write this at that main activity sorry not at that main activity dot this okay and then we can call uh get the object manager here select manager dot get word meaning and here for the parameter of the get word meaning at first we have to pass the listener so let's pass a listener sorry listener we we haven't created the listener yet but we will do it later and the second parameter will be the string that we are looking for the responses so for the string we will pass the query that the user typed okay now uh let's create the listener so i'll create the listener outside of the oncreate method okay so i'll just go outside of the oncreate method here and here i'll write sorry not protected private final um on fetch data listener i'll call this listener equals new on fetch data listener and inside here for the on fetch data when we'll get the on phase data we'll just dismiss the progress dialog so i'll write progress dialog dot dismiss and then we have to check if the response that we got is null or not so i'll write if apa response dot equal equals null so if gets a null response then we'll show a toast message that no data found so i'll write toast i'll pass the context here okay not getting this sorry main activity dot this okay then for the text i'll write no data found okay and we have to return from here okay so after this if statement we have to call a method that will say show data and inside the methods parameter will pass the api response okay so the method is not created we'll create that by clicking on this bulb and create method show data we'll click on the main activity here so here we got the method and one thing here it's showing an error because here we have to put a semicolon okay so inside this show data method we'll just attach the data to the views or the receptor view that we want to where we want to show the data okay so at first inside our main activity we have a text view word where we have to show the word that we searched so for this i'll call the textview word dot set text and here i'll pass word plus apa response dot get word okay and then we have to add the phonetic recycler view the phonetic response data to the phonetic recycler view okay so here i'll say recycler phonetics dot set has fixed size to true and then set the layout manager so recycle phonetics dot set layout manager new grid layout manager the first uh parameter is the context this the second parameter is a span count i'll pass one and then we have to create the adapter so let's define the adapter up here at first we'll need the phonetics adapter i'll call this phonetic adapter then we'll also need the meaning adapter i'll call this meaning adapter okay and we'll define it under here so let phonetic adapter equals new phonetic adapter and here we have to pass the context at first and then we have to pass the list of the phonetic so i'll just pass apa response dot get phonetics okay and then we have to set the adapter to our recycler view so let me recycle view phonetics dot set adapter and here i'll pass the phonetic adapter all right now similarly we have to add data for the you know um recycler view meanings so again i'll call the recycler meanings dot set has fixed size to true then recycler meanings dot set layout manager new grid load manager the context and the span count then the meaning adapter equals new meaning adapter and here for the context i'll pass this and then for the meaning list we'll pass ap response dot get meanings okay and then the recycler meanings dot set adapter and here we'll pass the meaning adapter all right okay so it will show the data now so our on fetch data method is uh complete now so now let's focus on the on error so if we get the method on error we'll just uh at first we have to dismiss our progress dialogue so let progress dialogue dot dismiss and then we have to show a toast message so i'll write toast the context is this okay not taking so many activity dot this and then for the text we'll just pass the message that we got from the parameter okay okay so it's now done but the api will be called only when the user will input something on the search view and search for it but when the user will open for the first time nothing will happen so to avoid this we will do a custom query which will load every time the user opens the app so for this we'll go inside the oncreate method and here i'll just uh copy this part of the on creative submit and i'll paste it here and here progress direct set title here i'll just change the entire text to loading and then request manager okay everything is same get word meaning and here for the first time when the user will open the app we'll search for the word hello okay so that will load the result for the hello on first time launching the app all right so our app is now ready now we can test this so let's connect this to my phone okay and now let's try to run it [Music] as you can see the app is now installed it says loading and it loaded the response for the word hello because the app launched for the first time and as you can see here are the responses we can click on the play audio button let's click on that and see what happens hello hello okay so the audio is also working fine let's try to search for something let's try searching coding phasing response for coding and here you go we have the responses for coding let's try to hear that coding nice so our app is now working fine all right so that's how we can create a dictionary app with rest api i hope you guys enjoyed this video and if you enjoyed please like share and subscribe to my channel because i'll be making more awesome android projects like this thank you so much for watching you

Channel: Coding With Evan

Views: 6,076

Keywords: How to create Dictionary app in Android Studio, How To Make Dictionary App in MIT App Inventor [ Full Forms App ], Create Android Dictionary App using Firebase Realtime Database - Android Studio Tutorial, How to create Dictionary App in Android Studio 2021, How to create a dictionary app in android studio, how to make a dictionary app for android, android development projects, android projects for beginners, easy android project, university project, best college project, rest api

Id: bCXD5aADPfE

Length: 86min 38sec (5198 seconds)

Published: Mon Sep 27 2021