Home > Mobile >  Flutter can't access widget variable when its wrapped in ValueListenableBuilder widget
Flutter can't access widget variable when its wrapped in ValueListenableBuilder widget

Time:12-08

I just wrapped the following text widget with a ValueListenableBuilder and now I can't access my widget.homeTween variable

Getting "The property 'homeTween' can't be unconditionally accessed because the receiver can be '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',
                    ),
                  );
                },
              ),

Work as before, with no issues.

Here is the entire widget class

// 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(),
                    ),
                  ),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

CodePudding user response:

Was able to slove this color: this.widget.homeTween!.value as Color,

CodePudding user response:

Gwhyyy pointed the issue, You can directly use like

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

CodePudding user response:

because the widget is referring now to the the builder parameter not the StatefulWidget widget property, try this:

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

and:

// 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, _) {
                  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(),
                    ),
                  ),
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}
  • Related