[Summary] SEC S20W4 - Interactive UI Elements in Flutter: Crafting Dynamic Layouts with Card, Scrolls, and ClipRRect in Flutter

Hi everyone!

The 4th week of Steemit Engagement Challenge has already finished in which we explored flutter mobile application development. We learnt Card, SingleChildScrollView, Scroll Types, ClipRRect.

Steemit Engagement Challenge Season 20 Week 1 (6).png

Designed with Canva

It was an exciting lecture and students learnt new things in the flutter mobile application development. It was another interesting and full of new concepts lecture for those students who are interested in mobile application development but they did not have any chance to learn they have gotten this splendid chance of learning mobile application development through an initiative by the Steemit Team.

The learning outcomes of this lecture include that the students learnt to handle the complex user interfaces. I taught the students that how we can interact with the card widget to make different beautiful user interfaces and to manage the complex user interfaces. They how we can create a profile card to represent the data of the people. They learnt how we can use the card widget to create an interface to represent a product for the sale by mentioning its picture, price, ratings and much more according to the requirements.

They learnt to make a beautiful news card which has a cover image for the news, title, description, date, and the name of the author. Then the students were taught about the scrolling directions that how can we scroll in different directions. And I showed it with practical examples for their ease of understanding. They learnt to resolve their error of the bottom overflow.

The students learnt to make the image look more beautiful and attractive. They learnt to explore ClippRRect widget to make a beautiful layout of the images. As a plus point for the students I am telling them here that they can use different radius for the different sides of the images such as we can make the 2 opposite corners of the image round and 2 can be still sharp.

image.png

I am happy that students participated with best of their knowledge and by learning the concepts provided in the lecture. Students made different screens to complete the tasks. They presented their tasks in videos and by making the gifs.

The quality of the work was awesome of all the students. And where they needed correction or improvement I tried my best to guide them and appreciated them. The students build beautiful image gallery in which the images were scrollable. Personally I enjoyed entries of all the students especially of those students who put more creativity in building the layouts and while implementing the things in application.

Statistics

During this week 6 genius students attended the lecture. Each entry was of high quality representing the learnt skills and hard work of students. There was a great competition of the quality of posts between all the participants. They remained stick with the required observations. I am very happy from the students for providing such a quality work.

Total Entries6
Invalid0
Plagiarized0

Top 5 Users of Week

The competition between the users was very high. I assessed the quality of the posts of the users keenly to select them in the top users. I also focused on their engagement with other users to pick the quality content provider as well as an engaging user. But mainly the quality of their post is kept in mind.

PositionUsernamePost LinkGrades
1@alejos7venLink9.75
2@kouba01Link9.5
3@akmalshakirLink9.25
4@sergeykLink9
5@fombaeLink9

Conclusion

The fourth lecture of Flutter Mobile Application Development has ended successfully where I saw the good response from the users who are interested in mobile application development as well as coding and programming. This lecture was all about teaching the students about handling the complex user interfaces. It was a fruitful lecture for the students who learnt something new here while staying at Steemit. All the students performed well. And I have made meaningful comments on the homework of all the students to clear their misunderstandings as well as to correct them where correction was required. I suggested to students to show the video outputs where the state of the screen is changing so that I can analyze your work and can guide you if there is the need of some correction.

Flutter Mobile Application Development under Influence of Steemit Team

LectureThumbnailTitle
1SEC S20W1 - A Comprehensive Guide to Flutter Mobile Application Development
2SEC S20W2 - Mastering Flutter's Widget Tree, State Management, and Essential Widgets
3SEC S20W3 - Exploring User Inputs, Gesture Detection, Navigation, and Bottom Sheets in Flutter
4SEC S20W4 - Interactive UI Elements in Flutter: Crafting Dynamic Layouts with Card, Scrolls, and ClipRRect in Flutter
5SEC S20W5 - Flutter Toolkit – Managing Packages, Custom Application Icons and Streamlining Navigation

Sort:  

I am really enjoying and learning new things through this course. If I could kiss the first lecture then I could not be able to continue with next lectures. It has given me new zeal and zest to explore unique things.

Pleasure to know you are learning.

Coin Marketplace

STEEM 0.20
TRX 0.17
JST 0.031
BTC 88194.12
ETH 3339.93
USDT 1.00
SBD 3.00