{"id":5560,"date":"2025-01-01T04:09:20","date_gmt":"2025-01-01T04:09:20","guid":{"rendered":"https:\/\/obsidiansofteducation.com\/?page_id=5560"},"modified":"2025-05-12T05:07:27","modified_gmt":"2025-05-12T05:07:27","slug":"customer-record-app-in-mit-app-inventor-database-records-part-2","status":"publish","type":"page","link":"https:\/\/obsidiansofteducation.com\/index.php\/customer-record-app-in-mit-app-inventor-database-records-part-2\/","title":{"rendered":"Customer Record App in MIT App Inventor – Database Records Part 2"},"content":{"rendered":"\n

Hello friends and welcome to Obsidian Soft,<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

<\/a><\/p>\n\n\n\n

This is part 2 of the Client\/Customer Record App tutorial.<\/p>\n\n\n\n

Part 1 written tutorial here<\/a><\/strong><\/p>\n\n\n\n

Go to Designer View and duplicate the mainScreenLayout. (Select it first and press Ctrl + C and Ctrl + V for Windows or Command + C and Command + V for MacOS) Rename it to UpdateScreenLayout and delete the list view and the horizontal layout with reload and delete all buttons from it. Rename addBtn2 to saveBtn and change the text to Save. Rename findBtn2 to deleteBtn and change the text to Delete.<\/p>\n\n\n\n

Now, make this UpdateScreenLayout invisible by unchecking visible. <\/p>\n\n\n\n

Go to the block section.<\/p>\n\n\n\n

Add another global variable for the selectedRecordIndex when the user touches an item on the listview.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

We are using the concept of virtual screens here i.e. two full-screen layouts out of which only one is visible at one time. When the screen is initialized, we want to make sure that only our mainscreenlayout is showing. So, add the following code to screen1.initialize event.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Next, we will show the updateScreenlayout when the user taps on a record on the listview with the filled-in values of the record on which the user has tapped. <\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

Now, the user can either make some changes and press save or he can delete the entire record.<\/p>\n\n\n\n

If he presses save, the code is similar to addBtn code. We make a dictionary and set it to global record but this time, we replace it in the list for the chosen index. In the end, we also set selectedindex back to 0. Why? You will know the reason soon.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Now, empty the delete button code as it was duplicated from findBtn and put code in it for removing the item from the list for the selectedRecordIndex and storing the list in tinyDB, and updating listview by calling custom procedure and making our update screen invisible. In the end, again make selectedRecordIndex 0.<\/p>\n\n\n\n

\"\"<\/figure>\n\n\n\n

Now what happens when the user presses the find button? We will assume that he has provided a name before pressing find. Again, you need to add error checks when you are making a  professional app.<\/p>\n\n\n\n

We will make a local variable list just like we made in updatelistview procedure but this time we will search in our list of records for the name provided by the user using a for loop where we can know the number i.e. index at which the record is found. We need this while updating the main Record list if the user decides to edit or delete this record by tapping on it. <\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

In the end, update listview with this local variable foundList.<\/p>\n\n\n\n

Now, we need to make a slight change in our listview\u2019s after-picking event if the picking event happens after the user has looked for a particular customer by pressing the find button then we need to use that index of the found item otherwise just the listview\u2019s selection index.\u00a0 This is why we were making the selectedRecordIndex back to\u00a0 0 at the end of save and delete to differentiate between update after finding the record and update after selecting a record from the entire list.<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

At any time, we want to again look at our entire customer records list, we can press reload button which will just call updateListView procedure.<\/p>\n\n\n\n

\"\"\/<\/figure>\n\n\n\n

You can also download aia file for this project.<\/p>\n\n\n\n

Customer Record App Part 2<\/a><\/strong><\/p>\n\n\n\n

If you like my tutorials, please consider supporting me:<\/p>\n\n\n

\n
\"\"<\/a><\/figure>\n<\/div>\n\n\n

And, you can also have a look at the video tutorial here.<\/p>\n\n\n\n

\n