Flutter says ImageElement isn't defined - flutter

Tried to run the application using flutter run -d linux command.
I have imported 'dart:html' and have it in pubspec.yaml, also did pub clean and pub get:
dependencies:
flutter:
sdk: flutter
http: ^0.13.5
# The following adds the Cupertino Icons font to your application.
# Use with the CupertinoIcons class for iOS style icons.
cupertino_icons: ^1.0.2
html: ^0.15.1
flutter_image: ^4.1.4
webview_flutter: ^3.0.4
widgets: ^1.4.5
But flutter gives an error:
ERROR: lib/main.dart:21:12: Error: The method 'ImageElement' isn't defined for the class 'MyApp'.
ERROR: - 'MyApp' is from 'package:test/main.dart' ('lib/main.dart').
ERROR: Try correcting the name to the name of an existing method, or defining a method named 'ImageElement'.
ERROR: (int _) => ImageElement()..src = imageUrl,
This is the peace of code with ImageElement:
import 'dart:html';
import 'package:flutter/material.dart';
//import 'dart:ui' as ui;
import 'dart:ui' as ui;
const Color darkBlue = Color.fromARGB(255, 18, 32, 47);
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
String imageUrl =
"https://www.nasa.gov/centers/jpl/images/content/756230main_pia08329-full.jpg";
ui.platformViewRegistry.registerViewFactory(
imageUrl,
(int _) => ImageElement()..src = imageUrl,
);
return HtmlElementView(viewType: imageUrl);
}
}

Related

Dart Error: error: import of dart:mirrors is not supported in the current Dart runtime - Using Hive Flutter with 2 Hive Boxes

Working on app that uses 2 Hive boxes in Flutter. My first time trying and after I made many changes I began getting error messages on launch:
[VERBOSE-2:shell.cc(89)] Dart Error: error: import of dart:mirrors is not supported in the current Dart runtime
[VERBOSE-2:dart_isolate.cc(144)] Could not prepare isolate.
[VERBOSE-2:runtime_controller.cc(389)] Could not create root isolate.
[VERBOSE-2:shell.cc(605)] Could not launch engine with configuration.
Error happens when launching main
import 'package:app/main_thing/main_thing_model.dart';
import 'package:app/respect_time/task.dart';
import 'package:flutter/material.dart';
import 'package:app/welcome_screen.dart';
import 'package:flutter/services.dart';
import 'package:google_fonts/google_fonts.dart';
import 'package:hive_flutter/hive_flutter.dart';
void main() async {
WidgetsFlutterBinding.ensureInitialized();
SystemChrome.setPreferredOrientations([DeviceOrientation.portraitUp]);
await Hive.initFlutter();
Hive.registerAdapter(MainThingModelAdapter());
await Hive.openBox<MainThingModel>('main_thing');
Hive.registerAdapter(TaskAdapter());
await Hive.openBox<Task>('to_do_box');
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
// This widget is the root of your application.
#override
Widget build(BuildContext context) {
return MaterialApp(
home: WelcomeScreen(),
);
}
}
Here are my dependancies, which seem to be causing this error for others:
dependencies:
flutter:
sdk: flutter
cupertino_icons: ^1.0.2
google_fonts: ^3.0.1
flutter_local_notifications: ^9.7.0
intl: ^0.17.0
timezone: ^0.8.0
flutter_native_timezone: ^2.0.0
hive_flutter: ^1.1.0
hive: ^2.2.3
equatable: ^2.0.3
dev_dependencies:
flutter_test:
sdk: flutter
flutter_lints: ^2.0.0
hive_generator: ^1.1.3
build_runner: ^2.2.0
Any help identifying issue is greatly appreciated.

pub.dev - my package not showing platforms correctly (web missing)

