Skip to main content

Posts

Showing posts from January, 2021

Morning Code- Add new items to list via floating action button

  So I have been told that my text field on the shopping list page of my app can be difficult to see. I made it a little transparent so that it went well with the background of the lists. But today I am going to change how people enter items into the list. I will take away the text field and just have a floating action button visible. Once the button is pressed an alert dialog will appear and that will have a text field, add button, cancel button, and an add more button.  So I replaced the text field with a Floating Action Button. I made it blue with a white plus sign in it. When it is taped it flashes a light blue color. Without the Stack or Align Widget, the button appeared at the bottom center. With the align widget I made it appear at the bottom right with some padding on the bottom and right side.  Align ( alignment: Alignment. bottomRight , child: Padding ( padding: const EdgeInsets . only (bottom: 18.0 , right: 10 ), child: FloatingActionButton ( onPressed: ()

Creating a list inside of a list- morning code

 So right now I have a collection for the user that holds the list tiles. What I want to do today is create a way for another list to be created when you click on the list tiles. I will use my Shopping list page to display each list. What I will need to do is find a way to pass the title of the list from the list page to the Shopping list page. The list name will be used to identify the document within the user collection.  Then when you click on the list tile the list name will be passed into the Shopping list page stateful widget. FlatButton ( onPressed: () { Navigator. push ( context, MaterialPageRoute ( builder: (context) => ShoppingListPage ( listName: listName , ))); },  I know that I will not be able to access this variable within the rest of my shopping list page code because it is created under the Shopping list page state. So I need to pass the variable from the shopping list page widget to the Shopping

Morning Code- deleting new list tiles

 We are starting off with the ability to add multiple list tiles. These tiles are flat buttons that when clicked on will take you to the shopping list page. Right now when I click on them nothing happens. During today's Morning Code session I will change that. I will first add the ability to delete a list by long-pressing it. Using the Gesture Detector widget on long-press an alert dialog will appear and ask if you are sure you want to delete it. A yes will delete the document from the firebase firestore collection and a no will pop you back to the main screen.  return GestureDetector ( onLongPress: () { showDialog( context: context, builder: (BuildContext context) { return AlertDialog ( title: Text ( "Are you sure you want to delete this list?" ), content: SingleChildScrollView ( child: Row ( children: [ MaterialButton (

Creating multiple lists - Morning Code

  My goal is to code every morning for 1 hour. In this series, I will share with you what I accomplished during my daily Morning code sessions.  While this is not a tutorial I'm sure you will find it useful. I am sharing my experience developing my shopping list app.   I will share what the app looked like at the beginning and the end of the session. I will share the code snippets that I added and how I troubleshot any issues that came up.  So I am working on adding a screen to my shopping list app where you can create more than one list. What I want it to display is the box to add a list even when there are no lists in the collection. I am using firebase cloud firestore as a database to hold the lists. But right now all I see is a blank screen. I think that is because I told it that if the database is empty display an empty box. if (!snapshot. hasData ) { return Container (); } Ok, I kept getting the following