Flutter Listview Vs Singlechildscrollview - Which one is better for app?

welcome to flutter teacher in this video with five different points I'm going to compare list view visit with single child scroll view so without wasting time let's get started [Music] for understanding this comparison you must know the basics of both list View and single child scroll view we already covered them in separate videos don't forget to watch them link for them is available in the description basically both list View and single test Field view are the visit in flutter that can be used to display scrolling content in an application they may seem similar at a first glance but there are some important differences between the two that make them better suited for different use cases now let's see Point by Point how they differ the first point is content placement when we use list View and single charge scroll view you can notice the difference how we place the container that is item inside it for list view we pass scrolling content directly as child and for list to Builder and list load separator we use Builder function whereas in case of single child score view we get a child that takes only one element and that's why we usually make a column as a child for single chance holy View and place scrolling content as the children for this column now let me talk about memory uses and performance list view is designed to display large number of child widget and the list speed of Builder listed or separator as well as the list.custom is optimized for rendering only the visible portion of a list items on the screen here items are loaded and unloaded as needed based on the position of school which helps to improve the performance and reduces the memory uses whereas single test scroll view loads all it contained at once and thus consumes more memory and is not so efficient compared to the list View now let's talk about a point called child width and height one of the most key difference that you might have seen in the way how atoms occupied width and height in case of list View and the single test column in case of list view when list view is vertical all the item will take maximum available width and for horizontal list view all items will take maximum available height you can observe here I simply have a list view here and that contains a container you can also hear weight of this container is only 200 pixel and the second container has only the 100 pixel width still you can observe all the elements that is all the containers of this list are getting the complete width now let me change this list to say column and so let me write here column and what I'm going to do I'm going to wrap this column inside the single time scroll view let's wrap it inside the widget and we have to name this as a single child scroll view let's write your single chance School View and now let me save the application and let's see the magic that happens here you can also here as we have a single cell scroll view each element in Singapore view is not occupying the complete width or complete height rather it is time to get the minimum height or minimum width it is possible you can observe here the first container is having a view drop only say 200 pixel here and the second has got a bit of 100 pixels third has got the 400 pixel of course it is having the same color and let me go to the red one the red one has got weight of 200 and if I scroll here you can see we have the rate container with only 150 width now let's talk about the number of properties available as list view is optimized for memory usage and it also relates the programmer to control the optimization by using the properties like item extend prototype item automatic keep aliu and repaint boundaries then a cat extend and so on whereas in case of single charge scroll view we can't see these properties now the fifth and very important question is which one to use flutter has given list View and single test value to work in different use cases as list view is optimized for memory and performance when long list of scrolling item has to be shown lateral suggest list view or appropriate Constructor of it whereas when we need scrolling behavior only to fit UI perfectly in different screen size or for device rotations use the single child scroll View moreover to display keyboard of the text input scrollable alert dialog and a small scrolling components like form user profile setting options are suggested to be placed inside the single child scroll View that's it for this video see you guys in the next video if you have any doubt or any queries related to this topic feel free to comment it and if you really found this video helpful and knowledgeable then don't forget to like share subscribe and hit the Bell notification button to get while it is videos

Channel: Flutter Teacher

Views: 2,308

Keywords: flutter listview vs singlechildscrollview, flutter singlechildscrollview, flutter listview, listview vs singlechildscrollview, singlechildscrollview vs listview, flutter singlechildscrollview vs listview, difference between listview and singlechildscrollview, compare listview with singlechildscrollview, What is the difference between ListView and SingleChildScrollView, singlechildscrollview or listview

Id: yA83CJgHoSM

Length: 4min 41sec (281 seconds)

Published: Mon Jun 26 2023