I developed a flutter package multi_image_picker_view:
https://pub.dev/packages/multi_image_picker_view
This package depends on file_picker and flutter_reorderable_grid_view, they both support the Web. But in my package, web option is not visible in pub.dev. Even this package works fine on the web.
👉Help me to figure out why WEB is not showing on pub.dev.
📜My pubspec.yaml
name: multi_image_picker_view
description: A complete widget that can easily pick multiple images from a device and display them in UI. Also picked image can be re-ordered and removed easily.
version: 0.0.6
homepage: https://github.com/shubham-gupta-16/multi_image_picker_view
repository: https://github.com/shubham-gupta-16/multi_image_picker_view
issue_tracker: https://github.com/shubham-gupta-16/multi_image_picker_view/issues
environment:
sdk: ">=2.17.1 <3.0.0"
flutter: ">=1.17.0"
dependencies:
flutter:
sdk: flutter
flutter_reorderable_grid_view: ^3.1.3
file_picker: ^5.0.1
dev_dependencies:
flutter_test:
sdk: flutter
flutter_lints: ^2.0.0
flutter:
assets:
- packages/multi_image_picker_view/assets/close-48.png
👨‍💻Commands I used to publish
flutter pub publish
🗃️My Matchine Info
Flutter Version: 3.0.1
Channel: Stable
Dart Version: 2.17.1
IDE: Android Studio Chipmunk | 2021.2.1 Patch 1
🚀You can find the complete code Github:
https://github.com/shubham-gupta-16/multi_image_picker_view
Thank you in advance.
Conditional import required
The reason why this package is not showing Web on pub.dev is that it uses dart.io without conditional import.
To fix this, I separated the file where it is used. One for web and one for non-web platforms. Then import them by using conditions based on the running platform.
web_preview.dart
import 'package:flutter/material.dart';
import '../image_file.dart';
class ImagePreview extends StatelessWidget {
final ImageFile file;
const ImagePreview({Key? key, required this.file}) : super(key: key);
#override
Widget build(BuildContext context) {
return ClipRRect(
borderRadius: BorderRadius.circular(4),
child: Image.memory(
file.bytes!,
fit: BoxFit.cover,
errorBuilder: (context, error, stackTrace) {
return const Center(child: Text('No Preview'));
},
),
);
}
}
non_web_preview.dart
import 'dart:io'; // here I imported dart:io
import 'package:flutter/material.dart';
import '../image_file.dart';
class ImagePreview extends StatelessWidget {
final ImageFile file;
const ImagePreview({Key? key, required this.file}) : super(key: key);
#override
Widget build(BuildContext context) {
return ClipRRect(
borderRadius: BorderRadius.circular(4),
child: Image.file(
File(file.path!), // Now I can use File class
fit: BoxFit.cover,
),
);
}
}
my_package_file.dart
...
import 'non_web_preview.dart' if (dart.library.html) 'web_preview.dart'; // conditional import
class MyPackageFile extends StatelessWidget {
...
#override
Widget build(BuildContext context) {
return ImagePreview(file: imageFile); // Using ImagePreview class
}
}

Google Maps Place Picker package Error in Flutter

I am getting a huge list of error when I try to run the following code with google_maps_place_picker package in flutter.
import 'package:flutter/material.dart';
// import 'package:google_maps/google_maps.dart';
import 'package:google_maps/google_maps.dart';
import 'package:google_maps_place_picker/google_maps_place_picker.dart'
as place;
// import 'package:location/location.dart';
import '../components/location_helper.dart';
// import '../components/location_helper.dart';
class MapScreen extends StatelessWidget {
final LatLng location1 = LatLng(37.657, -122.776);
#override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Map Screen'),
),
body: Center(
child: place.PlacePicker(
apiKey: GOOGLE_API,
useCurrentLocation: true,
onPlacePicked: (result) {
print(result.addressComponents);
Navigator.of(context).pop();
}),
));
}
}
Error
5:8: Error: Not found: 'dart:html' import 'dart:html' show Document,
Element, Node;
Error: Not found: 'dart:js' export 'dart:js' show allowInterop,
allowInteropCaptureThis;
Error: Not found: 'dart:js_util' export 'dart:js_util';
Error: Type 'Element' not found.
Element mapDiv, [
^^^^^^^
Error: Type 'Node' not found. List<MVCArray> get controls =>
^^^^
Error: Type 'Element' not found. Element _getDiv() =>
callMethod(this, 'getDiv', []); ^^^^^^^
These are just some of the errors I have put. There are MANY more like these.
I have added these dependencies in my pubspec.yaml file.
google_maps_flutter: ^1.2.0
geodesy: ^0.3.2
confirm_dialog: ^0.1.1
geocoding: ^1.0.5
geocoder: ^0.2.1
google_maps_place_picker: ^1.0.1
tuple: ^1.0.3
js: ^0.6.2
html: ^0.14.0+4
You are using import 'package:google_maps/google_maps.dart';
google_maps package only supports web. For mobile support should try out flutter_google_places, google_maps_flutter or any other package.

Flutter Hive package initialisation error

I tried use Hive package in my application. But when I initialised in my app get error message:
The following HiveError was thrown building MyApp(dirty): Box not
found. Did you forget to call Hive.openBox()?
Her is my code:
import 'package:flutter/material.dart';
import 'package:hive/hive.dart';
import 'package:hive_flutter/hive_flutter.dart';
import 'dart:io';
import 'package:path_provider/path_provider.dart' as path_provider;
void main() async {
WidgetsFlutterBinding.ensureInitialized();
final appDocDir = await path_provider.getApplicationDocumentsDirectory();
Hive.init(appDocDir.path);
runApp(MyApp());
final box = await Hive.openBox('storage');
}
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
final box = Hive.box('storage');
return MaterialApp(
title: 'Test App',
debugShowCheckedModeBanner: false,
home: CheckAuth(),
);
}
}
class CheckAuth extends StatefulWidget {
#override
_CheckAuthState createState() => _CheckAuthState();
}
class _CheckAuthState extends State<CheckAuth> {
#override
Widget build(BuildContext context) {
return Scaffold(
body: Text('Hive initialised!'),
);
}
}
Emulator
API: 28
Android: 9
Packages
environment:
sdk: ">=2.7.0 <3.0.0"
dependencies:
flutter:
sdk: flutter
hive: ^1.4.4+1
hive_flutter: ^0.3.1
http: ^0.12.2
cupertino_icons: ^1.0.0
path_provider: ^1.6.24
dev_dependencies:
flutter_test:
sdk: flutter
hive_generator: ^0.8.2
build_runner: ^1.10.11
flutter:
uses-material-design: true
Where I have any error in my code?
Why don't you use await Hive.initFlutter() instead of Hive.init()? The former is supposed to take care of proper app folder path on specific platform and put it's files there.
It is part of package:hive_flutter/hive_flutter.dart which deals with Flutter specific stuff

