No Material widget found

Question

I am new to Flutter and I was trying do execute the example here. I just want to use the TextField widget to get some user input. The issue is that I get a "No Material widget found." error. What am I doing wrong ? Thank you.

Code:

import 'package:flutter/material.dart';      void main() {   runApp(new MyApp()); }   class MyApp extends StatelessWidget {   // This widget is the root of your application.   @override   Widget build(BuildContext context) {     return new MaterialApp(       title: 'Flutter Demo',       home: new ExampleWidget(),     );   } }   /// Opens an [AlertDialog] showing what the user typed. class ExampleWidget extends StatefulWidget {   ExampleWidget({Key key}) : super(key: key);    @override   _ExampleWidgetState createState() => new _ExampleWidgetState(); }  /// State for [ExampleWidget] widgets. class _ExampleWidgetState extends State<ExampleWidget> {   final TextEditingController _controller = new TextEditingController();    @override   Widget build(BuildContext context) {     return new Column(       mainAxisAlignment: MainAxisAlignment.center,       children: <Widget>[         new TextField(           controller: _controller,           decoration: new InputDecoration(             hintText: 'Type something',           ),         ),         new RaisedButton(           onPressed: () {             showDialog(               context: context,               child: new AlertDialog(                 title: new Text('What you typed'),                 content: new Text(_controller.text),               ),             );           },           child: new Text('DONE'),         ),       ],     );   } } 

This is the error stack:

Launching lib/main.dart on Android SDK built for x86 in debug mode... Built build/app/outputs/apk/app-debug.apk (21.5MB). I/flutter ( 5187): ══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY ╞═══════════════════════════════════════════════════════════ I/flutter ( 5187): The following assertion was thrown building InputDecorator(decoration: InputDecoration(hintText: I/flutter ( 5187): "Type something"); baseStyle: null; isFocused: false; isEmpty: true; dirty): I/flutter ( 5187): No Material widget found. I/flutter ( 5187): InputDecorator widgets require a Material widget ancestor. I/flutter ( 5187): In material design, most widgets are conceptually "printed" on a sheet of material. In Flutter's I/flutter ( 5187): material library, that material is represented by the Material widget. It is the Material widget I/flutter ( 5187): that renders ink splashes, for instance. Because of this, many material library widgets require that I/flutter ( 5187): there be a Material widget in the tree above them. I/flutter ( 5187): To introduce a Material widget, you can either directly include one, or use a widget that contains I/flutter ( 5187): Material itself, such as a Card, Dialog, Drawer, or Scaffold. I/flutter ( 5187): The specific widget that could not find a Material ancestor was: I/flutter ( 5187):   InputDecorator(decoration: InputDecoration(hintText: "Type something"); baseStyle: null; I/flutter ( 5187):   isFocused: false; isEmpty: true) I/flutter ( 5187): The ownership chain for the affected widget is: I/flutter ( 5187):   InputDecorator ← AnimatedBuilder ← Listener ← _GestureSemantics ← RawGestureDetector ← I/flutter ( 5187):   GestureDetector ← TextField ← Column ← ExampleWidget ← _ModalScopeStatus ← ⋯ I/flutter ( 5187):  I/flutter ( 5187): When the exception was thrown, this was the stack: I/flutter ( 5187): #0      debugCheckHasMaterial.<anonymous closure> (package:flutter/src/material/debug.dart:26) I/flutter ( 5187): #2      debugCheckHasMaterial (package:flutter/src/material/debug.dart:23) I/flutter ( 5187): #3      InputDecorator.build (package:flutter/src/material/input_decorator.dart:334) ... <output omitted> I/flutter ( 5187): (elided one frame from class _AssertionError) I/flutter ( 5187): ════════════════════════════════════════════════════════════════════════════════════════════════════ I/flutter ( 5187): Another exception was thrown: No Material widget found. 

Answer 1

The error message says:

To introduce a Material widget, you can either directly include one, or use a widget that contains Material itself, such as a Card, Dialog, Drawer, or Scaffold.

In your case, I'd probably wrap your Column in a Scaffold. This will make it easy to add other material widgets to your app later, such as an AppBar, Drawer, or FloatingActionButton.

@override Widget build(BuildContext context) {   return new Scaffold(     body: new Column(       mainAxisAlignment: MainAxisAlignment.center,       children: <Widget>[         new TextField(             controller: _controller,             decoration: new InputDecoration(                 hintText: 'Type something',             ),         ),         new RaisedButton(             onPressed: () {               showDialog(                   context: context,                   child: new AlertDialog(                       title: new Text('What you typed'),                       content: new Text(_controller.text),                   ),               );             },             child: new Text('DONE'),         ),       ],     ),   ); }