首页 > 解决方案 > `Drawer` 中的 Flutter 本地化导致`Null check operator used on a null value` 错误

问题描述

在我首次使用Dart/Flutter时,我创建了一个非常简单的演示应用程序,在Drawer. 该应用程序在Android Emulator中编译并启动,但不久后中止并显示错误消息Null check operator used on a null value。在 之外Drawer,本地化工作完美无缺。

我到底做错了什么以及如何解决?

版本:

Flutter 2.2.0 • channel stable • https://github.com/flutter/flutter.git
Framework • revision b22742018b (12 days ago) • 2021-05-14 19:12:57 -0700
Engine • revision a9d88a4d18
Tools • Dart 2.13.0

GitHub 上提供的应用程序的完整源代码:https ://github.com/DarkPurpleKnight/null_issue

主要飞镖:

import 'package:flutter/material.dart';
import 'package:flutter_localizations/flutter_localizations.dart';
import 'package:flutter_gen/gen_l10n/app_localizations.dart';


void main() {
  runApp(NullIssueApp());
}

class NullIssueApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Null issue',
      localizationsDelegates: [
        AppLocalizations.delegate,
        GlobalMaterialLocalizations.delegate,
        GlobalWidgetsLocalizations.delegate,
        GlobalCupertinoLocalizations.delegate,
      ],
      supportedLocales: [
        const Locale('en', ''),
        const Locale('de', ''),
      ],
      home: Scaffold(
        drawer: Drawer(
          child: Row(
            children: [Text(AppLocalizations.of(context)!.helloWorld)],
          ),
        ),
      ),
    );
  }
}

日志:

Launching lib/main.dart on sdk gphone x86 in debug mode...
Running Gradle task 'assembleDebug'...
✓  Built build/app/outputs/flutter-apk/app-debug.apk.
Debug service listening on ws://127.0.0.1:40233/5JFMCufV37s=/ws
Syncing files to device sdk gphone x86...
D/skia    (20273):    1 Shader compilation error
D/skia    (20273):    2 ------------------------
D/skia    (20273):    3 Errors:
D/skia    (20273):    4 
D/skia    (20273):    1 Shader compilation error
D/skia    (20273):    2 ------------------------
D/skia    (20273):    3 Errors:
D/skia    (20273):    4 
D/skia    (20273):    1 Shader compilation error
D/skia    (20273):    2 ------------------------
D/skia    (20273):    3 Errors:
D/skia    (20273):    4 
D/skia    (20273):    1 Shader compilation error
D/skia    (20273):    2 ------------------------
D/skia    (20273):    3 Errors:
D/skia    (20273):    4 
D/skia    (20273):    1 Shader compilation error
D/skia    (20273):    2 ------------------------
D/skia    (20273):    3 Errors:
D/skia    (20273):    4 
D/skia    (20273):    1 Shader compilation error
D/skia    (20273):    2 ------------------------
D/skia    (20273):    3 Errors:
D/skia    (20273):    4 
D/skia    (20273):    1 Shader compilation error
D/skia    (20273):    2 ------------------------
D/skia    (20273):    3 Errors:
D/skia    (20273):    4 
D/skia    (20273):    1 Shader compilation error
D/skia    (20273):    2 ------------------------
D/skia    (20273):    3 Errors:
D/skia    (20273):    4 
D/skia    (20273):    1 Shader compilation error
D/skia    (20273):    2 ------------------------
D/skia    (20273):    3 Errors:
D/skia    (20273):    4 
D/skia    (20273):    1 Shader compilation error
D/skia    (20273):    2 ------------------------
D/skia    (20273):    3 Errors:
D/skia    (20273):    4 
D/skia    (20273):    1 Shader compilation error
D/skia    (20273):    2 ------------------------
D/skia    (20273):    3 Errors:
D/skia    (20273):    4 
D/skia    (20273):    1 Shader compilation error
D/skia    (20273):    2 ------------------------
D/skia    (20273):    3 Errors:
D/skia    (20273):    4 
D/skia    (20273):    1 Shader compilation error
D/skia    (20273):    2 ------------------------
D/skia    (20273):    3 Errors:
D/skia    (20273):    4 
D/skia    (20273):    1 Shader compilation error
D/skia    (20273):    2 ------------------------
D/skia    (20273):    3 Errors:
D/skia    (20273):    4 

======== Exception caught by widgets library =======================================================
The following _CastError was thrown building NullIssueApp(dirty):
Null check operator used on a null value

The relevant error-causing widget was: 
  NullIssueApp file:///home/dpk/source/Android/null_issue/lib/main.dart:7:10
When the exception was thrown, this was the stack: 
#0      NullIssueApp.build (package:percent_clock/main.dart:28:57)
#1      StatelessElement.build (package:flutter/src/widgets/framework.dart:4648:28)
#2      ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:4574:15)
#3      Element.rebuild (package:flutter/src/widgets/framework.dart:4267:5)
#4      ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:4553:5)
...
====================================================================================================
D/skia    (20273):    1 Shader compilation error
D/skia    (20273):    2 ------------------------
D/skia    (20273):    3 Errors:
D/skia    (20273):    4 

标签: flutterdartdart-null-safety

解决方案


这是因为此时您的应用程序AppLocalization尚未完全初始化,因此在您使用空检查运算符AppLocalizations.of(context)时返回一个null导致崩溃的值!

您需要将您的小部件包装Scaffold在一个小部件中,以便在这个新的小部件中context准备AppLocalization好。

这是我运行良好的代码示例:

class NullIssueApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Null issue',
      localizationsDelegates: [
        AppLocalizations.delegate,
        GlobalMaterialLocalizations.delegate,
        GlobalWidgetsLocalizations.delegate,
        GlobalCupertinoLocalizations.delegate,
      ],
      supportedLocales: [
        const Locale('en', ''),
        const Locale('de', ''),
      ],
      home: HomePage(),
    );
  }
}

class HomePage extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      drawer: Drawer(
        child: Row(
          children: [Text(AppLocalizations.of(context)!.helloWorld)],
        ),
      ),
    );
  }
}

截屏

在此处输入图像描述


推荐阅读