'can I use the HTML widget to parse a google maps embed?
I am trying to put a google map in my application using flutter so I tried to use the HTML widget to parse an iframe
that holds the embed link from google maps even tho I am using an iframe
the emulator keeps telling me to use an iframe
.
That is my code:
import 'package:flutter/material.dart';
import 'package:flutter_html/flutter_html.dart';
import 'package:login/components/isFav_button.dart';
import 'package:login/constants.dart';
class Body extends StatelessWidget {
@override
Widget build(BuildContext context) {
final Size size = MediaQuery.of(context).size;
return SingleChildScrollView(
scrollDirection: Axis.vertical,
child: Column(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.center,
children: [
Stack(
children: [
Image.asset(
'assets/images/cheeseCake.jpg',
fit: BoxFit.cover,
),
Positioned.fill(
child: Align(
alignment: Alignment.topRight,
child: FavoriteButton(),
))
],
),
Text(
'Description',
style: TextStyle(
fontSize: 24,
fontWeight: FontWeight.w600,
fontFamily: 'Proxima',
shadows: [
Shadow(
offset: Offset(3, 3),
blurRadius: 3,
color: navyBlue.withOpacity(0.5))
]),
),
Padding(
padding: const EdgeInsets.only(left: 8, right: 6),
child: Text(
'Look no further for a creamy and ultra smooth classic cheesecake.' +
'\nPaired with a buttery graham cracker crust, no one can deny it' +
's simple decadence.',
style: TextStyle(
color: Colors.black,
fontSize: 18,
fontFamily: 'Proxima',
fontWeight: FontWeight.w600,
),
),
),
SizedBox(
height: size.height * 0.01 / 2,
),
Text(
'Location',
style: TextStyle(
fontSize: 24,
fontWeight: FontWeight.w600,
fontFamily: 'Proxima',
shadows: [
Shadow(
offset: Offset(3, 3),
blurRadius: 3,
color: navyBlue.withOpacity(0.5))
]),
),
Html(
data:
'''<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3453.6684889591766!2d31.232986914593635!3d30.046367225437855!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x1458418bb92b5ad9%3A0xe0a4c8f95a81ac3!2zTGEgcG9pcmUgQ2FmZSDZhNin2KjZiNin2LE!5e0!3m2!1sen!2seg!4v1626118298155!5m2!1sen!2seg"
width="600"
height="450"
style="border:0;"
allowfullscreen=""
loading="lazy">
</iframe>''',
),
],
),
);
}
}
and this is the output:
this is my dependencies:
dependencies:
flutter:
sdk: flutter
flutter_html: ^2.1.0
webview_flutter: ^2.0.4
cupertino_icons: ^1.0.2
flutter_svg: ^0.22.0
the debug console:
E/BufferQueueProducer(16410): [SurfaceTexture-0-16410-3] setAsyncMode: BufferQueue has been abandoned
E/BufferQueueProducer(16410): [SurfaceTexture-0-16410-3] cancelBuffer: BufferQueue has been abandoned
3
W/zygote (16410): Attempt to remove non-JNI local reference, dumping thread
I/chatty (16410): uid=10084(com.example.login) identical 1 line
5
W/zygote (16410): Attempt to remove non-JNI local reference, dumping thread
so is it even possible to use a google maps embed the way I am trying to use it?
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
Solution | Source |
---|