How to fix 'Text is null' in flutter

Question

I want to create an app which has a TabBarView with two tabs. On the first Tab there is a Textfield and on the other tab there is a text widget which should display the text which you entered into Textfield but I always get an error because text is null.( I'm new in programming with flutter)

I tried to initialize the variable in TextOutput class but it didn't work because the variable is final.

TabBarView(
      children: <Widget>[
        TextCreatePage(), TextOutput()
      ],




class TextCreatePageState extends State<TextCreatePage> {
String textvalue;
@override
Widget build(BuildContext context) {
  return Center(child: TextField(
    onChanged: (String value) {
    setState(() {
       textvalue = value;
       TextOutput(textvalue: textvalue,);
            });





class TextOutput extends StatelessWidget {
final String textvalue;

TextOutput({this.textvalue});
@override
Widget build(BuildContext context) {
    return Text(textvalue); 
}
}

Answer 1

So, for anyone that search this and got here, I'm using this to manage null String variables.

1. Show Empty Text

String nullText; //for null-safety change to: String? nullText;

//now, inside of your widget build
Text(nullText ?? '');

2. Not show Text Widget

String nullText;

//now, inside of your widget build
if(nullText != null)
 Text(nullText);

with null-safety

String? nullText;

//now, inside of your widget build
if(nullText != null)
 Text(nullText!);

Also you can show like this, but this show the null word

String nullText; //for null-safety change to String? nullText;

//now, inside of your widget build
Text('$nullText');

Live Example https://dartpad.dev/faab5bc3c2df9573c0a75a5ce3d4b4b9

Answer 2

It's not clear from the information your provided in your question what code causes the error, but I guess it is this line:

return Text(textvalue); 

If you change it to

return textvalue != null ? Text(textvalue) : Container(); 

your error should go away.

Answer 3

Hector Aguero's answer is what I've been doing to workaround the error.

I use this everywhere:

Text(nullText ?? '');

But I wonder what's stopping Flutter team to make Text() widget support null value?

// This should be acceptable and simply not rendering any text
// why they don't allow this is beyond me
Text(nullText);

Answer 4

The value may be empty therefore you’re getting a null error

Make the name variable nullable. In this case make sure that you have logic in place to handle null value in the Text widget in UI.

To make it nullable we will add ‘?’ in front of the type of the variable, This means that the name variable can be null.

final String? textvalue;
Text(textvalue == null ? '' : textvalue),

Use ‘!’ only when you are completely sure that the value will never be null.