Posts

How to Cluster Markers on Google Maps using Flutter

Image
  Map Clusters If you’re using Google Maps to display markers on your Flutter app, I’m sure that you will eventually need to cluster those markers. You don’t want users to zoom out and see hundreds of markers spamming the map right? Well, as I’m sure you know by now, that feature isn’t supported yet by the official Google Maps package. Check this issue to know more. Rest assured though because I’ve got a solution that might work for you. Fluster Package Comes to the Rescue In your search for solutions, you probably bumped into the Fluster package. This package uses a Dart port of supercluster and works really well, but how do you use it on your Flutter project? The readme is very brief, doesn’t explain much and the example isn’t even a Flutter project. This makes the package very easy to overlook unless you find this demo project by the package author, but even with this code, you will struggle to understand how to use it in your project. At least I did. Again, there ...

Top 10 Array utility methods you should know (Dart)

As part of my venture into client-side application development with Dart , I began exploring the way one could go about working with Lists or Array types. Aside from the documentation being comprehensive, I was also able to find support on the StackOverflow community and successfully achieved what was needed. → Continue reading on my blog In today’s article we’ll be looking at the “batteries-included” notion of Dart, in particular the inbuilt utilities for working with Lists. I’ve hand-picked 10 of the most common ones you show know for your next app. I’ve also prepared the example snippets so you could play with those yourself 😁 So, shall we begin? 1. forEach() Runs a function on each element in the list var fruits = [‘banana’, ‘pineapple’, ‘watermelon’]; fruits . forEach((fruit) => print(fruit)) ; // => banana pineapple watermelon 2. map() Produces a new list after transforming each element in a given list var mappedFruits = fruits.map((fruit) => ‘I love $fruit’) .toL...

Flutter: Provider Architecture Part 1

Image
Trong quá trình phát triển một phần mềm di động có tính mở rộng cao, các nhà phát triển thường hay chọn cho mình một kiến trúc (State management) phù hợp để triển khai ứng dụng. Hiện tại trong thế giới phát triển phần mềm cho di động, website, desktop… có rất nhiều các kiến trúc được các công ty, nhà phát triển đưa ra. Phổ biến như N-layer, MVP, MVVM… Về phía Flutter củng không kém cạnh khi củng được Google và các bên thứ ba phát triển một số kiến trúc như là ScopeModel, Rxdart, Redux, MobX, BloC, Provider. Provider là một package do cộng đồng phát triển, rất gần với Scope model nhưng đơn giản, mạnh mẽ hơn và được chính Google khuyến khích sử dụng. Trong bài viết này (part-1), mình sẽ giới thiệu Provider cho Flutter App Nội dung: 1) Pragmatic State Management sử dụng Provider Cài đặt Provider package vào flutter project Vào trong file pubspec.yaml dependencies: flutter: sdk: flutter provider: ^4.0.2 Chạy lệnh “flutter pub get” để update các dependencies: Page và P...