How to design the prototype of the app?

So now we have dog uh breathe this uh like what it likes what he doesn’t like the thing is this is hardcoded but if you look in the video first it shows ace then it could show this yasmin so it constantly keeps changing so we shouldn’t hardcore it so but we want to show it in the preview pane how do we do that yes if you if you remember we we did it just a while ago instead of android we just replace android with tools so this charlie it shouldn’t be hard-coded so let’s replace this with tools now it’ll only show in the preview pane next second it’s labrador again it shouldn’t be hardcoded so change it to tools third likes this can be hardcoded because likes will never change it’ll always stay same this what it this part will change so don’t hardcore it just change it for tools it’s like when this bathing part of it click on it and change this android to tools so now this this so name breathe uh what it likes what it doesn’t like will be i use it only for the preview so it’s actually empty you know if you in in reality good so we have come quite far now something to note is in the video if you see here there’s a background color to this image view let’s do that so image view so i scroll all the way to the top let’s add a background to this and search here for primary light this is again a color that you downloaded.

So primary light enter get this primary color now for our preview let’s add a an image here so tools because it’s not hard coded image it could change so tools src source for an image is equal to and then the double quotation marks here you can type in a dog placeholder this is the image that we use for just for testing purposes so very good you have completed your layout for the second app also so very good progress uh yep and now the last thing that’s left let’s say let’s add ids to all the views that will change so we can um tap into them from the java code whenever you want to modify something in the xml from code you have to always identify it uniquely by an id so the image will change so id oh i’m going to try here so this let me show you type in your id and the first one enter then it asks you i read android or default choose the first one so plus id slash so you can type in like iv underscore dog so we add an id to this image this will change so listen let’s add an id to this text field so again at the top usually id enter the first one plus id slash or you can type in something like tv underscore name and this is a dog’s name this one will be dog breed so id enter first one enter plus id slash right alert plus id class tv just transfer text view and bleed next one this should i should we put it should we put an id to this likes so notice here likes went for a secured lights for it still shows likes so we this will never change.

So don’t put an id here we don’t need it long box this will change depending on what the doubt like so let me go slow id enter enter uh this will be tv unscored likes the dislikes don’t put it same reason as last time this one id equal to i mean enter enter tv it’s like cool so we have this now um and let’s verify if you have completed all the screws here oh we did it so we did all the tools here now the last step is step 6 except five sorry so we have extremely extremely close the end so terminal save all the changes just like last time get add dot from it dash m and the two double like a quotation things and here you can type in a custom message like completed step four just anything basically completed step four good we have completed this and let’s head over to step five so if you want to run the app like this details everything run till step three so in step four the only new thing that we did was we added this new activity but so it won’t change how the app will run so actually this uh yeah so we can just move on to step five uh step by step code checkout as step by step by starter code so one thing you’ll note is in some places i might have forgotten to in the starter code actually have to add these two lines so just be sure that you add them if you double this adapter adapter go to new the same that we did before right we created a new adapter and we added we added it to the list view context this resource zero and m list view dot set adapter adapter.

So as i explained we created an adapter and we sent it to the listview so we created the brain the body won’t move without the brain so we added the brain to the body cool so um we are here step four complete step four uh now the last reduce is in details activity so uh the thing is in details activity we have to populate these fields right in these fields depending on what dog was clicked so in multi-activity screens how do we implement multi-activity screens by the way yes intense so i’m just saying yes intense i assume that you will know it but it’s not not one we’re always going to review it so no problem so here if let’s create the five variables for the five views that will change in active underscore details so like the image the name breed likes dislikes so one two three four five so we can change it in code so here image view you can name it as private image view mib dot same for all the other ones so let’s uh it’s the same like nothing new textview m pv mean same as all the previous weeks that we have done create these global variables m tv breathe name breathe textview m tv likes if there’s any questions on what are you doing why is he writing so fast i mean i’m not driving fast by the way since i’m slowing it down but you may want me to write even slower so let me know if you need me to write slower uh dislikes so basically we just created an available for each of the views in actual underscore details so image name breed likes dislikes so five five views next initialize them using find viewer id.

Yep i’ll do this very quickly because we know this i’m confident we know this ivy dog same thing because the shortcut is ctrl d and ctrl y deletes the line ctrl d duplicates the line some nice shortcuts to learn uh so now in this order right so let’s do m tv name mtv breed m tv likes m tv dislikes and the same thing here tv and for name so basically linking all the xml elements with these java variables likes now if get intent is not equal to null then populate ui um so oh by the way so now we have these values but now how do we put the values in in these uh like how do we so now we don’t know what’s the name of the dog so when the like you guys are saying like when let’s when this dog is clicked if to pass the information from the main activity to the down to the details activity how do we pass details yes it is using uh intents so so if get intent is null so if get intent is not equal to null so basically if if um an intent has called this activity so basically if this activity is started and somebody has passed an intent along with it right it’ll be it’ll be clear so don’t worry here you can just column this method that we haven’t implemented so far called populate ui which what will it do let’s see string name is equal to get intent dot get string extra so let me write this then you can figure out what i mean i can explain what i’m doing so basically from the intent it will send so intent think of it like an envelope so we take the envelope that says start a new dog.

Leave a Comment