Flutter screen appears empty when adding text field

Question

I was making a flutter app there was a text in it and it was working but after that when I added a text field I ran the app and I found that the app is empty.

this is my code :

import 'package:flutter/material.dart';

void main() {
  runApp(new MaterialApp(
    home: new MyApp(),
  ));
}

class MyApp extends StatelessWidget {
  @override
  Scaffold c = Scaffold(
    body: Padding(
      padding: const EdgeInsets.only(top:30.0),
      child: new Row(
        children: <Widget>[
          new TextField(
            decoration: InputDecoration(
                border: InputBorder.none,
                hintText: 'Please enter a search term'
            ),
          ),
          new Text(
            'Text',
            style: TextStyle(
              fontSize: 20.0
            ),
          ),
        ],
      ),
    ),
  );

  @override
  Widget build(BuildContext context) {
    return c;
  }
}

Answer 1

That's is because the Row container doesn't know the size of your TextField widget

This is the error that you get:

    following function, which probably computed the invalid constraints in question:
        flutter:   _RenderDecoration._layout.layoutLineBox 
      (package:flutter/src/material/input_decorator.dart:808:11)
        flutter: The offending constraints were:
        flutter:   BoxConstraints(w=Infinity, 0.0<=h<=379.0)

In order to fix that issue, give to your Textfield a width in his parent container , like this :

Container(
        width: 200.0,
        child: new TextField(
          decoration: InputDecoration(
              border: InputBorder.none,
              hintText: 'Please enter a search term'),
        ),
      ),

But it looks weird in your screen ,so you can improve using Flexible as parent of your TextField and Text

        Scaffold c = Scaffold(
            body: Padding(
              padding: const EdgeInsets.only(top:30.0),
              child: new Row(
                children: <Widget>[
                  Flexible(
                    flex: 1,
                              child: new TextField(
                      decoration: InputDecoration(
                          border: InputBorder.none,
                          hintText: 'Please enter a search term'
                      ),
                    ),
                  ),
                  Flexible(
                    flex: 1,
                              child: new Text(
                      'Text',
                      style: TextStyle(
                        fontSize: 20.0
                      ),
                    ),
                  ),
                ],
              ),
            ),
          );

Flexible Widget