Flutter 包装在 ValueListenableBuilder 小部件中时无法访问小部件变量答案

【问题标题】：Flutter can't access widget variable when its wrapped in ValueListenableBuilder widgetFlutter 包装在 ValueListenableBuilder 小部件中时无法访问小部件变量
【发布时间】：2022-12-18 06:47:19
【问题描述】：

我刚刚用 ValueListenableBuilder 包装了以下文本小部件，现在我无法访问我的 widget.homeTween 变量

获取“无法无条件访问属性‘homeTween’，因为接收者可以为‘null’。”

ValueListenableBuilder<Box<String>>(
                valueListenable: _localUser.listenable(),
                builder: (context, box, widget) {
                  return Text(
                    '${getGreetings()!} ${_localUser.get("_firstName")}s',
                    style: TextStyle(
                      color: widget.homeTween!.value as Color,
                      fontSize: 16,
                      fontFamily: 'Nunito Regular',
                    ),
                  );
                },
              ),

像以前一样工作，没有问题。

这是整个小部件类

// Imports:
import 'package:dogbase_app/theme/app_styles.dart';
import 'package:dogbase_app/utilities/helpers/greetings.dart';
import 'package:dogbase_app/utilities/hive/local_user.dart';
import 'package:flutter/material.dart';
import 'package:flutter_gravatar/flutter_gravatar.dart';
import 'package:hive_flutter/hive_flutter.dart';
import 'package:namefully/namefully.dart';

class AnimatedAppBar extends StatefulWidget {
  const AnimatedAppBar({
    Key? key,
    required this.colorAnimationController,
    required this.onPressed,
    required this.colorTween,
    required this.homeTween,
    required this.iconTween,
    required this.drawerTween,
    required this.workOutTween,
    required this.loadpage,
  }) : super(key: key);
  final AnimationController colorAnimationController;

  final Animation<dynamic>? colorTween;
  final Animation<dynamic>? workOutTween;
  final Animation<dynamic>? homeTween;
  final Animation<dynamic>? iconTween;
  final Animation<dynamic>? drawerTween;

  final VoidCallback onPressed;
  final Function loadpage;

  @override
  State<AnimatedAppBar> createState() => _AnimatedAppBarState();
}

class _AnimatedAppBarState extends State<AnimatedAppBar> {
  late Gravatar? _gravatar;

  @override
  void initState() {
    super.initState();
  }

  final _localUser = LocalUser().getUser();

  @override
  Widget build(BuildContext context) {
    return SizedBox(
      height: 65,
      child: AnimatedBuilder(
        animation: widget.colorAnimationController,
        builder: (context, child) => AppBar(
          toolbarHeight: 65,
          leading: IconButton(
            icon: Icon(
              Icons.dehaze,
              color: widget.drawerTween!.value as Color,
            ),
            onPressed: widget.onPressed,
          ),
          backgroundColor: widget.colorTween!.value as Color,
          elevation: 0,
          titleSpacing: 0,
          title: Row(
            children: <Widget>[
              ValueListenableBuilder<Box<String>>(
                valueListenable: _localUser.listenable(),
                builder: (context, box, widget) {
                  return Text(
                    '''${getGreetings()!} ${Namefully(_localUser.get("_firstName").toString())}''',
                    style: TextStyle(
                      color: widget.homeTween!.value as Color,
                      fontSize: 16,
                      fontFamily: 'Nunito Regular',
                    ),
                  );
                },
              ),
            ],
          ),
          actions: <Widget>[
            Icon(
              Icons.notifications,
              color: widget.iconTween!.value as Color,
            ),
            Padding(
              padding: const EdgeInsets.all(10),
              child: GestureDetector(
                onTap: () {
                  widget.loadpage(8, accentColor);
                },
                child: CircleAvatar(
                  backgroundColor: whiteColor,
                  radius: 45,
                  child: ClipOval(
                    child: Image.network(
                      _gravatar!.imageUrl(),
                    ),
                  ),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

【问题讨论】：

你能包括完整的示例小部件吗？
@YeasinSheikh 添加全班
@Gwhyyy 的回答应该可以解决问题？
不，我希望仍然能够通过 StatefulWidget 访问
color: widget.homeTween!.value？

标签： flutter dart

【解决方案1】：

因为 widget 现在指的是 builder 参数而不是 StatefulWidget widget 属性，试试这个：

      builder: (context, box, Widget? child) {
      // ...

【讨论】：

是的，我明白了，但是我怎样才能访问 StatefulWidget

【解决方案2】：

能够解决这个color: this.widget.homeTween!.value as Color,

【讨论】：

【解决方案3】：

Gwhyyy 指出了这个问题，你可以直接使用 like

ValueListenableBuilder(
  builder: (context, box, _) {
    return Text(
      '',
      style: TextStyle(
        color: widget.homeTween?.value,//null accepted

【讨论】：