如何在 FLUTTER 中设置一个按钮以重定向到我的地图？
Posted
技术标签:
【中文标题】如何在 FLUTTER 中设置一个按钮以重定向到我的地图？【英文标题】：how can i set a button to redirect to my map in FLUTTER? 【发布时间】：2021-04-22 15:49:15 【问题描述】：我仍然是 Flutter 的初学者，我正在开发一个应用程序，但我遇到了一个问题：
这是我的 main.dart：
void main() => runApp(MyApp());
class MyApp extends StatelessWidget
final geoService = GeolocatorService();
@override
Widget build(BuildContext context)
return FutureProvider(
create: (context) => geoService.getCurrentPosition(),
child: MaterialApp(
debugShowCheckedModeBanner: false,
title: 'Metz Trip',
theme: ThemeData(
primarySwatch: Colors.red,
),
home:
Consumer<Position>(
builder: (context, position, widget)
return (position != null)
? Map(position)
: Center(child: CircularProgressIndicator());
,
),
),
);
你可以看到我的主页是一张地图，但问题是：我怎样才能设置一个按钮来重定向到这个页面？
例如，如果我重定向到 Map() 我有这个错误：
The return type 'Map<dynamic, dynamic>' isn't a 'Widget', as required by the closure's context.
这是我的地图页面：
class Map extends StatefulWidget
final Position initialPosition;
Map(this.initialPosition);
@override
State<StatefulWidget> createState() => _MapState();
class _MapState extends State<Map>
final GeolocatorService geoService = GeolocatorService();
Completer<GoogleMapController> _controller = Completer();
@override
void initState()
geoService.getPositionStream().listen((position)
centerScreen(position);
);
super.initState();
@override
Widget build(BuildContext context)
return Scaffold(
body: Stack(
children: <Widget>[
GoogleMap(
initialCameraPosition: CameraPosition(
target: LatLng(widget.initialPosition.longitude,
widget.initialPosition.latitude),
zoom: 13.0),
mapType: MapType.normal,
myLocationEnabled: true,
onMapCreated: (GoogleMapController controller)
_controller.complete(controller);
),
Positioned(
top: 65.0,
right: 15.0,
left: 15.0,
child: Container(
height: 50.0,
width: double.infinity,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(30.0),
color: Colors.white),
child: TextField(
decoration: InputDecoration(
hintText: 'Votre recherche',
border: InputBorder.none,
contentPadding: EdgeInsets.only(left: 25.0, top: 15.0),
suffixIcon: IconButton(
icon: Icon(Icons.account_circle),
color: Colors.yellow[800],
onPressed: ()
Navigator.of(context).push(MaterialPageRoute(
builder: (context) => Connexion()));
/*onPressed: ()
return FutureBuilder<User>(
future: FirebaseAuth.instance.currentUser,
builder: (context, snapshot)
if (snapshot.hasData)
User user = snapshot.data;
return ProfilePage(uid: user.uid);
else
return Connexion();
,
);*/
,
iconSize: 32.0),
prefixIcon: IconButton(
icon: Icon(Icons.location_on),
color: Colors.grey,
onPressed: () ,
iconSize: 32.0)),
),
),
),
Positioned(
right: 0.0,
left: 0.0,
bottom: -20.0,
child: Container(
height: 50.0,
width: double.infinity,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(0.0),
color: Colors.grey[100].withOpacity(0.94)),
)),
Positioned(
right: 15.0,
left: 15.0,
bottom: 20.0,
child: Container(
height: 50.0,
width: double.infinity,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(7.0),
color: Colors.red[900].withOpacity(0.95)),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
IconButton(
icon: Icon(Icons.hotel),
color: Colors.white,
onPressed: () ,
),
IconButton(
icon: Icon(Icons.restaurant),
color: Colors.white,
onPressed: () ,
),
SizedBox(
width: 40,
),
IconButton(
icon: Icon(Icons.local_activity),
color: Colors.white,
onPressed: () ,
),
IconButton(
icon: Icon(Icons.museum),
color: Colors.white,
onPressed: () ,
),
],
),
),
),
],
),
floatingActionButton: FloatingActionButton(
backgroundColor: Colors.yellow[800],
onPressed: () ,
elevation: 15.0,
child: const Icon(
Icons.home,
color: Colors.white,
),
),
floatingActionButtonLocation: FloatingActionButtonLocation.centerFloat,
);
// ignore: missing_return
Future<Void> centerScreen(Position position) async
final GoogleMapController controller = await _controller.future;
controller.animateCamera(CameraUpdate.newCameraPosition(CameraPosition(
target: LatLng(position.latitude, position.longitude), zoom: 13.0)));
还有我的地理位置服务页面：
class GeolocatorService
Future<Position> getLastKnownPosition(
bool forceandroidLocationManager = false,
) =>
Geolocator.getLastKnownPosition(
forceAndroidLocationManager: forceAndroidLocationManager);
Future<Position> getCurrentPosition(
LocationAccuracy desiredAccuracy = LocationAccuracy.best,
bool forceAndroidLocationManager = false,
Duration timeLimit,
) =>
Geolocator.getCurrentPosition(
desiredAccuracy: desiredAccuracy,
forceAndroidLocationManager: forceAndroidLocationManager,
timeLimit: timeLimit,
);
Stream<Position> getPositionStream(
LocationAccuracy desiredAccuracy = LocationAccuracy.best,
int distanceFilter = 10,
bool forceAndroidLocationManager = false,
int timeInterval = 0,
Duration timeLimit,
) =>
Geolocator.getPositionStream(
desiredAccuracy: desiredAccuracy,
distanceFilter: distanceFilter,
forceAndroidLocationManager: forceAndroidLocationManager,
// ignore: deprecated_member_use
timeInterval: timeInterval,
timeLimit: timeLimit,
);
希望有人能帮帮我，谢谢大家。
【问题讨论】：
【参考方案1】：在这种情况下，您可以将页面名称称为“MapPage”会更好，但如果您坚持使用地图名称，您可以这样做：
import '../../models/map.dart' as MapPage;
那么你可以像这样简单地调用：
return (position != null)
? MapPage.Map(position)
: Center(child: CircularProgressIndicator());
我强烈建议更改名称，因为如果您与 Flutter 中的其他类命名相同，您将始终与 Flutter 冲突。
【讨论】：
感谢您的回答，但问题仍未解决：/ 那么我们需要更多信息。你能用地图页面编辑你的帖子吗 很好，你可以标记为已回答其他人看看是否遇到同样的问题@Quss【参考方案2】：感谢您的回答。
但是，当我将您给我的代码粘贴到我的按钮中时，我出现了 2 次此错误：
Undefined name 'position'.
Try correcting the name to one that is defined, or defining the name.
例如，如果我将其替换为
onPressed: ()
Navigator.of(context).push(
MaterialPageRoute(
builder: (position)
return (position != null)
? Map()
: Center(child: CircularProgressIndicator());
,
),
);
,
我没有任何错误，但是当我点击按钮时，它会返回带有type '_internallinkedhashmap string dynamic ' is not a subtype of type 'widget'的红屏
【讨论】：
以上是关于如何在 FLUTTER 中设置一个按钮以重定向到我的地图？的主要内容，如果未能解决你的问题，请参考以下文章
禁用 WKWebView 以打开链接以重定向到我的 iPhone 上安装的应用程序