Category: Software Development

• Shelf: Dart library that gives you a simple web server
• Dart Frog: A fast minimalistic backend for Dart
• ServerPod: Probably the most elaborate one, A base ready to deploy (Registration for example)
• Serveme:
• Alfred:

Bottom sheets are like toasts in the sense that they allow the user to keep doing what they are doing, but different, they are the notifications that appear at the bottom of the screen that a user can dismiss, they (like toasts) also don’t block the current screen

The global function (showBottomSheet or modalBottomSheet) expects a BuildContext and a WidgetBuilder. The modal displays over UI elements, so keep that in mind

the WidgetBuilder (That closure you should be familiar with from alerts for example, or a full fledged function definition, your choice) and the build context (you should have been passing around already by now) are straight forward, what is not is that a bottom sheet must be called with a context that contains a Scaffold. in other words, you’ll have to be “under” a scaffold widget… so to rephrase, it shows a Material Design bottom sheet in the nearest [Scaffold] ancestor

Now, to understand the problem, the context we are passing around as we put it in the last paragraph, belongs to the top-level widget, that widget has a scaffold obviously, but the scaffold is under it, when our bottom sheet wants to attach to a widget, using the of-context pattern to find the scaffold will fail as we are looking up the tree not down where the scaffold is !

This page is just a listing of all posts relating to dart and flutter on this blog, but instead of chronological order, this page puts things in logical order !

Detect platform in flutter

Server Backends in Dart

Sometimes, you need to know what operating system your flutter app is running on, most times for theming purposes, but sometimes for functionalities !

There are basically 2 popular ways to do this (3 popular methods if you are willing to use a package specifically to simplify theme issues !), let us assume we will be calling a certain method called _iosMethod if we are on iOS, and a _genericMethod if we are on any other platform

The most common use case is to determine whether to use Material or Cupertino, to give the application that native look the users are used to… in any case… here are the two methods

In both methods, we have a function called doStuff

Method 1

In the first method, we get the platform using the Theme (We must pass context to function) !
The ThemeData object has an enum called TargetPlatform… we will use that here

  void doStuff(BuildContext context) {
    final platform = Theme.of(context).platform;
    if (platform == TargetPlatform.iOS) {
      _iosMethod(context);
    } else {
      _genericMethod(context);
    }
  }

The possible options that can come out of this enum are (android, iOS, linux, macOS, windows, fuchsia)

Method 2

Here, we can simply start by importing (import ‘dart:io’ show Platform;), then use it directly

import 'dart:io' show Platform;
...
...
  void doStuff(BuildContext context) {
    if (Platform.isIOS) {
      _iosMethod(context);
    } else {
      _genericMethod(context);
    }
  }

Method 3

This time, we will be using the package (flutter_platform_widgets), this package is very useful for theming your application to have the look and feel of the default theme of the OS…

things become very simple with this package, all you need is the line

return PlatformElevatedButton(onPressed: onPressed, child: child);

This is just a summary of the tools you may or may not use for mobile development

Cross Platform

• Dart-Flutter
• React Native
• Kotlin Multiplatform (& compose-multiplatform ;))
• Ionic
• .NET MAUI, (Successor to Xamarin.Forms), develop in C#
• NativeScript: Build mobile apps with Angular, Vue.js, etc !

Android

• Android Studio
  Kotlin / Java
• Jetpack Compose : composable functions – define your app’s UI programmatically

iOS

• Xcode

This is an unstable post, I add comments here, then move them to their final destination on a separate post, posts are listed on the Dart/Flutter page, so it is completely normal for this post to be empty most of the time !

The reason I am interested in flutter is that it may just be the best option to accompany my RUST programs and fit them with relatively efficient front ends ! again, potentially the best fit FOR ME AND MY RUST PROJECT IDEAS

Final Result

Well, Yes, my own VSCODE with all my plugins etc… basically the same instance that runs on my computer on an Android or iOS device BROWSER ! I put this here at the beginning so that if this is not what you need, you don’t have to waste your time, but before you move on, think about it as an alternative since it works remotely too 😉 , if not, then move on… don’t waste your time here

What for

For my back pain, I want to be able to change my setting every few hours, and this enables me (With the help of a wireless mouse and keyboard” to use my android TV box, my ipad, and other screens around the house to keep working

Summary

So, I will get to the details, but in summary, you can install Visual Studio Code Server on the same machine that has your Visual Studio Code installed, then you open your VSCODE with a browser

It turned out that someone has already done this tutorial (Here), but i am keeping this post so that you can see the summary before you have to se the video

• Rocket: By far the most popular, has plenty of features to make your life easier
• Actix_web: The blazing fast framework
• Gotham
• Tide
• Warp

Not so complete, and some haven’t been maintained for some time

• Anansi: https://saru-tora.github.io/anansi

I run windows in KVM, and the QEMU android Emulator that ships with Android studio crashes all the time, so the obvious solution, with all those android devices I have is to connect a phone to android studio, It is faster and spares me the hassle of finding out why nested virtualization is so terrible

But having a phone connected via USB is not optimal, as i have to pick it up every time i want to run my under development software on it !

The answer seems to be in the

1- install Android WiFi ADB : A plugin easy to install in Android studio

2- A phone with Android 11 and above

So let us do this step by step

1. Download SDK platform-tools and install it (Copy it somewhere and add that to your system path)
2. Enable developer options on the phone (Keep tapping build number)
3. From developer options, Enable wireless debugging
4. Select Pair device with pairing code. Take note of the pairing code, IP address, and port number displayed on the device (see the above image).
5. Open the command prompt and run the command adb pair ipaddr:port
   adb pair 192.168.7.101:45353
   Enter pairing code: xxxxxx
   daemon not running; starting now at tcp:5037
   daemon started successfully
   Successfully paired to 192.168.7.101:45353 [guid=adb-RF8M4xxxxxxx-xxxxxxx]
6. Now, to have it appear as a device in android studio… Go to wireless debugging and notice the port number, then using that IP and port, use the following command
   adb connect 192.168.7.101:35127
7. Recommended: Install the “Android WiFI ADB” plugin in android studio

Note: The Pairing port is not the same as the connection port ! so pay attention to that

The official VSCODE extension for rust is called (rust-analyzer) by rust-lang.org

To install rust, All you need is the installer, you can get it from rustup.rs, it might fire up a visual studio installer for the builder if you are running windows…

So, to check that you have rust installed on your computer, You may want to run the following command

rustc --version

In my case, it responds with (rustc 1.77.0 (aedd173a2 2024-03-17))

To update rust, you will need to run the commadn

rustup update

If you want to create a new rust project you CD into a directory where you want the project to be, and issue the command

cargo new projectname

Now, you can open the projectname directory in VSCODE to start working on a project (Right click, open terminal, then run the command ” code . “) the dot means current directory

If at any time you want to update the dependancies in your project, you can simply issue the command

cargo update

from within the project directory, this should update the cargo.lock file etc….

To add libraries to cargo, visit crates.io and you can get the names of the libraries you can add to Cargo.toml