Joe Muller
@code_ontherocks
Followers
5,132
Following
512
Media
1,132
Statuses
5,740
@aicofounded 🤖 Code on the Rocks 🍹💙 Creator of flutter_fast_cli 🔥 #AICofounded #FlutterDev #ReactJS
Virginia, USA
Joined April 2019
Don't wanna be here?
Send us removal request.
Explore trending content on Musk Viewer
Lviv
• 138785 Tweets
月見バーガー
• 92849 Tweets
月見パイ
• 78638 Tweets
確定申告
• 75144 Tweets
Vinicius
• 68850 Tweets
ジェーン
• 44886 Tweets
#乃木坂の夏はやっぱ神宮だな
• 41565 Tweets
YAIBA
• 37300 Tweets
ラポスタ
• 30228 Tweets
JACK JOKER X TATTOO COLOUR
• 28760 Tweets
#PVL2024
• 23745 Tweets
#Number_i_LIVETOUR
• 23610 Tweets
#リンクラ生放送
• 21567 Tweets
DAZN
• 21397 Tweets
ヤクルト
• 18106 Tweets
手取り15万
• 16187 Tweets
戸塚記念
• 15985 Tweets
Shamelessly stealing an idea from
@jacksonfall
and prompting GPT-4 to help me build a profitable business.
I'm going to start with the same prompt and do whatever it asks me to.
Let's goooooooo
I gave GPT-4 a budget of $100 and told it to make as much money as possible.
I'm acting as its human liaison, buying anything it says to.
Do you think it'll be able to make smart investments and build an online business?
Follow along 👀
3K
15K
101K
44
46
401
#Flutter
Architect v1 is out!
I built a developer tool using
#GithubCopilot
to make Flutter development even faster.
- Quickly build nested widgets
- Click to copy common snippets
- Create multi-child layouts
18
29
307
#Flutter
for
#Tizen
!!
I admit there were a handful of gotchas during the setup but this is awesome. I'll be publishing an article on the process later this week 💻
@FlutterDev
@TizenExperts
@SamsungUS
@googledevs
#GoogleIO
#flutterDev
#coding
#galaxywatch
11
44
293
The new SwiftUI-in-Flutter build is up!
✅ CupertinoApp
✅ CupertinoPageScaffold
✅ CupertinoDynamicColor
✅ CupertinoTextThemeData
✅ CupertinoListSection.insetGrouped
I was completely unaware of the depth of Cupertino support in
#Flutter
...it's pretty cool!
18
29
255
The engineer that came up with this deserves a raise.
#flutter
#FlutterDev
#DartLang
#Android
#ios
@androidstudio
16
12
235
#Flutter
Tip:
When your device's keyboard is open, FloatingActionButtons are better doors🚪than windows🪟
Use this simple trick to hide you FABs whenever the keyboard is open so that it doesn't block the view of your TextFields.
#FlutterDev
#Mobile
5
52
222
Hi everyone!
Since the
#HustleGPT
movement is taking off 🚀 I decided to create a public repo to track everyone's progress.
Let me know if you're participating and I'll add you!
I've added a few to get started:
@jacksonfall
@xnuonux
@FollowRobJ
25
33
226
Daily
#Flutter
Tip 🚀
You can use anonymous functions (){} to programmatically determine which widget to show.
Here, I use a switch statement inside an anonymous function to react to changes in the loading state
15
34
230
I've been using
#Flutter
for over 2 years and I just now discovered the Stepper widget.
It's perfect for setting up sequential onboarding flows or features that require certain questions to be answered before others.
#FlutterDev
#FlutterCommunity
14
41
199
Daily
#Flutter
Tip 📏
You can use the FractionallySizedBox widget to create containers that take up a fraction of the total available space.
Just set a widthFactor and heightFactor and you're good to go! I use this a lot with showModalBottomSheet to keep the dialog short.
4
23
192
#Flutter
Efficiency Tip:
Use the ColoredBox widget if your only goal is to change a container's background color.
#dartLang
#FlutterCommunity
#android
#ios
4
21
176
Animated List transition demo in
#flutter
SwiftUI got another super nice API in iOS 17: Scroll Transitions!
13
33
526
3
20
176
#Flutter
Efficiency Tip 🍃
Just had my mind blown for a second time today.
Each of the new Material buttons comes with an convenient .icon(...) constructor for creating buttons with a leading icon and label.
#FlutterDev
#FlutterPuzzleHack
3
30
167
Here's the constants.dart file I include in every Flutter project I work on.
It takes a little inspo from
@tailwindcss
and it makes life a whole lot easier 👏👏
13
12
164
#Flutter
Tip:
You can add vibrations of various intensities using the HapticFeedback class.
I've seen a lot of apps recently adding haptics to all of their button interactions (*cough*
@coinbase
)
#FlutterDev
#FlutterCommunity
#100DaysOfFlutter
6
30
153
#Flutter
Performance Tip:
Create a reusables.dart file to hold components that are constant everywhere.
- Padding and margin values
- Border values
- Spacers
...
11
26
152
I started learning
@FlutterDev
at the beginning of 2020 and have been 100% focused on
#Flutter
since then.
It was honestly worth the time investment.
But in the name of continuous improvement, I'm branching out!
Chapter 2: DevOps
Language:
@golang
9
5
144
Deploying a
#Flutter
app to Google Play or the Apple App Store can be stressful, even if its been rigorously tested. Why?
Because it's basically impossible to perform a hot fix
🔥🫠
A pessimistic thread on a problem I'd like a solution to 🧵
7
24
136
Where's my blue heart 💙 crew? If I'm not following you, like this Tweet and I will 👌
#flutter
#flutterdev
#fluttercommunity
8
12
131
#Flutter
Gotcha 💥
How many users have you unknowingly trapped?
If you weren't already aware, number keyboards on iOS do NOT include a "Done" or "Close" button.
You can (kind of) work around this by setting the keyboardType to TextInputType.numbersWithOptions 👇
#FlutterDev
6
21
125
Daily
#Flutter
Tip ♺
You can use the RefreshIndicator widget to add a swipe-to-refresh feature to scrollable lists.
Just wrap the List in a RefreshIndicator and set the onRefresh callback.
Bonus: You can programmatically show the refresher using a GlobalKey 🤯
1
25
122
#Flutter
Tip:
You can use the breakpoint package by
@rodydavis
to create layouts that vary based on the current screen size.
A mobile design will almost never look great on a larger desktop display.
#FlutterDev
#FlutterCommunity
#dash
#firebase
2
25
118
Hey
#Flutter
Devs, I've got some big news 🚀
As of this morning, the flutter_fast_cli is now
#opensource
and available on pub. dev!
This goal of this project is twofold:
1. Help you launch fast
2. Make experimenting with Flutter-friendly tech easier
I have a lot more
9
18
124
It would be cool if we could opt in to notifications from our favorite packages on .
I guess you could always subscribe to the individual repos but it'd be better to manage my
#Flutter
notifications all in one place.
@FlutterDev
@FlutterComm
9
13
117
#Flutter
Tip for any
@androidstudio
users out there -
If you right-click on the lib folder and select "Optimize Imports", the IDE will remove all of your unused imports.
#Tech
#MobileApps
#Kotlin
#Swift
#android
#ios
#efficiency
6
25
114
The squadron package on pub. dev is an absolute gold mine of multithreading knowledge in Dart and Flutter 💙 🤯
I was struggling to set up a web worker for handling a giant, on-device calculation and this got me over the finish line.
2
17
116
#Flutter
Tip 🛠️
You can listen to multiple ValueNotifiers at the same time using Listenable.merge.
1. Create your ValueNotifiers as usual
2. Add a ListenableBuilder to your widget tree
3. Merge the ValueNotifiers
In this example, numOne and numTwo will both trigger a rebuild
3
13
118
7
22
113
#Flutter
Tip:
Use the AnimatedSwitcher widget to cross-fade between two different child widgets.
The animation defaults to a FadeTransition which simply fades the old widget out while fading the new one in.
#FlutterCommunity
#FlutterDev
5
28
109
#Flutter
Reminder:
The TextInputType.number keyboard type can result in different behaviors on different devices.
Make sure to double check your input fields on
#Android
and
#iOS
devices.
#FlutterCommunity
#FlutterEngage
2
21
105
Daily
#Flutter
Tip # 53💙
Use the Future.wait method to wait for multiple futures to complete 🕦🕝🕑
The response from Future.wait is a list of the results in the order you specified them. This is useful for cases when your UI depends on several backend calls.
#FlutterDev
4
9
113
Big
#HustleGPT
Milestone!!
💯💯💯💯💯💯💯💯💯💯
💯💯💯💯💯💯💯💯💯💯
💯💯💯💯💯💯💯💯💯💯
💯💯💯💯💯💯💯💯💯💯
💯💯💯💯💯💯💯💯💯💯
💯💯💯💯💯💯💯💯💯💯
💯💯💯💯💯💯💯💯💯💯
💯💯💯💯💯💯💯💯💯💯
💯💯💯💯💯💯💯💯💯💯
💯💯💯💯💯💯💯💯💯💯
We've officially reached 100 startups!
6
4
103
If you're an Android, iOS, or
#Flutter
dev, check out this awesome icon generator by
@romannurik
4
23
109
#Flutter
Tip:
You can use the Tooltip widget to show instructional messages to your users.
Tooltips shown this way will dynamically position themselves so they stay on screen.
#FlutterDev
#Accessibility
5
19
100
Daily
#Flutter
Tip # 55
You can create a ColorScheme from an image using the .fromImageProvider constructor 🖌️
This constructor "extracts the dominant color" from your image and creates a ColorScheme with "harmnonious colors that meet contrast requirements for accessibility"
2
13
105
Daily
#Flutter
Tip 💙
You can control how imported libraries are seen by your code using the "as", "show", and "hide" keywords.
"as" gives the library an alias.
"show" imports specific parts of a library.
"hide" prevents parts of the library from being imported.
#FlutterDev
4
13
100
ValueNotifiers are extremely useful for managing state in your
#Flutter
application but they might not work how you'd expect them to.
From the docs 📘
"Because this class only notifies listeners when the value's identity changes, listeners will not be notified when mutable
4
7
102
#Flutter
Tip:
If you want more control over shadows in your UI, you can use a DecoratedBox with a BoxDecoration.
Inside the BoxDecoration, you can provide a list of BoxShadows that will appear behind your widget.
#FlutterDev
#FlutterCommunity
5
20
98
Daily
#Flutter
Tip
You can implement fine control over the appearance of some material widgets using MaterialStateProperty.
For buttons, you can update their color when:
1️⃣ Pressed
2️⃣ Hovered
3️⃣ Disabled
4️⃣ Focused
There are multiple ways to set this up as shown here 🪄
4
11
95
#Flutter
Package Highlight:
The shimmer package lets you add a cool shimmer effect to any widget.
This can be used to create a sleek loading "skeleton". Simply wrap your widget with Shimmer and specify the colors you want.
#flutterDev
#dartLang
2
19
94
#Flutter
Package Highlight:
The timeago package can be used to create fuzzy timestamps.
30 seconds ago -> "A moment ago"
57 mins ago -> "About an hour ago"
4.8 days ago -> "5 days ago"
It's great for timestamping social posts or chat messages!
5
22
89
#Flutter
Tip:
You can change the color, shape, and border of your buttons using the .styleFrom() constructor.
Works for:
- ElevatedButton
- OutlinedButton
- TextButton
#FlutterCommunity
#FlutterDev
@FlutterDev
2
22
90
Used the image and file_picker packages to let users pick which image they want to play with.
It was a little tricky figuring out how to crop out sections of the original image since I was using BoxFit.cover...but it's working!
#FlutterPuzzleHack
#FlutterDev
#Flutter
8
12
84
I got a little bored during my lunch today and wanted to play around with an hourglass animation in
#Flutter
Implicit animations can really make an effect come to life ⏳
3
9
89
#Flutter
Tip:
Want to change the colors of your date picker?
Use the builder field to wrap the picker widget with a Theme. Then use the colorScheme in that theme to set the all of the colors.
#FlutterDev
@FlutterDev
5
13
86
#Flutter
Tip:
Use the ToggleButtons widget to offer your app users an intuitive UI for making choices.
The main components ⚙️
- children = List of widgets representing options
- isSelected = Array of boolean values representing selections
4
12
83
New loading screen?
This is just a GridView.builder with children that are animated using flutter_animate.
Just set a delay for each child based on the index and voilà!
#flutter
#mobiledev
#ui
5
7
90
I've updated the SwiftUI-in-Flutter demo with most of the basic accessibility features (and yes, you can exit the date picker now!)
@timsneath
#flutter
#swiftui
7
5
88
Daily
#Flutter
Tips 1️⃣2️⃣3️⃣
You can drastically improve the accessibility of your application using a few simple widgets.
1. Wrap unlabeled parts of your UI with the Semantics widget to give users more information about its purpose.
2. Use MergedSemantics to group widgets in
1
11
87
I discovered a hidden gem in the Flutter ecosystem this week 💎
Monarch is a developer tool for building Flutter widgets in isolation and its incredibly easy to start using.
1. Write your stories (just widgets)
2. Run Monarch
3. Tweak and debug
Add your onboarding pages, error
2
13
84
@dabit3
It definitely sounds like a location or experience issue. I'm doubling down and building a full stack Dart agency
4
0
81
#Flutter
Tip:
You can enable or disable your Heros using the HeroMode widget.
The HeroMode widget controls all Hero widgets in the given subtree.
#FlutterDev
#FlutterCommunity
@FlutterDev
@FlutterComm
4
15
81
I built a SliverAppBar that fades across a gradient as you scroll using:
Stacked
flutter_hooks
TabController.animation
Color.lerp
@FilledStacks
#Flutter
#Android
#flutterdev
#mobile
#ReactNative
#MaterialYou
6
15
81
#Flutter
Tip
You can select all of the text within a TextField by setting the selection property.
Here's the extension I use to do this:
4
9
77
#Flutter
Tip of the Day 🔧
You can rebuild the contents in a Modal Bottom Sheet or a Dialog using the StatefulBuilder widget.
The StatefulBuilder provides its child with a setState method it can call to trigger the rebuild.
#FlutterDev
#FlutterCommunity
#DartLang
#MobileDev
2
13
81
I gave the SwiftUI challenge by
@timsneath
a go in Flutter and ended up learning that there is a ListTile.divideTiles constructor 😮🤯
TBH I am tempted to try SwiftUI for the comparison
3
3
77
Daily
#Flutter
Tip 🪄
You can store a JSON object using shared_preferences.
1. Convert your JSON object to a string
2. Save the serialized string
3. Fetch the string and convert it back to a JSON object
Use dart:convert's jsonEncode and jsonDecode functions for (1) and (3).
2
7
74
#Flutter
Widget Tip:
If you've ever been frustrated with fitting a DropdownButton into your UI, check this out.
There's an "isExpanded" field in DropdownButton that will force the button to fill the horizontal space.
#flutterDev
#FlutterCommunity
2
21
74
If you're a
#Flutter
dev wondering what the difference between onSubmitted and onEditingComplete is in a TextField....
Check out this answer on SO. Long story short they both get fired but onSumitted gives you the text to work with.
3
9
72
Daily
#Flutter
Tip 🌠
The Transform widget is your go-to for applying graphical transformations to its child.
↔️Translate: Slide your widget around.
⬆️Scale: Resize your widget.
↩️Rotate: Give your widget a spin.
0
14
74
#Flutter
Tip
The DateTime class has a static integer property for each day of the week, starting at 1 (Monday) and ending at 7 (Sunday).
Each DateTime object also has a weekday property. This is useful for checking if a given day is on the weekend 📆
0
8
72
It's a work in progress but I just published a new
#Flutter
package 🚀
📦pwa_install📦
In short, it lets you prompt users to install your web app as a progressive web app (PWA).
6
12
70
Daily
#Flutter
Tip # 50 💙👀
One of the oldest UI tricks in the book is to stagger your animations so components pop in one after the other.
You can accomplish this with the flutter_animate package and the "delay" property on the Animate widget:
3
13
73
Daily
#Flutter
Tip 🔵
The FloatingActionButton comes in 3 sizes:
1. Small (or mini)
2. Regular degular
3. Large (do people use this?)
🪄 If you're using multiple FABs on a page, don't forget to add a heroTag.
#FlutterDev
1
8
71
#Flutter
Tip:
You can easily format your TimeOfDay objects using the format(context) method.
As mentioned in the docs, this method "is a chortcut for MaterialLocalizations.formatTimeOfDay"
#FlutterDev
#FlutterCommunity
2
12
68
#Flutter
tech tip of the day:
Colors.grey[850] is the background Material color when you're running in dark mode.
#efficiency
#dartdev
#android
#ios
1
10
67
All small mobile app development teams should be incredibly excited about the new FlutterFire UI package announced with
#Flutter
2.8.
Combine this powerful package with a code generator like Mason by
@felangelov
and OOF! You can be building an app a day.
4
7
62
There are 3 types of programming languages:
📦Object-oriented
🪜Procedural
🧮Functional
If you're curious about
#DartLang
, I found this snippet in the Effective Dart doc👇
2
11
63
Question for my fellow
#Flutter
Devs: Bad idea or what?
I like using the TextStyles from the app Theme and I dislike having to type "!.copyWith(color: myColor)" a 1000 times.
With these 2 extensions, I get TextStyles in any color FAST 🏎️🔥
Ex. "context.titleLarge.tertiary"
15
3
64
#FlutterPuzzleHack
Finished implementing some pretty accurate "contact detection" in my slider puzzle
➡️⬅️
This had been a fun problem to work on
@FlutterDev
@devpost
🔥🔥
#flutter
#hackathon
1
8
59
#Flutter
Tip of the Day 🎨 (x2)
You can determine if a background color is considered "light" or "dark" by:
1. Calling the computeLuminance() method on a Color object
2. Using ThemeData's static estimateBrightnessForColor() method
1
7
61
#FlutterPuzzleHack
Some more progress. Each piece knows when it's in the correct spot.
Honestly this is kinda fun since you have to remember where each piece belongs.
@FlutterDev
@devpost
#hackathon
#flutter
3
5
64
Daily
#Dart
Tip 🎯
You can find the max value in a List several different ways:
1. Use the built-in reduce() method on List
2. Use the maxBy() function from the Collection package
3. Use reduce() with max from the math library
#Flutter
#FlutterDev
1
6
62
#Flutter
Gotcha 🍎
CupertinoApp does not introduce a Theme widget to the widget tree so Theme.of(context).brightness won't tell you much.
Instead, it introduces a CupertinoTheme which you can use to check if the app is running in light or dark mode.
#Swiftui
#FlutterDev
5
4
62
Just updated ye olde Twitter banner so I figured I'd reintroduce myself
My name is Joe and I've been working with Flutter for almost 4 years. I created a little dev agency, Code on the Rocks, a few months ago to formalize some of the work I do in the space.
Things I post about:
2
2
59
#Flutter
Reminder:
The AlertDialog widget is intended to "inform the user about a situation that requires acknowledgement".
Typically this widget appears in the form of a popup and presents the users with a list of actions (in my case, TextButtons)
1
14
58
This is a great video for
#Flutter
devs to rewatch every few months.
Widget Tree = CONFIGURE
Element Tree = LIFE CYCLE
RenderObject Tree = PAINT
#FlutterCommunity
#MobileApps
1
6
60
The many faces of SizedBox 🎭
I recently started using the .shrink() constructor everywhere as per the
#Flutter
docs:
"The simplest way to hide a child is just to not include it, or, if a child must be given (e.g. because the parent is a StatelessWidget) then to use
0
4
58
Daily
#Flutter
Tip ➡️
You can listen to the onDrawerChanged callback of your Scaffold to update your UI when the drawer is opened or closed.
There is an equivalent callback for the end drawer (onEndDrawerChanged)
#FlutterDev
2
6
58
Daily
#Flutter
Tip ↕️
The OrientationBuilder widget provides an Orientation value to its children based on the dimensions of the available space.
‼️This is NOT the device orientation ‼️
maxWidth > maxHeight = landscape
maxWidth <= maxHeight = portrait
0
11
59
#Flutter
and
#Firebase
Tip:
I somehow just discovered this today but...
You can use the flutterfire command line tool to easily install Firebase across all of your supported platforms.
🍎🤖💻📱
#FlutterCommunity
#FlutterDev
@FlutterFireDev
1
18
52
#Flutter
Tip:
You can combine EdgeInset values using the add() method. This is especially useful when you have constant EdgeInset values that are used throughout your app.
#FlutterDev
#FlutterCommunity
#dartLang
3
15
55
flutter_fast_cli v1.1.0 is up!
✅ Appwrite Support
✅ Shorebird Fastlanes
✅ `fast build` command
The goal is to build fully-featured Flutter apps in less than 24 hours. What else should we add?
9
5
56
Daily
#Flutter
/Dart Tip ☀️
You can update a single key in a Map using the update() method. This fails if the key doesn't exist ("Key not in map")
To prevent this, provide an ifAbsent function inside of update(). If a key doesn't exist, this lets you can add it
#flutterDev
2
3
53
1
7
52
Friendly reminder for
#Flutter
devs 🪃
Your domain layer should be written in pure dart (see 20:24 onward)
This makes testing and maintaining your code a whole lot easier than if your UI and domain code were tangled.
3
7
52
You no longer need an extra dependency when adding Apple Sign In to your
#Flutter
apps.
Firebase Auth has all you need as of Aug 23, 2022 🔥
0
4
49
