使用谷歌地图的两个屏幕返回应用程序的问题

Posted 2023-03-28

技术标签:

【中文标题】使用谷歌地图的两个屏幕返回应用程序的问题【英文标题】：Problems with returning to App using two Screens with Google Maps 【发布时间】：2019-12-13 02:52:18 【问题描述】：

似乎是 Flutte 谷歌地图的一个更严重的错误。与#25653 重复

8 月 8 日更新：当前进度：

尝试使用 Sukhi 修复该错误，但他无法重现该错误。我的同事都能够重现它，但无法修复它：P。有没有其他人设法复制它？

还创建了一个github repo with my code 并更新了“到目前为止我尝试过的内容”

8 月 5 日更新，越来越接近真正的问题

问题说明：

我的问题只发生在真实设备（不是模拟器）上的IOs上debug和release。

我确实使用带有一些标记的谷歌地图小部件。点击标记会打开另一个屏幕，其中包含更多信息、另一个谷歌地图小部件以及通过 url 启动器导航的可能性。（我将屏幕缩小为仅显示导致问题的小部件）

从此屏幕离开应用（例如通过点击开始导航或转到 IO 主屏幕）然后返回应用会导致问题。

如果我再次返回 App 主屏幕，则只显示白屏。

补充：

将 Google 地图小部件包装在 Flex 小部件（列或行）中的信息屏幕中甚至会导致更糟糕的行为。返回应用程序主屏幕时，Flex Widget 的其他内容（例如带有文本的容器）将保持可见。

到目前为止我试图让它工作但没有工作：

发布模式 => 同样的问题禁用导航转换 (like this) 异步等待 url 启动以 IO 12.3 和 12.4 为基础在 Future Builder 中构建地图小部件

重现步骤：

安装google_maps_flutter 0.5.20+1和url_launcher: 5.0.3（我知道它不是最新的，但这不是问题）

在 Flutter 项目中复制 CodeSnippet 并在 IO 上构建。

点击标记

代码：

import 'package:flutter/material.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';
import 'package:url_launcher/url_launcher.dart';
import 'dart:io';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget 
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) 
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      initialRoute: "/",
      routes: 
        "/": (context) => HomePage(),
      ,
    );
  


class HomePage extends StatelessWidget 
  @override
  Widget build(BuildContext context) 
    return Scaffold(
      body: GoogleMap(
        initialCameraPosition: CameraPosition(
          target: const LatLng(47.6, 8.8796),
          zoom: 7,
        ),
        markers: Set<Marker>()
          ..add(
            Marker(
              markerId: MarkerId('hi'),
              position: LatLng(47.6, 8.8796),
              consumeTapEvents: true,
              onTap: () 
                Navigator.push(
                  context,
                  MaterialPageRoute(builder: (context) => InfoScreen()),
                );
              ,
            ),
          ),
      ),
    );
  


class InfoScreen extends StatelessWidget 
  @override
  Widget build(BuildContext context) 
    return Scaffold(
      appBar: AppBar(title: Text("info Page"),),
      body: GoogleMap(
        initialCameraPosition: CameraPosition(
          target: const LatLng(47.6, 8.8796),
          zoom: 7,
        ),
        markers: Set<Marker>()
          ..add(
            Marker(
              markerId: MarkerId('hi2'),
              consumeTapEvents: true,
              position: LatLng(47.6, 8.8796),
              onTap: () 
                if (Platform.isios) 
                  launch('https://maps.apple.com/?q=47.6,8.8796');
                 else 
                  launch(
                      'https://www.google.com/maps/search/?api=1&query=47.6,8.8796');
                
              ,
            ),
          ),
      ),
      bottomNavigationBar: BottomAppBar(
        elevation: 0,
        child: Container(
          padding: const EdgeInsets.symmetric(vertical: 19, horizontal: 25),
          height: 80,
          child: InkWell(
            onTap: () 
              if (Platform.isIOS) 
                launch('https://maps.apple.com/?q=47.6,8.8796');
               else 
                launch(
                    'https://www.google.com/maps/search/?api=1&query=47.6,8.8796');
              
            ,
            child: Text(
              'START NAVIGATION',
              style: TextStyle(
                letterSpacing: 0.35,
                fontWeight: FontWeight.w600,
              ),
            ),
          ),
        ),
      ),
    );

扑医生：

dynClient36:flutter_app mhein$ flutter doctor
Doctor summary (to see all details, run flutter doctor -v):
[✓] Flutter (Channel stable, v1.7.8+hotfix.4, on Mac OS X 10.14.5 18F132, locale de-DE)

[✓] android toolchain - develop for Android devices (Android SDK version 28.0.3)
[✓] Xcode - develop for iOS and macOS (Xcode 10.2.1)
[✓] iOS tools - develop for iOS devices
[✓] Android Studio (version 3.4)
[✓] VS Code (version 1.36.1)
[✓] Connected device (2 available)

• No issues found!
dynClient36:flutter_app mhein$

