Flutter Tutorial - Hive in Flutter

hi welcome to flood Junction today we are going to learn I've been Slaughter and we shall be learning hype first with the slides and then we create the project uh using hype and before that if you haven't subscribed this Channel Please Subscribe and press the Bell icon to get notified on a Point Breeze right now let's move to our first section we shall be learning the basics of five uh with this slide and you can find this slide on this description below uh please find it and first what is hype it is the lightweight nosql database that is used to store data locally in water and that applications and it is very simple to use and it consists of a key value database without numerous relation that means we don't have to use any complex relations for using hype and box and without a box we cannot use hype is hibis stores its data to the Box and for a small box a small app a single box might mean up but whenever our application gets bigger we need to have uh more boxes and also we can share the encrypted and sensitive data also and first we need to open box to use the Hive and to open box we can use this syntax open box with the data model that means our model and then the and the Box name and then also we can use this index so without the data model and we can use either way and without opening the box we can perform we cannot perform any operations uh that is to create read update or delete the data and to get the open box or again it is very simple to use adject box and our box name and whenever our we don't need the Box we can close the box and so that we release the memory and uh we can use we can achieve by this syntax of it box Dot close and it is very simple to close the Box and write writing means we we are adding the data and so we can first we open the box uh find the box and then we put the value in key and this is the value that means we we store the name don't do and we put the friends in Hari Ram Sita we can uh add any sorts of data that means issuing or array or map or numbers and as you can see this is array this is number and you can find this is the map data and to read the data just we need to uh our we need to find the box and then just get the key name that means as you can see here whenever we put the name here name key and then whenever we call this stream name box.getname we shall be getting Zone though and whenever the key is not present that means the value key is not present then it is returned null and also we can use the default value and we can achieve this as follows and box that get our key whenever it gets null we can get the default value 12.5 and type it up source and all types of data types are almost accepted by the height and the type adapters convert the object from n to Binary form and before using the type using the uh however we need to uh register them and we can generate or we can write on it on our own and to register that first using the our hype or adapter into register it and it is very simple to register you can see architect Logistics and why to use hybrid database that means it is very fast and performance like uh in compared to other databases like sqlite and set references and it does not have much relational operations queries and it is very easy to perform the plot operations and why not when to use hype that means we can use a height to store card contents that means whenever we click on the cut then our we can restore the card contents in our blog and articles messages categories of the products that means any Commerce and session that means our whether the user is logged in or not and also its information and why not you do use hype whenever our system gets bigger and whenever we need to perform the complex queries uh we cannot use hype for that you should consider using the sqlite thank you now we shall be learning Hive with the project uh we are going to create the groceries the app this is how our final application will be working and whenever we don't have data we have no data and we have the app bar with the title browseries memo and whenever and we have our fav item whenever we click this icon Floating Action button and then we have the form validation we cannot uh leave them empty and let's uh input our first groceries that would be let's say potato let's say 1 and the Matrix 42 is 1 kg the Matrix means our Matrix of the items right and we have our memo created and whenever we click again and then let's say oil quantity to one and then our Matrix would be little because all our oil would be in later and then we create new and we have our again the memo is created and we can also edit our memo I'll updated let's say and then let's make it 10 and we can also change this let's say 2000 and update and we have the oil our data updated and also similarly we can delete the data this is I have our final application would be looking right now let's go to our project and build our app browseries meme for that we need to have our dependencies uh added on our pop sector to ml file which dependencies you can file them in the description below uh and you need to add them in the dependencies I already have a edit this dependencies high five flutter path provider ad generator and in the dev dependencies we will be adding build Runner and then we run up get right now uh after uh adding all the dependencies in the pop sec.uml file let's move to our main.file let's remove this foreign control space I usually be having this uh options and you can create State list or register to user easily and I will be making mistake to lose it so I chose this stateful user and name it home page foreign Trail Dot Dot from plotter and then it's covered scaffold is coupled with the screen of the mobile or the emulator let's keep the upper title text bursaries memo to anybody now let's enter [Music] text no data and then floating action button to add our data as you can see here this Floating Action button whenever we don't have a data we would be having no data and then groceries memo and then floating on Quest so let's leave it empty for now and then child icon I construct it let's make it cost and let's make it constant right whenever now whenever we click this Floating Action button we are going to show the model this model now let's add the model layer before that let's import home page government.file in our home base would be homepage right whenever we click The Floating Action button we are going to show the model bottom model let's create the widget context none and null foreign [Music] [Music] and so model buttons it in the context should be context and then build a now let's leave it empty now let's and then get some arguments here that means is dismissible that means false that means whenever we click outside it is not going to be so we have to click exit to get close this is for control pause then our side we are going to show the form and we are going to validate it you can see here we are going to validate it so we need the form key equals lower foreign state close it now then form key our home key this key and then child column and then detect field from build as we are going to pilot it we need to use the text form field widget and our controller controller also name item controller equals text editing controller and then again another controller for our quantity let's finally and also this also and then and name it quantity controller foreign selected value let's leave it empty and also some metrics so let's uh defend them also Matrix equals Z Square liter foreign let's go to our form and then our control first two would be item controller and then next text from field and then controller will be put UI controller and then when we send these area right and this will be closed and then now let's restart it but reload you can see here we have that I bar and no data and then our model but um is opened and whenever we click outside it is not closing let's add some button so that we close this uh button sheet to our home base you can see here we don't have the label let's add some level and the space between in the text field let's beautify it first let's move to our homepage dot dot file let's keep some padding to the container once is Dot only comma and then from bottom [Music] will record it context here button and then from Top sorry this should be inside the padding from Top 15 right and also from left 15 and then when we are restarted we can say our inform bills having some space from top left and bottom right whenever you click it foreign the text fields right now here's some the drop down and the button to save in delete the this uh models it also now let's add some label decoration input configuration in text item name let's copy this and then paste here item quantity and also the Bell letter that means whenever our Fields so the era if Hello dot is empty should not be null when value is not emptied we are going to return we are going to return required field f i currently filled and then whenever doing nothing we return null then also quantity also and then let's set the drop down for The Matrix button from field and unchanged foreign this Matrix so Matrix Dot map items drop down foreign Dynamic can be assigned to that it should be to place right now and then our the value from the government item and then also the validator for now a letter to value similarly whenever if selected value is equals null that means we haven't saved any as any Matrix will return symmetrics is required and it is whenever it is false written now right now on change whenever our drop down item is changed we set the state selected value would be equals to new value right now whenever it reload it now we shall find restart it and then when I click we have the text field name and the drop down and we have the Matrix here we have the text field now we we have the we need to have the button to save and exit the model bottom sheet and you can see here there are not space between detect field let's give some space of course all right and skipped in a copy and paste this and also here and we are going to place the buttons in row children button on pressed let's leave it into for now and then child would be text exit let's give some style to our button Style elevated button Dot spell Pro and our background color of would be color or exit and then our text color would be foreign let's duplicate it and then it should be background color would be let's slip this empty Let's uh okay green and white and should be saved save let's restart it again and whenever we click we have text fields and the drop down to select item item buttons and let's make them expressed a bit further them and also the this size is smaller for that Ministries alignment alignment dot space and it takes our items far from each other for now let's make this Navigator contacts and it closes the dial up whenever we press the exit button let's restart it it is model bottom side so the state is not operating as you can see these buttons are spaced from each other and only click exit the button model buttons it is closing and now this space we have this extra space let's remove this and in our column let's give NHC size main axis size dot mean means it takes already minimum sides and only you are to restart it again click and then we can see we have the outer extra space is gone and then we don't have the up in texture let's place the index in the drop down right we haven't also given the value also value that means our selected value whenever we select the items and then we have our value would be selected value and then our in text foreign outline input border radius now we don't need the board radius first now political product and then outline decoration this should be input decoration it's an embroider and the Border will be outlined and let's keep about radius order radius we can have outline input water without button radius right now we have the text field and the also the border and this and this selected Matrix when you can select it we can type them and we shall have the value and when you click exit our buttons it is exiting now we are going to create the model to save this data right now let's create the modeling delete folder name it data underscore Dot and here we are going to Define how our data would be look like let's import type first hi I've got that and then we Define our I type ID 0. this type ID must be different for a different boxes in the class data model actions the hive zip after it FP that means our field index 0 right in zero string item and also our second field one final string quantity and the Third Field our Matrix have built to find a string Matrix and then we'll get the model Dot item is Dot now we need to create also the type adapter for that let's write part data underscore more this is needs to be same and then dot g dot Dot and then in our terminal let's create new terminal here we need to run the build Runner so that we have our adapter created and for that we need to command plotter packages pop run which underscore Runner build and it may take some time foreign [Music] type adapter created as you can see here this uh file is uh generated automatically and we have this we can also send this but we don't need to change it whenever we change our data model we need to run the same this uh runner build and we shall have our type adapter updated now let's get back to our application so that we need to we have to save this data to our hive let's get back to our home page foreign we have to save the data to our height now let's check the validation first if from Global key Dot current state that means if our form is validated or not if it is validated then we are going to save the data for that let's initialize our box particular box variable and come back to our Sim function here we are going to open the box after open box and let's say our box name would be hypox and this should be a thing for that await and need to import hive right now we have our data model created we save this data model to our Hive so we initialize our data model and then our item would be item roller Dot it means this controller we take the Bell from the item controller similarly quantity would be quantity controller Dot text and then our Matrix Matrix would be selected value and now item key equals null means this item click if our item key is not that means our data is not present in our hype database item key is not if it is null and we are going to save the data box Dot and data model that means we are going to add our data to the Box and then wait Navigator and then we close the dialog and after saving we set our pump that means equals it is empty similarly according to controller dot text equals empty and then I have selected valid way null let's start restart it again now we click on Floating Action button when you click save we have our we can't save the form without doing them indeed so item name would be let's say potato and quantity one and then when you save we are getting the either here instead you need to analyze and initialize hype or provide store to the box that means we need to provide the path to store the height for that let's move to our main dot dot file in here let's remove this let it clean and into our main yeah we need to initialize our our I for that widget binding dot initial inside that means all the bindings would be initialized it makes your retention inside makes your all our widgets binding would be initialized or not and then directory directory equals await provider okay we need to import the part path provided here good path provider is provider and we can use this path provider here and this orbit it should be async a signals and then path provider dot get application documents directory our directory that means our folder to our uh to save the our data and then over the init the directory Dot path and it will put Hive also right now and then we register the adapter our adapter would be this data model adapter then we open the our I open box and we have the name ibox make sure these are key are the same and then we are ready to go let's restart it again and then when you click again foreign body for that home base and then let's make a function first word items and box first away again open the box I've got the same name type underscore box and let's make it async and then items equals so let's say community empty array and then we press all these items are saved to our database so these items equals box dot values Dot to list viewers dot to paste that means we are we need we reverse this list so that our uh latest up memo get on the top it's reverse reverse our list and then initi state we get the items and then in body and if items items Dot equals 0 that means we have we don't have items and it is let's say [Music] container that now if if it is having data let's say data is present then let's start it again whenever our data length is zero then we have we shall be getting no data whenever we have the data data is present you can see here here the latest last data is shape and we are getting the data is present that means our last last data we entered is now already saved into our database now let's uh so they will need list and for that view Dot Builder item Builder context comma index and then return and if we turn yes [Music] this return card and we need to close this because I can miss in here because right now refactory Target card listed and then English style the title title would be text items of index Dot item name subtitle would be row text same as above items let's copy this Dot [Music] quantity and you skip submit wait five and text dot matrix [Music] Henry restart it again and we can see we have our list items present we got the error here invalid value only value is zero or one okay we haven't given the item count here and then I can restart it again we can see we have our potato two kg sign that means our data is saved now we are going to place the edit and delete icon so that we can edit and delete this list from our browseries menu for that and subtitle right after subtitle triling at the end it means row children icon button whenever that means we started grabbing the icon that is clickable icon and construct and when we press it we shall be editing our our form Nikon button and also on press play with empty if icon start delete and when deleting this icon we are going to delete our item to factor it selected icon button close this is closed icon button this is also closed this close this to factor it and when you reach restart again we shall having edit and delete icon in this card so you can see and it is our text are not throwing for that let's add our Ministry size and excess size dot mean that means our road be taking the less size and we have our pencil icon until it icon yeah and whenever we click this icon we are going to edit our form for that and this unit icon we are going to open the same form this form and the item key here item could be items index Dot e that means whenever if the key is present we are going to edit here and then our index would be indexed and whenever we restart it again when you click the icon button edit icon we are going to have our form open you can see here the values as we can see here we don't have our data loading on the first restart and so you can see here I haven't set of the items so that it could get rendered The View get rendered then when we reload it again we shall have our data present here and we again restart it it will be showing our data on the restart also right now it is showing and now whenever we click the icon it should have the value placed on this uh fields for that we need to go to our so form and then check if item key not equals no that means we have our data and then we set state our controllers we don't need this registered we place our item controller that text would be the way items of index Dot item and then our quantity modular Dot text should be items start 22 Dot the question here it should be any string would be items next are Matrix right now anyway restart it again let's say this and we click and we have the value placed on our items and then we can change also and then we can save and it's Now not working because as you can see here we have checked if item key is no that means we don't have our item and if it is not null that means we have our item so we need to else thank you box dot put our item key our identifier and then our data model data again and then we need save let's restart it and when you click on edit we have our items updated now is click on Save is not updating hi it's because we haven't set the state of our items and then we haven't cleared the uh this model buttons for that we need to Navigator close it and then we get the items again to get refreshed now let's restart it again now when we update as you can see here it was updated but because end uh because we haven't set the state of the items uh it is not showing the data now when we click on edit again and then we again edit it to potato let's make it 20. and then click on Save you can see we have our data updated and now we have to delete this uh item from the list for that we need to unpressed on the click icon we need to delete function for that um our it should be in our card so from here we need to draw the delete function here and for that we need to open the box oh wait that got open [Music] box and on pressure would be I think and then box dot delete items index Dot key that means we are going to delete the key of the uh that item and then we again run the get items so that our list get updated then we restart it again now when you delete we have our data deleted and we have no data and we again enter add the data onion quantity 20 and Matrix kg and then save and then we again add potato one and let's say gram and then save we have our data now let's eat it potato oil and make it liter make it 10 and then we save it again so we have this updated annuity place and click delete it is deleted now as you can see here we have both save button uh on edit also and on creating new let's make it uh updated and Save for that let's go to our bottom set and whenever and for that when key equals no if it is not let's say create new and it is if it is not now then make it save let's restart it again now anyway click on edit button not restarted it let's wait for a mirror now when we click on the plus icon we we can see it is create new and when we click on edit icon we can see save let's make it a bit reload it I can see we can see the update but here we can see we have the data uh already existing whenever you click on click new also this is because we haven't cleared our form after editing our form so let's go to our edit so form and then you did it right here whenever we update our item let's make it instead and I clear it and then you let it again now we can see whenever we edit and update we have this and then we click on uh plus icon we have our empty form right we have a soft learn how to use high bin flutter and I hope you like this video and if you have any queries regarding this tutorial please ping me in comment or you can mail me at flutter Johnson gmail.com and if you want me to recommend some videos you can also bring gmail.com and if you like this video please like comment and share it with your friends and please subscribe the channel to get uh awesome videos in upcoming days thank you

Channel: Flutter Junction

Views: 3,198

Keywords: flutter, flutter tutorial, demo projects, learn flutter, dart, flutter video, flutter projects, projects in flutter, flutter basics, flutter fo beginners, learnflutter, basic in flutter, programming, learn programming, programming for beginners, flutter course, dart course, flutter full course, flutter tutorial for beginners, app developement

Id: 4cvDpm28ts0

Length: 62min 25sec (3745 seconds)

Published: Sat Sep 24 2022