When assembleDebug Out of Memory error is thrown

So I'm new to flutter and dart.I've made multiple android apps and I am pretty familiar with coding but I just can't get to know flutter. I use Android Studio as Ide and when I try to compile my code , on the assembleDebug part, This error is thrown:
c:\b\s\w\ir\k\src\third_party\dart\runtime\vm\zone.cc: 54: error: Out
of memory.
version=2.4.0 (Wed Jun 19 11:53:45 2019 +0200) on "windows_x64"
thread=1336, isolate=main(0000029506C2CDE0)
pc 0x00007ff7b33d2b1b fp 0x000000d10cbfb0a0 Unknown symbol
-- End of DumpStackTrace
For now, I haven't done anything to fix the problem because I don't know why
main.dart
import 'package:flutter/material.dart';
import 'constants.dart';
import 'package:flutter_svg/flutter_svg.dart';
void main() {
runApp(UnitConverterApp());
}
//on create
class UnitConverterApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'Distivity Todolist',
theme: Constants.getTheme(),
home: CategoryRoute(),
);
}
}
class CategoryRoute extends StatefulWidget {
const CategoryRoute();
#override
_CategoryRouteState createState() => _CategoryRouteState();
}
class _CategoryRouteState extends State<CategoryRoute> {
/// Function to call when a [Category] is tapped.
void _onCategoryTap() {
setState(() {
});
}
#override
Widget build(BuildContext context) {
return Center(
child: InkWell(
onTap: () => _onCategoryTap(),
child: SvgPicture.asset(
Constants.add,
semanticsLabel: 'ad'
),
)
);
}
}
constants.dart
import 'package:flutter/material.dart';
class Constants{
static ThemeData getTheme(){
return ThemeData(
primaryColor: colorSwatch,
);
}
static const primaryColor = 0xff4FB484;
static ColorSwatch colorSwatch = ColorSwatch(primaryColor, const<String,Color>{
"primary_color": Color(primaryColor),
"primary_dark":Color(0xff306D50),
"black_16": Color(0xff161616),
"black_20":Color(0xff202020),
"the_blackest":Color(0xff000000),
"color_white":Color(0xffF7F7F7),
"the_whitest":Color(0xffffffff)
});
static const String add = 'assets/add.svg';
}
pubspec.yaml
name: distivity_todolist
description: A new Flutter application.
https://developer.apple.com/library/archive/documentation/General/Reference/InfoPlistKeyReference/Articles/CoreFoundationKeys.html
version: 1.0.0+1
environment:
sdk: ">=2.1.0 <3.0.0"
dependencies:
flutter:
sdk: flutter
cupertino_icons: ^0.1.2
dev_dependencies:
flutter_svg: 0.13.1
flutter_test:
sdk: flutter
flutter:
uses-material-design: true
assets:
- assets/add.svg