info plist

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE plist PUBLIC "-//Apple//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd">
<plist version="1.0">
<dict>
    <key>CFBundleDevelopmentRegion</key>
    <string>$(DEVELOPMENT_LANGUAGE)</string>
    <key>CFBundleExecutable</key>
    <string>$(EXECUTABLE_NAME)</string>
    <key>CFBundleIdentifier</key>
    <string>$(PRODUCT_BUNDLE_IDENTIFIER)</string>
    <key>CFBundleInfoDictionaryVersion</key>
    <string>6.0</string>
    <key>CFBundleName</key>
    <string>flutter_app</string>
    <key>CFBundlePackageType</key>
    <string>APPL</string>
    <key>CFBundleShortVersionString</key>
    <string>$(FLUTTER_BUILD_NAME)</string>
    <key>CFBundleSignature</key>
    <string>????</string>
    <key>CFBundleVersion</key>
    <string>$(FLUTTER_BUILD_NUMBER)</string>
    <key>LSRequiresIPhoneOS</key>
    <true/>
    <key>UILaunchStoryboardName</key>
    <string>LaunchScreen</string>
    <key>UIMainStoryboardFile</key>
    <string>Main</string>
    <key>UISupportedInterfaceOrientations</key>
    <array>
        <string>UIInterfaceOrientationPortrait</string>
        <string>UIInterfaceOrientationLandscapeLeft</string>
        <string>UIInterfaceOrientationLandscapeRight</string>
    </array>
    <key>UISupportedInterfaceOrientations~ipad</key>
    <array>
        <string>UIInterfaceOrientationPortrait</string>
        <string>UIInterfaceOrientationPortraitUpsideDown</string>
        <string>UIInterfaceOrientationLandscapeLeft</string>
        <string>UIInterfaceOrientationLandscapeRight</string>
    </array>
    <key>UIViewControllerBasedStatusBarAppearance</key>
    <false/>
    <key>NSLocationWhenInUseUsageDescription</key>
    <string>JELEJÖLWEKQÖEwkÖ</string>
    <key>NSLocationAlwaysUsageDescription</key>
    <string>Always Permission</string>
    <key>io.flutter.embedded_views_preview</key>
    <true/>
</dict>
</plist>

【问题讨论】：

【参考方案1】：

运行您的代码并通过在 info.plist 中添加以下键来解决问题

键名：io.flutter.embedded_views_preview 类型：布尔值价值：是的

当我在 iPhone 5S 上运行代码时，我可以在开始时看到空白的白屏（因此，甚至没有显示 HomePage()）。但是有一个错误：

[VERBOSE-2:platform_view_layer.cc(19)] Trying to embed a platform view but the PrerollContext does not support embedding

这导致了 Github 上与 iOS 版 Google 地图插件相关的 issue。

PoC 是 here 供您参考。

【讨论】：

值 io.flutter.embedded_views_preview 已经设置了.. 但是看看这是否会导致问题奇怪的是，它对你不起作用。使用完全相同的代码，我在我的设备上没有发现任何问题。您在第 6 步或第 7 步中是否遇到任何异常？很奇怪。我在我的 iPhone 5S 上卸载了该应用程序，然后在发布模式下运行它，它运行良好。因此，无法重现该问题。会检查并在我脑海中弹出的内容中回复你。您是否尝试卸载并重新运行？并且还在运行flutter clean ? 让我们continue this discussion in chat.【参考方案2】：

我可以在 iPhone 6 上重现该问题。通过 Xcode 启动时，它实际上抛出了这个错误：Thread 1: EXC_BAD_ACCESS (code=1, address=0x1) in Runner/Runner/Supporting Files/main.m。

在 onTap 函数中等待 url 启动后，如下所示：

onTap: () async 
  if (Platform.isIOS) 
    await launch('https://maps.apple.com/?q=47.6,8.8796');
   else 
    await launch('https://www.google.com/maps/search/?api=1&query=47.6,8.8796');

我无法再次重现该错误。我猜当不等待 url 启动时，Flutter 应用程序没有正确进入后台模式。

【讨论】：

但这并不能解释当以另一种方式离开应用程序时也会发生该错误。它也对我不起作用:(【参考方案3】：

我也遇到了和你类似的问题，但我找到了解决方法。

导航时不要使用Navigator.push，而是使用Navigator.pushReplacement，并设置屏幕上的后退按钮以转到主屏幕并使用Navigator.pushReplacement.By导航到主屏幕。

这样，您将能够再次重新加载主屏幕并正确加载地图。

【讨论】：

知道如何在从第二个屏幕返回到第一个屏幕时反转过渡动画吗？（因为现在这个转换是通过 pushReplacement 完成的，但转换应该看起来像一个 pop）你可以使用这个包pub.dev/packages/page_transition来改变过渡效果。

以上是关于使用谷歌地图的两个屏幕返回应用程序的问题的主要内容，如果未能解决你的问题，请参考以下文章

仅在设备屏幕的特定部分显示谷歌地图折线

谷歌地图在发布apk中显示空白屏幕，在调试模式下工作正常

单击标记时，新按钮会自动出现在谷歌地图（Android）上？如何删除？

Angular：谷歌地图第一次工作，然后只在移动屏幕上空白

使用当前位置将折线绘制到目的地，并在谷歌地图上添加标记，标记颤动

如何在谷歌地图的屏幕中心设置标记