Skip to content
0:00 / 0:00

#flutter#responsiveui#dart

Flutter Responsive UI: WhatsApp Clone

Rivaan Ranawat

87K subscribers • 5 videos on Hallway

YouTube
  • Recommended by 1 person: 1 in engineering communities.
  • Presented by Rivaan Ranawat
  • Linked in the descriptionRivaanRanawat/whatsapp-flutter-ui
  • May be out of date. The tools, versions or practices it shows have likely moved on.

Intermediate. Assumes working knowledge.

68K views4 years ago1 recommendation

Mobile developmentWeb developmentFlutter and React NativeVue, Svelte, Angular and others

Rivaan Ranawat demonstrates how to build a responsive WhatsApp clone that adapts to mobile, web, and desktop screens using Flutter.

Learn how to build completely Responsive Flutter Apps- Android, iOS, Web & Desktop by Building WhatsApp Clone! This Build works as WhatsApp App on Smaller Screen Sizes and WhatsApp Web on Bigger Screen Sizes! #flutter #ui #responsive Source Code: github.com/RivaanRanawat/whatsapp-flutter-ui/tree/main Demo: hungry-lichterman-63f0f3.netlify.app/#/ Important Links: colors.dart File- github.com/RivaanRanawat/whatsapp-flutter-ui/blob/main/lib/c… info.dart File - github.com/RivaanRanawat/whatsapp-flutter-ui/blob/main/lib/i… Chat Background Image - github.com/RivaanRanawat/whatsapp-flutter-ui/blob/main/asset… Flutter on Desktop - flutter.dev/multi-platform/desktop Time Stamps: () Demo & Intro () Setting Up The Project () Displaying Mobile AppBar () Displaying Mobile Contacts List () Displaying Web Contacts List () Displaying Web Profile Bar () Displaying Web Search Bar () Displaying Web Chat App Bar () Displaying Chat List on Web () Displaying Web Chat Input () Displaying Mobile Chat Screen () Hosting Website on Netlify Connect With Me Here: instagram.com/optimalcoding namanrivaan@gmail.com github.com/rivaanranawat namanrivaan.medium.com

Why it's here

1 person recommends this

u/OSetupsin r/FlutterDev • Recommends

Learn Flutter Responsive UI by Building WhatsApp Clone