Solved: how to handle Null values in constructor in my class, Flutter

Question

Asked by Ande C on January 11, 2022 (source).

i keep getting an error that the title, the parameter 'title' can't have a value of 'null', but the implicit default value is null, and the same goes for backgorund and icon,

please i'm not certain as i am new to Flutter, where the problem is from, can someone help me check where my errors is from. Thanks in advance.

this is my main.dart file,

import 'package:simpleapp/models/sidebar.dart';
import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

//stless - stateless widget..

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {

    return MaterialApp(
        home: Scaffold(
            body: Center(
                child: SidebarRow(item: sidebarItem[0]),  //where i called the item
            ),    
        ),    
    );

  }
}

class SidebarRow extends StatelessWidget {
  
  SidebarRow({required this.item});   

  final SidebarItem item;

  @override
  Widget build(BuildContext context) {
    return Row(
      children: [
        Container(
            width: 42.0,
            height: 42.0,
            padding: EdgeInsets.all(10.0),
            decoration: BoxDecoration(
              borderRadius: BorderRadius.circular(14.0),
              gradient: item.background,
            ),
            child: item.icon),

        SizedBox(width: 12), // used for spacing..

        Container(
          child: Text(
            item.title,
            style: TextStyle(
                fontSize: 16.0,
                fontWeight: FontWeight.w800,
                color: Color(0xff242629)),
          ),
        ),
      ],
    );
  }
}

the sidebar.dart - SidebarItem Class file with additional sample data

import 'package:flutter/material.dart';

class SidebarItem {

  //how can i initialize this class to accept null values.. 

  SidebarItem({ this.title, this.background, this.icon }); 

  String title;
  LinearGradient background;
  Icon icon;

}

//add sample data...

var sidebarItem = [

  SidebarItem(
      title: "Home",
      background: LinearGradient(
        begin: Alignment.topLeft,
        end: Alignment.bottomRight,
        colors: [
          Color(0xFF00AEFF),
          Color(0xFF0076FF),
        ],
      ),
      icon: Icon(Icons.home, color: Colors.white)
)];

please how can i sort of this errors and get the variables to initialize properly, and not set to null. Thanks.

Answer

Question answered by Juan C (source).

Here you have two examples:

If every instance variable are going to be initialized (Your case):

  • Add required keyword in your named parameters
class SidebarItem {
   String title;
   LinearGradient background;
   Icon icon;

  const SidebarItem({
    required this.title,
    required this.background,
    required this.icon,
  });
}

Or a constant if it wont mutate

class SidebarItem {
  final String title;
  final LinearGradient background;
  final Icon icon;

  SidebarItem({
    required this.title,
    required this.background,
    required this.icon,
  });
}

If every instance variable can be null

class SidebarItem {
  String? title;
  LinearGradient? background;
  Icon? icon;
  
  SidebarItem({
    this.title,
    this.background,
    this.icon,
  });
}
ANDROID DART FLUTTER IOS MOBILE
SHARE: