Flutter Local Database Using sqfLite

Video Statistics and Information

Video
Captions Word Cloud
Reddit Comments
Captions
hello guys and welcome to coding orbit in this video i will show you how to implement local database in your flutter application so in this app we can click on this add button and then we can insert a new node for example node for and enter some details here and click save now it will be saved in the local database and it will be shown here and even if you click on the note you will have the ability to update it some details blah blah blah i don't know it okay it will be updated and even if you close the app for example if we now close the app and then enter it we will have the same result since it's uh it's saved in the local database and when the app run we are extracting all the data inside the database and showing get to here now before we get started if you haven't subscribed yet make sure to subscribe and turn on the notification bell so you don't miss our content now let's get started all right to get this started i created a demo project and i i removed all the functionality i just kept the ui for example the plus button would still work we can enter a title here and we can enter some details here however once saved it would do nothing it will just pop up so now to get this started the first thing you have to do you have to add sqflight in your perspective tml and make sure to to have it as the latest dependency out there now after that what we will do we will add a model inside the models directory we have four directories right now we have screens we have services we have widgets and we have model now for services and widgets they are empty however screen we have the two screen that you saw in the emulator from a while now what we will do will create a new file and we will call it not model and then for the model we only need first let's create a class let's call it node and for the node we only just need end or let's make it final final end id with final string title and final string description and that's it we can have it const node and then we can have it all of them are required this description title required this dot description however the id is not required so i will just make it nullable and have semicolon here now since it's a small model i'm not gonna use external libraries to generate from json or 2js and i will create them myself so let's create the from json let's say factory node dot from json which will take map string dynamic and we will call it json and this would return a node so we will type node now for the id we will have it as json and id for the title the same and for the description it's also the same and that from json now to json we can also create it ourselves we can say map string dynamic and we can call it to json it wouldn't take anything because we already have whatever we want now in here what we will return we will return first id and we would say id and then we would say title and it would have the title and then we would have we'll say description and it will take the description and that's it that's it for this note model all right now after we created the model it's time to create the database helper now let's go to the services and inside here let's have a new dart file and let's call it database underscore helper and here we will create a class and we will call it database helper and after that we can say static const and and we have to specify the version of the database and let's say it's one and let's specify a name as well for the database so let's say db name and here since it's string let's say not dot db or not okay now after that the first method we have to create we have to create a method that creates the database and in case of calling that method it returns this database for us so we'll stay static future sorry future and that will return a database actually and as you see we imported this package sql flight here and let's call it get db it doesn't take anything and it's async however what it will return it will return an open database open database and we have to specify the path now to get the path we have to say join and inside here we have to say await get database path and then we have to specify the database name we're not done yet we have to import the join however it doesn't appear so let's import it ourselves let's say import path and here it is slash path dot dot and we're also not done we have to have some methods inside here here we can have the only create and open all of these method methods but right now i will just have only create and only create a builder that has a db and the version so here what we can say let's just remove this okay here what we can have we can have uh first let's make this async and let's say await db.query or db.execute and we have to execute executable sql so i will just paste it it's just sql create table note id integer primary key title text not null description text not null we could have had the title varchar and specified a number for it but i just left it as text now that's it for this method so even if we created the database for the first time on the only create would not work another time it will just return the open database so now let's implement the other methods however let me just have comma here and no not here um okay it has to be here yeah and let's specify the version with the version we have so whenever you update your database you can change the version and it will understand that it is an updated version of the database okay now let's uh create the other other methods inside this class the first one we created is add a node so static future and add node will return integer so let's say add node which will take a node and let's say node and this is also async so inside here let me just import the node yeah so first thing let's say final db is equal to await get db and then we'll say return await db dot insert insert what is the table that we want to insert to the table is not so we'll just copy paste it and then we have the values what values you want to insert we want to insert the node but not just the node not to json so yeah so that's why we created the 2json method and that's why we created the from json since we will use it in the database okay and we can have an extra parameter here in case the the string or or the details or the text had escaping characters or had any other characters we can have we can add conflicting algorithms and we can say conflicting algorithms dot replace and that would be good a good option for that now let's continue let's create another method let's say static future and this would actually also return an end because it's update note and it will also take note note and it's also async and yeah so first thing as always we will have the final db equal await get db and then we will also return db or await sorry db.update update which table we want the update we want to update the node the values that we want to send it's the dot to json and here we can have where so the where it's actually a string so we could say id equal to question mark we wouldn't say node.id inside of here on the on the other hand we will have where args and this is a list in case the where has many options so we would just say not dot id and that's it we can also have conflict conflicting algorithms and say conflicting algorithms that replace here is it and that's it let me just format the file a little bit yeah and that's it that's it for the update and we have only two more methods to cover which are the delete one the delete one is basically uh it looks like the update so i will just copy paste it let's say delete node over here we'll just say delete and without this one without this one and that's it for the delete we will delete the node where id equal node.id and finally we have a special method which will return all the nodes that we have created so far so we will have static future and this would return a list of note and it might be nullable so let's have a question mark here and let's say get all node since the first time we open the app it should be nullabel so that's why we had it as nullable okay so first of all let's say final db is equal a weight get db and then here would not return immediately would say final list of map and this map is string dynamic as any other map and let's call it maps is equal to a db or await db dot query and we'll just say not the table so give me whatever you have in this note table and then we will just check if maps dot is not empty or let's see your check is empty and let's say return and below it if this code doesn't exist if we didn't return empty that mean we have maps so we have result in the node table so simply we would just say return list dot generate and the length we want to is maps that length and for each index we would return node dot from json maps for this index and that's it so that's it for this file the database helper and i hope it's clear to you now let's move on to the ui first let's create a note widget and i'm not gonna go over the ui so i've already created uh this file so i will just paste it here and let's go to the next screen i will edit this one so inside here let's say final note note however this might be nullable and it might be another way because if we want to add one we will show this screen and if we want to update one we will also show this screen so let's have it as that now inside here let's here check if not is not empty and it's not null let's say title controller the text is equal to the note the text the title sorry yeah and let's say description controller the text is equal to node description and let's have a question mark here or let's have first i'm wrapping here because we know it's not null now okay now the text is add a note and we want to show a different text if it's if the note is not null or otherwise we will keep it as as node so first of all let's just remove the const and then here we'll just say not equal equal none so keep it as sorry keep it as add the note otherwise if it's not let's have it not okay um what are you thinking about will remain the same title will remain the same node will remain the same um let's go to the save i think here yep okay so we'll just check the same if not is equal equal to null yeah so keep it to save otherwise let's have it here edit or modify and just remove the cons so okay and let's have the constitute now whenever we click in the save or the edit button first we are extracting the title then we are extracting the description and if the title or the description is empty one of them is empty we are returning so no code will be executed after that now here we have to save or update the model now first of all since we have uh the title and the new description even if it's insert or update let's create a new model for the node and let's say final note and let's call it model is equal to node and for the title we already have it for the description okay for the description we also have it and now for the id so if it's modify if it's edit we have to know that i the id so we will just say note that id and we don't know for sure if we have it so it might be null and that's why i kept the id as nullable now we will check on the node if not equal equal null which means we have to insert this node so we would say await because i've already had an async here await database helper dot add note and the model we've created otherwise else if it's not null we will just say await database helper dot update node and we will send the model as well we will not send the note we have before because we change the title and we change the description and the id remains the same and that's it for this screen all right now moving on to the notes screen where the body says nothing to show now let's remove that and i will actually paste it then i will explain it let me just add all of these imports and the note widget okay get all node uh okay it should be with ns yep and not with it okay uh no errors now all right now the first thing i created i had a future builder instead of a text and this future builder might have a list of nodes or they might be nullable so in the future we called the database helper don't get all nodes the method we created and then we checked on the connection state if it's waiting we showed a circular progress indicator if it has an error we showed the center with the text with the error and if it has data and it might has have data but this data might be empty because it's a list so i checked after if it has data if a snap should do that the different from null because it might be null or it might be an empty list okay so we are returning a list of u.s builder and for each builder we are returning the node widget and this node takes a node one out of the list so snapshot the data for this index now on the async on the on tab whenever we click on this node we will have navigation.push we will push to the new screen and we will send the node so that's how we update it and on long press we can delete it so whenever we long press this node we will have another dialog saying are you sure you want to delete this node i didn't show you in the in the preview of the app before but we will test it now so we will just on the s we will delete it we have delete node we send the node and we said navigation.pop then set the state to remove it otherwise we will just say navigation.pop so now let's run the app and see how it looks all right i've got the same data i showed you before and that's why i'm running it on the same mobile phone and we didn't erase the database or anything so let's let me show you the delete when we longer press any node it will appear are you sure you want to delete this node whenever we say yes it will remove it so let's delete this as well and let's try to create a new node let's say node and here details save and it does appear and it does work let's update this node let's say next time don't forget showing all features in the preview all right unless i did it and it works successfully so that was all thank you guys for watching don't forget to subscribe comment like the video and i kinda noticed that i had a small mistake here it should be an e so let's update it okay so i will see you in the next video
Info
Channel: Coding Orbit
Views: 29,599
Rating: undefined out of 5
Keywords: flutter, flutter tutorial, flutter local database, flutter local storage, flutter sqlite, flutter sqflite, flutter database, flutter crud, flutter local database operations, flutter database operations, flutter crud operations, flutter sqflite crud, flutter sqflite tutorial, flutter sqflite database, flutter database tutorial, flutter sqflite example, flutter sqlite example, flutter sqlite tutorial, flutter sqlite database
Id: q8UXj-44dk8
Channel Id: undefined
Length: 20min 51sec (1251 seconds)
Published: Tue Apr 26 2022
Related Videos
Note
Please note that this website is currently a work in progress! Lots of interesting data and statistics to come.