SQLITE Ultimate Guide for Flutter Developers

[Music] welcome back to summit coder and we are back in our video in this video we will learn how to do the crud operation with flutter and sqlite in this video we will do add edit delete and list data from flutter to our sqlite database so this is our application you can see here we are getting a list here and for this list we are using our snippet coder util package and then we have that edit button then we have our delete button also if we click on the delete you can see here we are getting the confirmation message we want to delete if we do the yes it will delete the record if we do no it will not delete any record also we have that added button here if we click here in the edit button you can see here we are getting that populated data here we are getting product name then we are getting product price then we are getting here product categories then we are getting a product description then we are getting here image here we can change the image with the camera or with our gallery here we have save and cancel button if we click on the cancel it will redirect to our home page and here we have our add product and from here we can add the data if we don't add any data if we click on the save we are getting here validation also so in this video we are also going to learn the form data understanding and all how that form is working with that text field with our number field and we have our drop down here and then we have our multi-line text box also and then we have our images here and all this control we are using our snippet coder utils package so before starting a video if you are new to our channel subscribe the channel by click on the subscribe button and click the bell icon to get notified about our latest videos thank you [Music] so we required three packages in our application so first one is sql flight and the version we are using it 2.0.2 and it is having a support for ios android and mac os and its provider support for transaction and batches also provided automatic version management during the open and helper for insert query update and delete queries db operations executed in a background thread in on ios and android here so it's not providing any web support as of now and the documentation very straightforward we have to just copy this package in our puff spec and the second one we are using here is image picker and this pack is used for taking the images from the device from the gallery or from the camera let's provide that to support for both android and ios and the documentation also very straightforward and the third package we are using here is snippet coder utils and this one we are using for our our form and for our drop down text box and button so now let's move to our flutter application [Music] first of all we have to copy that packages and we have to put here so now that packages has been added in our application so now we will move further and we will create our model file we have to create a folder here models and here we have to create that model file first one is a model dot dot file this one will be creating as a abstract class and this one we will use as a base class for the other model files we will create an abstract class model and we have only one variable in this class and type of and we'll make it as a null level id then we will create two function here first one is static from map and then second one is our to json so this model file basically used for our utility in our db helper and because in the db helper we have to define any model file for this id and this function that's why we are creating the base file so that if we have a multiple modified number application we don't have to do any modification in our db utility file we will just link this one and rest of that model file we will extend with this base file now we'll create one more model file that is products underscore model dot dot file here we will get the class product model and we will extend it with our model file and here that import for that file has been added here we will create one variable static string table is equal to products this is that table name in our sqlite file then we'll get some variables first one is a in type of id then we have n type of category id then we have string type of product name then we have string type of product description and we will make it as a null label here then we have double type of price then we have a string type of nullable product pick then we have to create a constructor here product model here we have to add the fields id then we have required field that is this dot product name and this one also we will pick from this one this value because we are putting here required because we have not make it as a nullable that's why we have to make it as a required whenever we have to create any class for this product model we have to provide the value for this product name as it will throw over compile time error then in the category also we have to remove it as in nullable and we will put here required this dot category id then we have this dot product description this dot price then we have this dot product pick so accept product name and category id rest of all the fields are nullable because in the case of adding the data we don't have any id so that's why we are making it as a nullable and but that product name and id category id is required and we are making it as required here product description price and product pick we are putting as a optional here and here we have to create the function here that is from map we will put a static product model from map we are putting here variable map type of string dynamic json and from here we will return product model and here we have to add all the fields mapping and all first one is id we will map it with our map with our json id then we have product name we will pick it from our json product name same we have to do for the other variables also we will just copy paste we will change here to category id we will change it to category id here in the product name we have to do that tool string then here we have our product description we will change it to product description and here also we will do tostring then we have our price here then we have our last field that is product pick so now our from map function is also ready so now we will get the last function that is to json that we are going to do the overwrite from our base file we have map string dynamic to json here we will get one variable map type of string dynamic map is equal to we will get the json here first one is id we will map it with our id then we have our product name we will map it with our product name same we have to do for the other fields also next one is a category id then we have product description then we have our price we will change our price then we have pick product pick we will change it to product pick here from here we will return map and before that we will check here if id is not equal to null then we will assign this id here map id is equal to id so our mod file is ready so what we are doing here we have created one class that is product model and we will extend it with our base file that is model file this one then we have created one variable for table name then we have our variables here id category id product name product description price product price then we have our constructor here with the id product name category id brick description price product pick and here we are putting required to our product name and category because we are not making it as a nullable here then we are creating one function for from map and here we are just creating that product model file with our variable assignment and all and then we are just overriding our two json function because we have already that function here and here we have our created one variable for map with our mapping all that values with our these map values and here we are checking if the id is not equal to null that means we are getting the id here in the case of edit and then we are assigning that id with this id and we are returning a map so now let's proceed further and then we will create our utility file for the dbhelper and all [Music] so now we will create one folder name that is utils folder inside that we will get new file that is db underscore helper dot dot file and we will create here abstract class abstract class db helper and here we will create one object for our database static database and we'll make it as a nullable here underscore db here we'll add that variable for our database version underscore version 1 then we'll create one function that is static future void initialize and return type will be void and we will make it as a async here from here we will check if underscore db is not equal to null then we will return here else we will get the database here we will do inside our try catch here we will get the path here where database path is equal to await get database path here we'll create one variable underscore path is equal to p dot join and p we have to create one variable for path we will import here package path as p p dot join and we will add here database path and we have to add the file name here database file we are putting a flutter underscore sql flight dot db and then we will open the database here underscore db is equal to await open database and we have to provide a path here then we have to provide a version here then we have to provide our oncat functions oncreate and we have to create one function that is once function then we have on upgrade and this one also we have to create and the caching we have to put here exception and we can print the exception here here we have to create two function that is once and on upgrade static void oncreate and we have to pass here some parameters in database db in type of version we will make it as async here from here we will execute our database query and this query will be executed only when we first run the application if that database is not exist then in that case this query will be executed and it will generate a table in our database away here we have to provide a query here and we can also create the one variable for the query string query sql query is equal to and we can add the query here which we have to execute create table products we have to provide the variables that columns here we can provide our first column will be id and the type will be integer and we are making as a primary key and we will make it as a auto increment then we have product name we have make it as a string here then we have category id we will make it as a integer here and then we have our product description we'll make it as a string here then we have the price here we will put here real then we have the product pick we will make it as a string here so this is a table which we are going to create that is create table products id integer and we are making as a primary key auto increment then we have our product name we are making it as a string then we have the category id we are putting it as a integer then we have the product description as a string then we have the price as a real data data type then we have the product pick as a string here then we will pass this query here then we can also create one more function that is on upgrade we will just copy this and we will paste here we will change the name to on upgrade here we have three variables first one is a database second one is a n type of old version then we have a n type of version so here we can check if old version is more than version then we can execute any query here but as of now we are not required anything this is required only if we we have our application in the production and the version we are putting it as one version and in case we are upgrading our application and adding some new tables in our database then we have to change the version here to 2 and then on the basis of that it will check if that old version matching with the new version or not if it is not matching then it will execute all the command which we will provide here then we have to create one more function static future type of list map string dynamic query and we have to provide a table name here table and we will make it as async here from here we will return underscore db we will put your exclamator sign dot query and we have to provide a table name here so this function will be used for getting the data from our sqlite database and return tab will be in the list format with that map string dynamic and it will return us the data on the basis of our table name it will give us all the data in that particular table then we will create one more function static future and insert and this will be used for adding the data in our database and we have two variables here string type of table name then we have a model here and this model is the abstract class which we have created here so here if suppose if we are right now we are getting only one model that is product model in case we have multiple model like category also in that case we don't need to do any changes in our db helper we have to just provide the class name from our service file and we have already extended our modafile with this model file and we have to import this file from here we will return await underscore db and we will make it as async here dot insert we have to provide a table name then we have to provide here model dot to json same we have to do here copy here and we will name it as a update here also we have table name then model file and here we will change it to update and we will put here where condition so that update will be on the base of that particular id and id will be this id here we will put the condition where and we have to create the parameters here id is equal to question mark and we have to pass the arguments here the arguments will be model dot id now we have to copy this again and we have to paste here and here we will change it to delete and here we have to change it to delete and here we have to remove this model we have to just put the where condition and on the base of that particular id it will delete the data from our database so now our helper file is ready and this helper file we have created few functions first one is a initialize and this will be for checking if we having the database or not if we are not having any database in our system then it will just create a database then we have our next function that is oncreate and it will be used for getting that table then we have on update and will be used for upgrading our database then we have our function for query and it it will fetch all the data from our database on the base of that table name then we have our insert statement for adding the data in our database then we have our update method and this will be used for updating the database in our database on the basis of that particular id which we will provide then we have a delete function and this will also delete a data on the base of that id which we will provide here so now let's move further and now we will create one service file and for that we have to create one folder that is services inside that we have to create one file that is db underscore service dot dot file and here we will get one class db service inside this class we have to create four functions first one is our getting that data from our database and we will put here future return type will be list product model get products and we will make it as a async here we will just call here await dbhelper dot initialize it will check if the database is open or not if not it will just open the database here we have to create one variable list map string string dynamic products is equal to await dbhelper dot query and here we have to pass that table name for that we have to call here product model dot table dot and here it will get all that products and from here we will return podex dot map here we will change it to item here we have product model dot from map and we have to pass this item here and here we will put it to list what it will do it will just do the mapping here it will return us the data in the format of that product model listing and all so our next function is for adding the data here we will add future return type will be boolean add product here we will pass the model file product model model here we have to again call our await tv helper and before that we have to make it as a async here and here we have dbhelper dot initialize then here we have to put one we have to create one variable boolean type of is saved is equal to false then we have to create one variable in type of return is equal to await dbhelper dot insert and we have to pass our table name that is product model dot table and here we have the model file and from here we will check if return is equal to 1 that means data successfully added and we can return here true else we will return here false and we don't require this variable and again we have to copy this function we will paste here so what we are doing here we have added one function add product and we are just passing our product model as a parameter there we will make it as async here and we are just calling here await navy helper dot initialize then we have created one variable as the end type of return is equal to db helper dot insert then we are just passing a table name and the model file and here we are checking if return is we will put a return is more than one then we will put it true else we will put here false we can also put your return is more than zero then we will put a true as we will put here false same we will do here also and we will change it to update and this one also will change it to update product and rest of the things are same same we have to do for the delete also we will change it to delete and name we will change it to delete product so our db service file is ready so now let's move further and we will get the ui and then we will integrate our db service with our ui [Music] so now we will design our ui and for that we have to create one folder here pages pages and inside that we have to add one file here and the name of the file is add underscore edit underscore product dot dot file and we will make it as a stateful visit at edit product page and we will link this page with our home page and here in our main.file we will change it to this page and we we will do the design side by side so now we will run the application to see so here we are getting that page is working as a blank because we have not added any data so now here we will add the scaffold visit inside that we will add the upper app bar we will add the background color dot that isn't now you can see we are getting the navigation bar and all then we will put our back button also that will be use usable when we have that homepage also we'll put it true then we have to put a title here and for putting the title we have to also add some variables also here in the constructor we will add final product model we'll make it as a null level model final moon is edit mode and here in the constructor we will add this dot model this dot is edit mode is equal to false and here we will check text visit visit dot is edit mode then we will show here edit product else we will show here add product so right now we are getting add product because by default we will make it as a false here and here we have to put a body and for the body we will get the ui here we'll put here form and the key we have to create one key here global key form state global key is equal to global key form state we will pass this global key here then we have the child here and we will create one visit here form ui and we have to create this visit here from here we will return single child scroll view because we are having the form here and the form length might be increased as per that device height so for that purpose we should have that proper scroll bar and all from here we are using the child here there we are using column visit inside that we are having the children's here and for that we are using your form helper dot input with label and the key name we are passing here product name the label we will pass here product name and text we are not passing anything then we have our own validate event that we can do later on also then we have our onsave function that also will do later on you can see here we are getting the product name here now we have to show the icon also we will put your show prefix icon true then we will show the prefix icon we are using here constant icon icons dot text field you can see here we are getting it now we have to change the border radius we will put here 10 then we have a content padding we will put here 15 then we have the font size we are using here 14 then we have the level font size we are using our 14. now you can see here then we have the padding left we are putting a 0 padding right zero then we have a prefix icon padding left we are putting at 10. so now our ui is cutting properly here but we have to give some padding also for the whole form for that we have to wrap this column wizard with our padding now you can see here we are getting padding here we will change it to 10 so now it's looking very nice and here in the only way on validate we have to check here if on validate dot is empty we will return here star required else we will return here then we have our own save event before that we have to add our object for our product model for that we have to add here overwrite void in state super dot end state then we have model is equal to protect model project name we will put here empty then we have the category id we'll put here minus one and here we will create let late product model model so now we will just copy this model and here in the onsite we will put here model dot product name is equal to unsafe dot tostring dot trim also we will put here initial value and we will pick it from model dot product name now we will reload the application now you can see here we are not getting any error so what it will do as we have added here initial value also if we put any protect name value here it will just load that value here in the form that will be used in our edit product case whenever we come from our list of that products and from there we will click on the edit button and it will show the populated data in this form so now we will add the other fields also and for that we have to put here some spacing here we put your size box and the height 10 then we have to create here a row visit because we have to show two fields in the one row here we have the children's here and we are using a flexible visit here and the flex we are using here one then we have the child here we have to just copy this form and we have to paste here you can see here we are getting it now we will rename that form we will change it to product price here also we will change it to product price and this value we will change it to price we'll map it with our double dot parse and the icon we will change it to currency rupee and we just need to show here that keyboard for our numeric value for that we have to add one value here you can see we are getting the keyboard here also we are getting the full keyboard but now in the price we have to show that number keyboard and for that we have to put here is numeric true so here you can see we are getting here number pad here instead of that proper keyboard here we are getting the keyboard normal keyboard so now we have to add that drop down for the category and those category we are doing with the hard code and for that we have to add some data here we will create one variable here list type of dynamic categories is equal to empty array and here we will add data for this categories dot at value 1 and the label will be t-shirts this one we will put as a object here and we will change it to category 2 shirts we will copy again and we'll paste here third category will be our jeans and our fourth category is our trousers so now we will go to our this row visit inside that we have to add one more child and we are using a flexible visit and we will put a child the child we are using a form helper dot drop down with label and the label name we are putting here product category and text we are using here dash dash select again dash dash and the value we are mapping with our model dot category id then we have our list data and we will map with our categories then we have our own change event then we have our own validate event and the flex we are putting here one and we have to cut it and we have to paste here so now you can see here we are getting the drop down but the look and feel is not good we have to add some parameters here on border radius we are putting here label font size we are putting here 14 then we have our padding left zero then we have our padding right zero then we have our hint font size we are putting here 14 then we have the prefix icon that also we can add in our drop down so in the new version of our snippet kodi utils you can have that proper look and feel for our dropdown also with that prefix icon and the suffix icon both we can do icons and here we have icon start category icon you can use any other icon which you want to use then we have to add one variable for our show prefix icon true then for the padding we have to put here prefix icon padding left done so now you can see here we are getting the proper icon with our data also and if we reload the application to see we are getting some error so let's see what the issues so here we have to put that name for that variable also id and this one as a name so if i comment this and if i reload the application you can see here it is working now same we have to do for the others also and this one is shirts jeans and trousers one two three four so now you can see here we are getting all the four categories here so we will go again to our ui and from there we will add new field here for that we have to just copy this field and we have to paste here outside of a row visit so now you can see here it is getting come and here we have to add the spacing and all we are using a size box height 10 and we will change it to product description product description same we have to do here also and we will put it to string and here we are putting it as a non-nullable field and for that we have to put here double question mark and we will put it empty in case we are not getting any data it will show the empty here and we don't require any prefix icon here we will remove it so now we have to make it as a multi-line control we have to put here multiline rows and is multi-line true and the multi-line rows we can put how many rows we want to show we will put their five it will increase to the five if we put it 10 it will increase the height here so we just required five here and if you put here enter any data if you click here enter you can see here we are getting to the new line here so this one is also the new update to our stem recorder utils and there you are getting the proper multi-line control also now then again we have to add over this size box and we will put a constant so now we have to add our pick picker here and for that we have to add new visits we will add here pic picker we have to add two variables first one is a string type of file name then we have a function on file pick then we have to add one variable future type of x file we have to import here image speaker underscore image file then we have our image speaker underscore picker is equal to image picker and from here we will return column visit here we have the children's here then here we will check if file name is not equal to empty then we will show here image dot file and the file we will pick from our file name and we will put here width also width 300 height 300 and we have to import here dot dot io so in the else condition if there is no file selected we can just show the the image here from our network and it will show the dummy image from this path then we have to add here row visit main x alignment we are putting a main access alignment dot center then we have the children's here and we are using a size box the height 35 and the width 35 then we have the child here we will put here icon button the padding we are using here as instead dot all 0 we will put a constant then we have the icon here and this file picker is we are putting for the image picking from our gallery or from our camera the icon we are putting here icon icons dot image icon and the size we are using here 35 then we have our own press event and here we will put underscore image file is equal to underscore picker dot pick image and the source we will put here image source dot in gallery then here we have ms file dot then and we will change it to file and we will return from on file pic and we will pass here file so whenever we select any file here we will on that on press event we will just pass that value in our this function as a callback now same we have to do for our second one also for our camera here we will change the source to camera and here the icon will change it to camera icon so now we will just call this function from here the file name we are putting here model dot put a pic then we have our function here set state we will just change the path here in our model dot product pick is equal to file dot path so here you can see we are getting the dummy image then we are getting it two icons here so now we have to add that two buttons also for that we have to go to a scaffold widget and here we will add bottom navigation bar we will add here size box the height we will put here 110 then we have the child's here in the child we have to put the row visit and we will put here main x alignment dot space mle then we have the cross x alignment we will put a cross x alignment dot center inside the children we are using a form helper dot submit button and the first one is the save then we have the on type event that we will cover later on you can see here we are getting one button then again we have to copy this and we will paste here for the second button cancel so now we will put the styling here and we will put a border radius then then we have the beaten color color start green color then we have the border color we are putting a color start green color same we have to do for the cancer button also we will just copy this and we will paste here the color will change it to gray color same for the border also so now our ui is ready so now let's move further and here we will add some functions here here we will add one function that is boolean type of validate and save final form is equal to global key dot current state and we will check here if form dot validate then we will call here form dot save and we will return it true else we will return here false so what it will do it will check the current state of the form and it will check if it is a valid form or not if it is a valid form then it will save and it will return true as it will return false here and we have to call this function from over this button that is save button we will put here validate and save and from here we can also print the model model dot to json we will save and we will reload the application so now if i click on the save button you can see here we are getting all the validations here so now if i enter any data here and if i go to the console if i again click on the save you can see here we're getting our json here and that category is not getting assigned we have to check what the issue is so in the category we forgot to add our own change event and also on validated event in the on change event we can assign the value model dot category id is equal to n dot parse because the value is coming in the input format and here we will put on change we will save here and we will reload the application so now if i put the data here if i change the category now if i click on the save you can see here we're getting a category id3 if i change the category from here you can see we are now getting change that category id to four so that means our form is working fine so now we will call our db service also from here and here we have to add our late db service db service and we have to initialize this class from here dbservice is equal to db service and for the model we will check here if visit dot model if visit dot is edit mode then we will assign this model with our this dot visit dot model that means that model is already we are getting from our parameter and we will go to our on click event here we will check if visit dot is edit mode else we have to call the add mode and from here we will call db service dot update product and we'll pass the model here then here we will call our form helper dot show simple dialect the title will put here sql flight message we will put here data modified successfully and the button text will be okay then we have the on press event on the on press event we will just redirect the user to our home screen and that will cover later on before that we have to put here navigator dot pop it will remove that pop-up and here in the else condition we will just copy this and we will paste here we change it to add product this one we will change to data edit successfully we will reload the application and before that we are using the ios and we have to put some permission for the image uploading and all in a selection for the gallery and camera we have to go to our is folder inside that we have our runner folder then we have our info.plist and here we have to add some entries and here we have to add these entries first one is ns camera uses description then we required ns photo library uses description so here we will reload the application so now if i click on that image speaker so our application getting crashed so now let's reload the application to see now if i again click on that icon you can see here it is asking for the permission so i will click on that allow access to all photos you can see here we're getting that gallery here same for the camera also and if i click on the okay but camera is not available might be that camera will not work in this simulator so we can test it with our image gallery so now let's add some data to see is it working or not we will put here test product the price we will put here 100 we can select the category also and we will put here test description and for the image we will select an image here so now if i click on the save you can see here we are getting data added successfully that means data has been added but now we have to create our new page that is listing page so that we can retrieve all the data which we have added so now we will go to our pages and from here we will add home underscore page dot dot file we will make it as a stateful visit home page so now we will assign this home page in our main dot file home page you can see here we are getting that blank page and now we have to add our data here in our home page and we will put a scaffold visit we will put tab bar here app bar the background we are using here color start ready ascent then we have the title here we will put it text visit flutter sql flight correct you can see here we are getting our app bar also so here we have to add one visit here underscore build data table we will pass the parameter as a list type of product model model we have to import this file here and from here we will return less utils dot build data table and from here we will add the columns here columns will be that description of that column product name they have then we have price here and then we have that empty column for our action buttons here we will put the fields name which are mapped to our data table with our model file product name price then we have empty and the sort ascending we will put here false we are not doing any sorting and all as of now and the index we will put here zero then we have to assign the data here we will map with over this model then we have our on edit event we will put here protect model data same we have to do here also then we have to put the heading row color we are putting a color start orange ascent then we have to put here is scrollable true then we have the column text font size we will put here 15 and for the column text board we will make it as a false here then we have the column spacing we will put here 50. then we have to create one more visit here for fetching the data underscore fetch data we will use a future builder and return type will be list product model and here we have the future db service and here we have to create object for the db service also db service is equal to db service dot get products then we have the builder here build context async snapshot list product model products from here we will check if products dot has data then from here we will return our this visit and we will pass here products dot data else we will return here progress bar indicator circular progress indicator we will wrap it with our center visit and we'll put a constant so now we can call this function from our body now let's reload the application to see before that we are getting one error here and we forgot one thing here we have to put the onsort also the onsort function is mandatory to put here and but we are not implementing here we are just putting here that definition for that column index then we have the column name then we have the ascending order so now let's reload the application so now you can see here we are getting the table here with our the product which we have added but the look and feel is not good so let's modify the look and feel here we will wrap it with our padding now you can see here we are getting the proper look and feel and before that we have to add one more visit here and we will wrap it with our column wizard and here we have to add one more button for the add product and we can use here form helper dot submit button add product then we have the on tap even here you can see button is coming put that design for this button also border radius we are putting it 10 bit in color we can change it to colors dot light blue or something else we can do also and for the border color also we can put here color start light blue and we can also do that alignment for this button also we can use here align visit and the alignment we will do here alignment dot right align center right now you can see here and we can also put the padding here in that also by 10 and we can remove this padding from here now you can see here and we are getting some design issue here also we can put size box height 10. now you can see here and here in the ontap event we can just redirect user to our edit screen navigator dot push and here we have to put material route material page dot then we have the builder here context constant added page now reload the application so if i click on that add product you can see here we are landing to our add product screen if i go back we are here in the list page and same we have to do for the edit also and we have to just copy that code and we have to paste here and here we have to pass two parameters first one is is that it mode true and the second one is the model and we have to pass this model here so now if i reload the application now if i click on that edit button you can see here we are getting the loaded data from our edit screen if i click on that button you can see here we are getting the empty data here now if i click again on the edit and if i change anything here but some mapping is in the wrong way and here in the product price we are getting the wrong value so now let's fix that in our edit screen and here in our yeah this is that we have to change it to price and here we will check if model price is not equal to null then we will show here model price not to string else we will show here empty so now reload the application and if i again click on the edit button you can see here we are getting the price and the product name everything is coming so now if i change it to test product 1 and price i will change it to 150 so now if i again click on the save you can see here data modifies successfully if i go back and if i reload from here you can see here data has been modified we are getting a test product one and the price we are getting here 150 so our added screen is also working fine with now we will add the last step here that is delete product and all here we we are in our home page and from here in the delete section we have to add here return alert dialect from here we will add the title here constant text sequel afflict great content we will pass here const we will pass here con constant text do you want to delete this record then we have the actions button and we are putting it row visit main access alignment we are using a main exercise dot center crosshairs alignment we are using a center then we have to add the children's here from here we will add form helper dot submit button the text will be yes then we have the on type even that we will cover later on then we'll copy again and we will put here before that we have to put the size box for the spacing with five so now if i click on the delete before that i have to reload the application so now if i click here we are not getting anything so before that we have to put show dialect and here in the context and here we have the builder inside the builder we have to put here build context from here we will return alectile app so now if i reload the application to see is it working or not now you can see here we are getting two buttons with the message also do you want to delete it so now let's fix that design issue here and here we will put the width 100 border radius 5 then we have the beaten color color start green color same for the border color colors dot green color and here we will copy width and border radius for our second button also and we will change it to no so now let's reload the application here you can see the ui is coming very nice and here in the know we will just put here navigator dot pop navigator dot off context dot pop it will just remove that low pop up here now if i click on the no it will remove the pop-up so now we will do that indication for the delete and from here we will call db service dot delt product and we will pass a model and the model will be this data then from here we'll just remove the popup once the data is getting deleted set state and we will call here navigator dot of context dot pop so now reload the application so now if i click on the delete if i click on the yes you can see here that data has been deleted so now if i reload the application to see so we are not getting any data that means delta is working fine here so that's all in this video i hope you like the video don't forget to subscribe to channel like comment share i will come back soon with another awesome video thank you for watching the video [Music] you

Channel: Snippet Coder

Views: 8,401

Keywords: google flutter, sqflite flutter, flutter sqflite, sqflite guide for flutter, SQFlite Database in flutter, flutter 101, flutter tutorial for beginners, sqflite, flutter sql, flutter sqflite tutorial, flutter database, flutter sqlite tutorial, flutter app, sqlite, flutter sqflite crud, flutter sqflite example, flutter sqflite database, flutter database sqlite, flutter dart, flutter local database, flutter cross platform, flutter tutorials, flutter database tutorial

Id: 0qx70QE-yKo

Length: 49min 51sec (2991 seconds)

Published: Wed Mar 02 2022