As the time am asking this question, is there any official or an update that enables me to remove the # symbol in the flutter web app url.
I have seen some work arounds to achieve this but they end up causing other issues like: people not able to access the webpage without the hash # in the url
From this answer
There is a package call url_strategy in pub.dev. You only need to import in into pubspec.yaml and copy the code below into your main.dart file. It will remove the # in your flutter web URL
import 'package:url_strategy/url_strategy.dart';
void main() {
// Here we set the URL strategy for our web app.
// It is safe to call this function when running on mobile or desktop as well.
setPathUrlStrategy();
runApp(MyApp());
}
Related
Supabase provides supabase-dart for non-flutter applications and provides supabase-flutter for flutter applications. (The pubspec in supabase-flutter apears to use the supabase-dart package.)
I have dart code files that comprise a data access layer (for the postgres db) written for supabase. I'd like to share the dart code files between a non-flutter, server written in dart and a mobile app that of course is in flutter.
The imports in each code file of the flutter app all use:
import 'package:supabase_flutter/supabase_flutter.dart';
So, I didn't necessarily want to bring those code files into the non-flutter, dart server because they use supabase_flutter.
I have the exact same code files in the non-flutter, dart server but I replaced the imports with:
import 'package:supabase/supabase.dart';
And, it works fine, but I have to maintain two versions of essentially the same file.
For these shared files, is it ok to just use the non-flutter import in both the flutter and non-flutter apps?
(I have tried some combinations of this and things seem to work, but I don't know if there is something I need to be concerned about on this since the docs say to use one package for flutter and the other for non-flutter.)
For these shared files, is it ok to just use the non-flutter import in both the flutter and non-flutter apps?
Short answer yes.
supabase_flutter package is just supabase package wrapped with some Flutter specific code mainly to bring auth persistence, so you should be fine importing supabase package for some common pieces!
I'm building a desktop application, mainly for Windows platform. I want to track events like create, delete in a directory using flutter. I came across the FileSystemEntity.watch() method but I'm unable to implement that. Can someone share the full example codebase for watching a directory?
Just watch the folder to receive a stream of events. Normally, you then listen to the stream to receive each event as it happens.
import 'dart:io';
void main() {
final tempFolder = File('D:\\temp');
tempFolder.watch().listen((event) {
print(event);
});
}
Prints:
FileSystemCreateEvent('D:\temp\New Text Document.txt')
FileSystemMoveEvent('D:\temp\New Text Document.txt', 'D:\temp\foo.txt')
FileSystemCreateEvent('D:\temp\New folder')
FileSystemMoveEvent('D:\temp\New folder', 'D:\temp\bar')
FileSystemDeleteEvent('D:\temp\bar')
FileSystemDeleteEvent('D:\temp\foo.txt')
for the creation, rename and deletion of a plain file and folder.
(You tagged the question as Flutter Web even though you are on desktop. You obviously cannot use dart:io in web.)
I have flutter application which uses different webview plugin for each platform(mobile, web, window).
Though I am able to import platform base on web and mobile, I am not able to import for windows.
I have tried adding else condition if it is not mobile or web, but it is taking mobile plugin.
This is how I import package for web and mobile (Working).
import 'package:eam_flutter/form/mobileui.dart'
if (dart.library.html) 'package:eam_flutter/form/webui.dart'
as multiPlatform;
This is how I import package for web, mobile and windows (Not Working, it is showing mobile webview exception since it doesn't support desktop).
import 'package:eam_flutter/form/windowui.dart'
if (dart.library.html) 'package:eam_flutter/form/webui.dart'
if (dart.library.io) 'package:eam_flutter/form/mobileui.dart'
as multiPlatform;
How can I specify conditional imports for windows?
For anyone else finding this, note that the accepted answer is not an answer to the question that was asked. The answer to the question that was asked is that you cannot. There is no way to use conditional imports to get different behavior between mobile and desktop; see this comment from the Dart team.
Since there is no conditional import support for window since it comes under dart io.
I have this workaround and found it working.
I end up creating file for each platform with different package import.
import 'package:flutter/foundation.dart' show kIsWeb;
import 'dart:io' as io;
if(kIsWeb){
{
return WebPage(); //your web page with web package import in it
}
else if (!kIsWeb && io.Platform.isWindows) {
return WindowsPage(); //your window page with window package import in it
}
else if(!kIsWeb && io.Platform.isAndroid) {
return AndroidPage(); //your android page with android package import in it
}
//you can add others condition...
Maybe we no longer need conditional import.
Look at the code below:
import 'package:package1/package1.dart';
import 'package:package2/package2.dart';
const keepFunc1 = bool.fromEnvironment('KEEP_FUNC1');
dynamic result2;
void main() {
if (keepFunc1) {
result2 = Calculator1()..addOne(1);
} else {
result2 = Calculator2()..addOne(1);
}
runApp(const MyApp());
}
If KEEP_FUNC1 environment variable is not specified to true. The package1 and the class Caculator1 won't be packaged into apk or ipa.
For more details, see the answer I wrote here.
So we can import all packages and use a const environment value to decide what packages to import. The tree-shaking mechanism is smart enough to remove unused parts.
Check this example
you need to create 2 files one for web & another for os and use condition on import
There are three types that are present on the lib 'package:flutter/foundation.dart' that I need to use in an environment without Flutter. They are: ByteData, ReadBuffer and WriteBuffer. Is it possible to use these classes without having the whole Flutter as dependency?
The reason why I need to use it in an environment without Flutter is because I have a server made using Dart and I need to use these classes to encode/decode my socket messages.
Thanks in advance!
If you want access to classes in package:flutter/foundation.dart you can create a new flutter project as normal and remove runApp() from main() like this:
void main() {
print("This is now a console only program")
//no runApp(new MaterialApp())
}
This code won't start any mobile app and doesn't need an emulator, just a console. I have done some projects only with Dart and you can use all non UI Material Classes, such as File, StringBuffer...
Note: Remember to add the path for dart in the system environment variables, in my case D:\APPS\flutter\bin\cache\dart-sdk\bin, then you can navigate to your flutter project and type dart lib/main.dart in the console to run the code
I am trying to make an anime app using Flutter. For that I needed an REST API but I fortunately found a dart API. The problem is I cannot understand how to incorporate it in my app. This would really help me reduce the work load.
I am attaching the github link.
https://github.com/charafau/jikan-dart
If you are talking about how to include a package in your flutter Application, then you need to do the following:
add the package dependencies in the pubspec.yaml file
Get the package by running pub get
and then import the packages in your app using import
steps by step instructions also available here: https://dart.dev/guides/packages
also if you check the utilization of the API in the example code, you can find this example:
import 'package:jikan_dart/jikan_dart.dart';
main() async {
var jikanApi = JikanApi();
var top = await jikanApi.getTop(TopType.manga, page: 2);
print('result $top');
}