Roaa ๐ฆ๐
@roaakdm
Followers
20,727
Following
279
Media
566
Statuses
2,296
Software Engineer @widgetbook_io โข #Flutter GDE ๐ โข Into code that makes art ๐จ
Berlin, Germany
Joined August 2014
Don't wanna be here?
Send us removal request.
Explore trending content on Musk Viewer
#TommyHilfigerNYFWxPPGF
• 362512 Tweets
Kendrick
• 343645 Tweets
Super Bowl
• 287430 Tweets
Taylor
• 283058 Tweets
NYFW24 WITH GEMINI FOURTH
• 229215 Tweets
Drake
• 206071 Tweets
JISOO AT NYFW WITH TOMMY
• 140239 Tweets
Giants
• 123344 Tweets
Wayne
• 120064 Tweets
PONDPHUWIN NYFW2025
• 101775 Tweets
Browns
• 98289 Tweets
Cowboys
• 94175 Tweets
Bengals
• 85453 Tweets
Watson
• 76467 Tweets
Lions
• 64308 Tweets
Raiders
• 55503 Tweets
้้ฝใฎ็ฏๅฅ
• 54520 Tweets
Chargers
• 52603 Tweets
Seahawks
• 45486 Tweets
Baker
• 39519 Tweets
Broncos
• 37149 Tweets
Daniel Jones
• 37046 Tweets
Cleveland
• 31984 Tweets
#ใใใใฎๅฎ็ฉ
• 31511 Tweets
Tom Brady
• 27096 Tweets
Rams
• 22287 Tweets
ใฉใดใฃใใ
• 19546 Tweets
ใใฃใฆใ
• 17187 Tweets
Alex Morgan
• 15406 Tweets
ใใกใฅใใใ
• 15169 Tweets
Bo Nix
• 13889 Tweets
#OnePride
• 11408 Tweets
Pinned Tweet
At
@FlutterConWorld
Berlin this year, my talk explored
#Flutter
for creative coding,ย and using algorithms for various art techniques ๐จ
I had an interactive demo running before the talk and it was amazing to see people interact and have fun with it ๐คฉ!
Details & source code ๐๐ป
7
12
83
In my
@FlutterVikings
talk, I talked about what it takes to create animations like this one๐๐ผ
In this article you will find links to the talk, slides, live demo and code as well as a written version of the talk ๐
Source code ๐๐ผ
#Flutter
#FlutterVikings
131
556
4K
#Flutter
animation tip๐ช
Bring any boring scroll view in your UI to life (ListView, GridView, ..etc) by wrapping its children with an animated widget and let the itemBuilder do its magic ๐ช๐งช (it will run your animation when each item scrolls into view ๐คซ)
Code ๐๐ผ
74
379
2K
And
#Flutter
can do this, too! ๐ซข
I stayed up til 7 am to do this! Totally worth it ๐
Source code ๐๐ผ
Made a super playful, interactive toolbar!
The expansion animations are fully interruptible, and haptics play as you scrub through items.
Other little things:
* the items scale up/down as they become show/hide
* scrolling past the top "stretches" the item spacing out
74
163
3K
80
262
2K
Hereโs the
#Flutter
implementation of this cool Airbnb interaction ๐คฉ
The recipe is just the good old built-in
#Hero
widget with some 3D transform tricks ๐ช!
๐ Source code:
Read on for the code details๐๐ผ
1/5
For people to try it, they have to feel comfortable staying with a host. Thatโs why every Airbnb Room comes with a Host Passport
20
29
284
85
296
2K
Another "
#Flutter
can do this too" tweet ๐๐
Still needs a lot of work and performance optimizations so use at your own risk ๐
And I will be updating this thread with tips and details!
Source code ๐๐ผ
Thanks to
@philipcdavis
for the original concept!
Hereโs a boomerang effect I made this weekend in SwiftUI.
56
266
5K
52
181
1K
This is pure
#Flutter
๐ฅน๐
๐ Toggle 3d view
๐ Sound effect
โจ๏ธ๐ฑ๏ธ Keyboard & Mouse/touch support
๐ฌ 1200 LOC
2๏ธโฃ Sleepless nights ๐
๐ฉ๐ปโ๐ป DartPad ๐๐ป
Read on for source code and details ๐๐ผ
Thanks to
@yoavikadosh
for the original CSS implementation.
Experimenting with CSS ๐งช
I made this 3d mechanical keyboard using a combination of CSS techniques, including transformations, gradients, box/text shadows, filters, and more!
@CodePen
:
46
176
2K
58
131
766
If you've seen that cool Glass effect in UI design and wanted to add it to your
#Flutter
app,you can easily do so with the
#BackdropFilter
widget๐ฅ
Just wrap it with a ClipRect widget to apply the filter to the child only (it might be applied to the entire screen๐
)
#FlutterTip
17
103
675
I am so happy to share that I am now a Google Developer Expert for
#Flutter
๐๐ฅน๐ฅณ๐
I'm deeply grateful to everyone who helped me get here.
@pr_Mais
,
@nlycskn
,
@BeyzaSunayGuler
and other amazing people! And I'm looking forward to keep contributing to this amazing community ๐๐
128
37
674
Been a while since I did a
#Flutter
UI challenge so I dug this one up from my bookmarks. Was super fun to build! โจ
The rubber band effect, different gesture handling, haptic feedback and other details together create a great interactive feel!
Details and code ๐๐ป
#FlutterDev
I built a chonkier, Apple TV-inspired action menu that feels responsive and substantial!
Notes:
โ The highlighted row gets magnified and moves slightly with touch
โ Spring-loads on long-press, or immediately if you drag
โ Stretches and rubberbands if you pull past the bottom
56
134
3K
24
77
573
#Flutter
tip: use the
#SafeArea
widget to make sure your content is not hidden by any operating system elements like the status bar at the top or the iOS home indicator at the bottom ๐
๐ฝโโ๏ธ.You might need this if your page doesnโt have an app bar for example.
#FlutterDev
#FlutterTip
9
66
483
#Flutter
Animation guide ๐
1๏ธโฃ Implicit - AnimatedFoo & TweenAnimationBuilder
2๏ธโฃ Explicit - FooTransition, AnimatedBuilder & AnimatedWidget
1๏ธโฃ.1๏ธโฃ Implicit - Ready-to-use
Add โAnimatedโ to a regular widget (Container, Positioned, .etc) with a duration and youโre good to go!
1/7
11
88
458
Time for a new
#Flutter
can do this, too, tweet ๐๐ค
This one was easier to implement than expected but also a lot of fun!
Thanks
@_Kavsoft
for the inspiration!
๐ Source Code
๐ Read on for implementation details ๐๐ผ๐ค
After refactoring the code of an old video, I believe the Matched Geometry Effect is now properly synced with the image ๐ค๐ค
#Animation
#swiftui
#xcode
#Apple
9
33
331
23
56
414
#Flutter
tip: instead of abruptly switching between 2 widgets, use the
#AnimatedCrossFade
to apply smooth fade animation for a better user experience ๐ฅ ๐
#FlutterTip
#FlutterDev
11
69
400
If you want to get started or dive deeper into Riverpod, this full
#Flutter
app example might help!
๐ The Movie DB API
๐ฆ Caching
๐ Infinite-scroll/Pagination
๐งช Unit & widget tests! (100% coverage! ๐)
Check out the README for more details ๐๐ผ
19
75
388
#Flutter
tip: use the awesome
#Hero
widget to create cool transitions between pages in your app
Set `transitionOnUserGestures` to true to enable animation on page pop as it's not automatically enabled on iOS
#FlutterTip
#FlutterDev
4
47
353
Very excited to share that I recently joined the
@widgetbook_io
team as a Senior Flutter Developer ๐๐ฅณ
Widgetbook is an open source collaboration platform for Flutter developers that bridges the gap between designers and developers and I'm looking forward to contribute to it๐คฉ
67
22
344
May the SafeArea widget protect us ๐๐ผ
28
39
341
HAVE YOU USED
#FLUTTER
YET?? IT'S LIKE THIS MAGICAL TECHNOLOGY THAT ALLOWS YOU TO EASILY AND QUICKLY BUILD BEAUTIFUL APPS FOR ANDROID, IOS, MACOS, WINDOWS, LINUX, WEB, SMART WATCH, AND MAYBE EVEN YOUR FRIDGE WILL BE ABLE TO RUN IT SOON! I'M TELLING YOU IT'S THE FUTURE!
15
34
301
DartPad code snippet (it works on web too๐คค)
Disclaimer: I did this in a couple of hours, so the code needs lots of optimizations ๐ use it at your own risk
Or even better, help me optimize it in this repo
5
30
292
Keeping my coffee hot while working with the Android emulator
24
18
280
#Flutter
tip ๐งต: Use
#AutomaticKeepAliveClientMixin
with your
#TabBarView
children widgets to prevent rebuilding them on each tab switch
1/4
20
50
268
Just published an article version of my
@FlutterconEU
talk where I talked about how you can use
#Flutter
's
#CustomPainter
& Canvas API to get started with creating and animating your own generative art ๐๐ป
๐
#flutterdev
#generativeart
9
54
255
Made yet another awesome Flutter developer friend through the Flutter/Flutteristas community ๐ฅน๐
@esrakadah
8
2
246
So excited to share that I just moved to Berlin ๐ฅณ๐ฉ๐ช
Exactly a year ago, I packed everything and left a terrible life and started over. Today I packed everything and moved into a life of my choosing.
Crazy how the toughest decisions can turn out to be the absolute best!
34
3
232
#Flutter
tip ๐งต: use the
#RefreshIndicator
widget to allow your users to refresh a pageโs content.
Read on to see how to make this widget work properly.
1/7
10
47
225
#Flutter
tip: wrap your long scrollable widget with a
#ScrollBar
widget to display a scrollbar for a better user experience.
By default, the ScrollBar widget is platform dependent and reflects native behavior (like iOS's haptic feedback, video ๐๐ฝ)
#FlutterTip
#FlutterDev
5
42
221
#Flutter
tip: use the
#ColorFiltered
widget to apply custom color filters to any section in your UI.
An example usage would be to indicate inactive elements in your UI using a greyscale color filter.
#FlutterTip
#FlutterDev
5
45
220
Just published a comprehensive guide for
#Flutter
Animations to the
#FlutterCommunity
on Medium ๐๐
It's loaded with Gif's ๐ Check it out ๐๐ผ
#FlutterDev
#FlutterTutorials
5
55
210
#Flutter
tip: use the
#ReorderableListView
widget to easily create lists that the user can reorder ๐ค
#FlutterDev
#FlutterTip
3
35
212
Wooohoooo ๐ ๐
My
#FlutterPuzzleHack
submission, the Dashtronaut
#Flutter
slide puzzle game, just won Best Education Content!!!!
31
16
210
#Flutter
performance tip: for long lists, use the builder() constructor with your ListView or GridView widgets. This way your list/grid items will only be built on-demand as they are scrolled into view ๐ฅโ๏ธ
#FlutterTip
#FlutterDev
#FlutterPerformance
1
39
198
#Flutter
ScrollPhysics variations and use cases. A thread ๐งต
1) NeverScrollableScrollPhysics
Prevents scrolling. You might need it when you have a ListView inside a Column inside a SingleChildScrollView and you want the entire screen to be scrollable as whole.
1/9
9
49
197
Developers with M1/M2 MacBooks, how do you keeps your hands warm while working?
46
5
185
Working on my
#FlutterPuzzleHack
puzzle's cross-platform compatibility and responsiveness and enjoying the capabilities of
#Flutter
๐๐คฉ
I'm debugging my app on an iPhone, Android Phone, iPad, and web simultaneously and it's so much fun!
#Flutter
is freaking awesome! ๐
10
17
182
#Flutter
tip: avoid calling setState() in a long build method or all the child widgets in it will rebuild!
The best solution would be to destructure your build method into multiple small widgets. But if you canโt do that for some case, use the
#ValueNotifier
widget
#FlutterTip
5
31
178
How amazing are
#Flutter
and
@mkobuolys
's skills?! ๐ฅน๐
Check this out for some serious CustomPainter and animations magic ๐ชโจ๐๐ผ๐๐ผ
Since our queen of animations
@roaakdm
has some more serious business to do, I accepted the challenge and implemented this using
@FlutterDev
๐
It took a while, but I am extremely happy with the result!
Code and other details ๐
44
178
1K
2
11
178
Our previous selfie was in Oslo in Flutter Vikings, this one is in Istanbul, already looking forward to the next one! ๐
#Flutteristas
9
5
172
#Flutter
tip: use the
#WillPopScope
widget to prevent your user from swiping the page to dismiss (pop) it. This is important when you're loading some API request for example.
#FlutterDev
#FlutterTip
6
26
170
Hit me with your contributions ๐คฉ
9
21
167
๐ณ๐ณ๐ณ๐ณ๐ณ
Now I want my whole life to be filled with these screens and Flutter running on it!! ๐
Running
#Flutter
apps on flexible and "unconventional" displays - possibilities are endless ๐ช Thanks
@devangelslondon
for the inspiration ๐๐
@FlutterDev
@GoogleDevExpert
98
520
3K
2
10
163
Sorting 90,000 pixels using
#Flutter
with a
#CustomPainter
and a quick sort algorithm, because why not? ๐
One of the (wip) demos I'm building for my
@FlutterconWorld
Berlin talk, so excited for this one!
#FlutterDev
#CreativeCoding
10
17
167
Look mom I'm on the official Flutter account! ๐
This is so exciting ๐คฉ๐คฉ Can't wait!!!
Get your tickets people! ๐๐ผ
๐ฏ Take your Flutter animations to the next level.
@roaakdm
will walk you through how to use Flutter's tools and the surrounding ecosystem to take your animations to the next level!
Join her on August 31st โก๏ธ
#FlutterVikings
1
26
186
13
8
163
Hoooray ๐๐ ๐คฉ๐คฉ๐๐
My
#FlutterVikings
session got accepted!
It's about next-level
#Flutter
Animations that will make your users go: Wow, can an app do that?! (And developers go: Wow, Flutter can do that?!๐ฑ)
Thank you
@FlutterVikings
for the awesome opportunity! Can't wait!
15
9
152
TL, DR;
This is the code repository for the demo animation
3
13
151
Weโre so excited to see
@widgetbook_io
featured at
#FlutterForward
!
This was just a glimpse of what Widgetbook offers
#Flutter
devs, check out more:
2
13
152
Check this out If you want to know everything about the app architecture and folder structure of my Flutter Puzzle Hack's Slide Puzzle app ๐๐ผ๐๐ฉ๐ปโ๐ป
(Dashtronaut tutorial 2๏ธโฃ)
#Flutter
#FlutterPuzzleHack
3
27
150
#Flutter
tip: Use the
#IgnorePointer
widget to disable all pointer events for any section of your app!
An example usage would be if some API request is still loading and you don't want the user to be able to do anything until it's done!
3
39
151
#Flutter
tip: use the
#RichText
widget to be able to change the text style of specific words or portions inside your paragraph.
#Flutter
#FlutterDev
#FlutterTip
8
19
148
I am back home and the last 2 days feel like a dream! ๐ฅน
Incredibly grateful for the opportunity to attend such an amazing event and spend time with amazing people! ๐
And Iโm very excited for the future of
#Flutter
!
#FlutterForward
4
6
147
4
7
143
And thatโs a wrap ๐๐ฅณ๐
Thank you to everyone who made this happen it was an amazing event ๐ฅน๐ (and I didnโt even have to travel ๐)
@GDGIstanbul
#DevFest22
#dfist22
#DevFestIstanbul
#Flutter
9
8
140
Accidentally deleted all Flutter projects from my laptop
Note to self: NEVER KEEP CHANGES LOCAL! ALWAYS PUSH!
15
15
139
My talk today at
#ftcon23
was the best talk experience Iโve had so far! Having people come up and say Iโve inspired them or made a once scary concept to them not scary anymore has made every ounce of effort I spent more than worth it and I am so grateful! ๐ฅน๐
To those who
9
15
139
Nothing beats the productivity level of working on a repo that will never be public ๐คฃ๐
commit, type whatever, push to main, repeat...
22
4
130
Watching
@devangelslondon
do cool 3D stuff with
#Flutter
on the
@FlutterComm
#HumpdayQandA
Is the best entertainment I can ask for while sick ๐ฅน
9
4
123
A quick
#Flutter
animation tip ๐๐๐ค
Custom hero animations, anyone? ๐๏ธ
In this Flutter Quick Tip from
@roaakdm
, learn how to create highly customizable hero images with flightShuttleBuilder.
Watch more
#FlutterQuickTips
here โ
4
37
193
5
7
119
#Flutter
tip: use the amazing
#CachedNetworkImage
package to cache network images for a faster & smoother app flow ๐ฅ! And don't forget to utilize the placeholder and the errorWidget widget builders for a better user experience! ๐ฅณ
1/2
3
33
120
Itโs workshop time! Awesome iOS Home Widgets workshop by
@LeighaJarett
&
@ericwindmill
#FlutterForward
#Flutter
1
7
117
I am still amazed by everything in the keynote, especially the mind blowing element embedding demo by
@timsneath
๐ฅณ
#Flutter
is the future!
#FlutterForward
๐
3
2
114
The Flutter, Dart, Firebase teams and Dash are answering questions ๐ค๐๐
@FlutterVikings
4
9
115
I was busy being not busy the past 2 weeks and went to a couple of places โ๏ธ๐ฎ๐น๐๐ซ๐ท
After this long awaited hard reset and a renewed motivation Iโm so excited to be back to work and hopefully to creating & sharing awesome things with Flutter ๐
10
2
116
๐ Merry Christmas from the Google Istanbul Office and an amazing Women Techmakers
#DevFest
with extraordinary women that I am so proud to have met today ๐๐ฅน
@WtmTurkey
@WomenTechmakers
#MerryChristmas
6
4
112
Last one before the big three oh ๐ฅถ
Joking aside, itโs the most exciting time of my life and Iโm happy to be here! ๐ฅน๐
48
4
115
Write tests people! I can't stress this enough. WRITE TESTS!
12
14
114
I finally have a Dash plushy ๐คฉ๐คฉ๐๐
Itโs the law to take a selfie with her, right? ๐
Thank you
@anthonyvprakash
,
@SVFlutter
๐คฉ๐
#NewProfilePic
#Flutter
#Dash
4
1
114
#FlutterForward
community day just started ๐ ๐
And Dash is looking as cute as ever! ๐
3
1
113
API + Offline usage? Yes, please! ๐คฉ
Surprise your
#Flutter
app users with offline support for a great user experience!
That's the topic of my online Flutter Festival London talk! Can't wait for you to be there! ๐ฅณ
#FlutterFestival
#FlutterFestivalLondon
2
16
110
I canโt handle the cuteness ๐ญ๐๐ญ๐๐ญ๐
So exciting ๐คฉ๐ฑ
๐
#FlutterForward
๐ January 25, 2023
๐ Streaming live from Nairobi, Kenya
Join us to get the latest Flutter updates and see how we're pushing UI development forward. Are you ready?
Register here โจ โ
114
520
2K
3
5
102
Source code ->
(The code still needs some cleanup so use at your own risk ๐)
๐ Live web demo ->
2
15
104
Firebase Real-time + Flutter Animations = ๐ช๐ฅ
Have some cool stuff planned for this one ๐๐ป๐คฉ
3
9
104
I will be giving a
#Flutter
animation workshop at
@FlutterNFriends
and I am so honored to be among a great line up of talks and workshops!๐๐คฉ
Get your tickets if you can and join this epic event in Stockholm! ๐ธ๐ช๐ฅ
After going through more than 100 submissions, the speaker line-up for Flutter & Friends is finally set! ๐
And if we can say it ourselves, it is a crazy good set of talks! ๐ฅ
Check it out and get your ticket (or make your boss buy you one ๐) on
1
18
70
2
7
99
#Flutter
localization tip ๐งต: easily support RTL layout in your UI by using Flutterโs built-in Directional widgets
Those widgets have start/end params instead of left/right, and those params switch direction automatically depending on the layout.
#FlutterTip
#FlutterDev
3
13
94
Wouldn't be awesome if we could build smart watch applications using
#Flutter
without native code? โ๏ธ๐๐ฉ๐ฝโ๐ป๐ค
@FlutterDev
@FlutterComm
8
9
92
Nothing teaches you how to write clean code better than creating a tutorial about your code ๐
3
4
94
Just revamped my outdated GitHub README and added the
#Flutter
talks done in 2023 with their video links, code repos, and some other articles and resources.
Looking forward to doing more content and talks in 2024! ๐คฉ๐
2
9
97