返回一个带有空小部件的空白小部件,带有null安全辅助。

huangapple go评论59阅读模式
英文:

Return an empty widget with null safety assistance

问题

Have been following a tutorial and due to null safety in the current version of flutter, I am unable to return anything empty, but it is required to return custom page designs dynamically.

```dart
import 'package:flutter/material.dart';

class BasePage extends StatefulWidget {
  const BasePage({super.key});

  @override
  State<BasePage> createState() => BasePageState();
}

class BasePageState<T extends BasePage> extends State<T> {
  bool isApiCallProcess = false;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: PreferredSize(preferredSize: const Size.fromHeight(70.0), child: _buildAppBar()),
      body: ProgressHUD(
        inAsyncCall: isApiCallProcess,
        opacity: 0.3,
        child: pageUI(),
      ),
    );
  }
}

Widget pageUI() {
  return null;
}

Widget _buildAppBar() {
  return AppBar(
    centerTitle: true,
    elevation: 0,
    backgroundColor: Colors.yellow[800],
    automaticallyImplyLeading: false,
    title: const Text(
      'Kem-D Batteries',
      style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold, fontSize: 20),
    ),
    actions: const [
      Icon(
        Icons.notifications_none,
        color: Colors.white,
      ),
      SizedBox(
        width: 10,
      ),
      Icon(
        Icons.shopping_cart,
        color: Colors.white,
      ),
      SizedBox(
        width: 10,
      ),
    ],
  );
}

In the pageUI() method:

Widget pageUI() {
  return null;
}

You get a runtime error when returning null because of null safety. To handle this, you can return an empty widget like a Container or any other suitable widget, or you can use a conditional statement to return different widgets based on your needs.

For example, you can modify the pageUI() method like this:

Widget pageUI() {
  return Container(); // Return an empty container or customize it as needed.
}

This change should help you avoid the null safety error.

import 'package:flutter/material.dart';
import 'base_page.dart';

class ProductPage extends BasePage {
  const ProductPage({Key? key, required this.categoryId}) : super(key: key);

  final int categoryId;

  @override
  _ProductPageState createState() => _ProductPageState();
}

class _ProductPageState extends BasePageState<ProductPage> {
  @override
  Widget pageUI() {
    return Container(
      child: Text(
        widget.categoryId.toString(),
      ),
    );
  }
}

This code appears to be related to displaying product categories by their unique ID. It extends the BasePage and uses the pageUI() method to display the category ID as text within a Container.


<details>
<summary>英文:</summary>

Have been following a tutorial and due to null safety in current version of flutter, I am unable to return anything empty but it is required to return custom page designs dynamically


import 'package:flutter/material.dart';

class BasePage extends StatefulWidget {
const BasePage({super.key});

@override
State<BasePage> createState() => BasePageState();
}

class BasePageState<T extends BasePage> extends State<T> {
bool isApiCallProcess = false;

@override
Widget build(BuildContext context) {
return Scaffold(
appBar: PreferredSize(preferredSize: const Size.fromHeight(70.0), child: _buildAppBAr()),
body: ProgressHUD(
inAsyncCall: isApiCallProcess,
opacity: 0.3,
child: pageUI(),
),
);
}
}

Widget pageUI() {
return null;
}

Widget _buildAppBAr() {
return AppBar(
centerTitle: true,
elevation: 0,
backgroundColor: Colors.yellow[800],
automaticallyImplyLeading: false,
title: const Text(
'Kem-D Batteries',
style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold, fontSize: 20),
),
actions: const [
Icon(
Icons.notifications_none,
color: Colors.white,
),
SizedBox(
width: 10,
),
Icon(
Icons.shopping_cart,
color: Colors.white,
),
SizedBox(
width: 10,
),
],
);
}


in the 


Widget pageUI() {
return null;
}


Get runtime error when I null the widget as the `pageUI()` in the child widget can&#39;t be assigned to a non-null widget.

I tired `pageUI()!` didn&#39;t work, same as 

Widget pageUI() {
return null!;
}

also didn&#39;t work. Any assistance will be appreciated.

I tired `pageUI()!` didn&#39;t work, same as 

Widget pageUI() {
return null!;
}

also didn&#39;t work.

I want to display products related to their unique id and the code below is for the display of categories by id

    import &#39;package:flutter/material.dart&#39;;
    import &#39;base_page.dart&#39;;

    class ProductPage extends BasePage {
    const ProductPage({Key? key, required this.catgeoryId}) :  super(key: key);

    final int catgeoryId;

    @override
    // ignore: library_private_types_in_public_api
    _ProductPageState createState() =&gt; _ProductPageState();
     }

    class _ProductPageState extends BasePageState&lt;ProductPage&gt; {
    @override
    Widget pageUI() {
    return Container(
      child: Text(
        widget.catgeoryId.toString(),
      ),
     );
     }
    }


</details>


# 答案1
**得分**: 0

```dart
使用`?`运算符使函数的返回类型可为空,这样你就可以返回null。

```dart
Widget? pageUI() {
  return null;
}
英文:

Make the return type of your function nullable using operator ?, so you can return null.

Widget? pageUI() {
  return null;
}

答案2

得分: 0

return const SizedBox.shrink();

英文:

You can return

return const SizedBox.shrink();

答案3

得分: 0

有两处需要更改。

1. Widget? pageUI() { // 使返回类型可为空
  return null;
}

在调用时使用 ?? 运算符

2. body: ProgressHUD(
        inAsyncCall: isApiCallProcess,
        opacity: 0.3,
        child: pageUI() ?? Container(), // 这很重要
      ),
英文:

There are two changes to be made.

1. Widget? pageUI() { // make returnType nullable
  return null;
}

While calling use ?? operator

2. body: ProgressHUD(
        inAsyncCall: isApiCallProcess,
        opacity: 0.3,
        child: pageUI() ?? Container(), // This is important
      ),

huangapple
  • 本文由 发表于 2023年3月8日 16:55:43
  • 转载请务必保留本文链接:https://go.coder-hub.com/75671030.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定