'No Material widget found while using inkwell with showdialog in flutter
I want to show my custom dialog box in my app. I am using showDialog for the same. I want that whenever I click a button, this dialog box is shown. But it is giving me the error - **No Material widget found.**
I checked online and tried using scaffold in ask_doubt_dialog.dart, i.e. made scaffold a parent of container in the file, but it was taking the whole screen for it. And when I reduced the size of container, it was showing blank opaque screen in the remaining portion, like this -
So, I chose backgroundcolor of scaffold as transparent, but I was not able to close it by clicking outside.
Here is ask_doubt_dialog.dart file -
import 'package:flutter/material.dart';
import 'package:my_board_plus/styles.dart';
askDoubtDialog(context) {
return showDialog(
context: context,
builder: (context) => Container(
decoration: BoxDecoration(
color: cardColor2,
borderRadius: BorderRadius.all(Radius.circular(3)),
),
child: Padding(
padding: const EdgeInsets.all(5.0),
child: Column(
children: [
SizedBox(
height: 200,
width: MediaQuery.of(context).size.width*0.9,
child: TextField(
decoration: InputDecoration(
hintText: 'Type your question here',
),
),
),
Container(
height: 1,
color: tertiaryTextColor2,
width: double.infinity,
),
Row(
children: [
InkWell(
onTap: () {
},
child: Container(
child: Text(
'Add an image'
),
),
),
],
),
],
),
),
)
);
}
After making scaffold bg as transparent, and not able to click outside of it close it -
I am calling it like this -
child: InkWell(
onTap: () {
askDoubtDialog(context);
},
This is the exact error log -
======== Exception caught by widgets library =======================================================
The following assertion was thrown building TextField(decoration: InputDecoration(hintText: "Type your question here"), dirty, dependencies: [MediaQuery, UnmanagedRestorationScope], state: _TextFieldState#0e2af):
No Material widget found.
TextField widgets require a Material widget ancestor.
In material design, most widgets are conceptually "printed" on a sheet of material. In Flutter's material library, that material is represented by the Material widget. It is the Material widget that renders ink splashes, for instance. Because of this, many material library widgets require that there be a Material widget in the tree above them.
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.
The specific widget that could not find a Material ancestor was: TextField
decoration: InputDecoration(hintText: "Type your question here")
dirty
dependencies: [MediaQuery, UnmanagedRestorationScope]
state: _TextFieldState#0e2af
The ancestors of this widget were:
: SizedBox
width: 353.5
height: 200.0
renderObject: RenderConstrainedBox#9071d NEEDS-LAYOUT NEEDS-PAINT
: Column
direction: vertical
mainAxisAlignment: start
crossAxisAlignment: center
renderObject: RenderFlex#e2f6d NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
: Padding
padding: EdgeInsets.all(5.0)
dependencies: [Directionality]
renderObject: RenderPadding#31a15 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
: Container
bg: BoxDecoration(color: Color(0xff2e2b47), borderRadius: BorderRadius.circular(3.0))
: MaterialApp
state: _MaterialAppState#99820
: ChangeNotifierProvider<APIData>
value: Instance of 'APIData'
listening to value
: Consumer<AppLocale>
dependencies: [_InheritedProviderScope<AppLocale?>]
: MyApp
: ChangeNotifierProvider<AppLocale>
value: Instance of 'AppLocale'
listening to value
...
The relevant error-causing widget was:
TextField TextField:file:///C:/Users/Hp/AndroidStudioProjects/myboardplusv2/lib/visual_components/dialogs/ask_doubt_dialog.dart:19:22
When the exception was thrown, this was the stack:
#0 debugCheckHasMaterial.<anonymous closure> (package:flutter/src/material/debug.dart:29:7)
#1 debugCheckHasMaterial (package:flutter/src/material/debug.dart:50:4)
#2 _TextFieldState.build (package:flutter/src/material/text_field.dart:1115:12)
#3 StatefulElement.build (package:flutter/src/widgets/framework.dart:4870:27)
#4 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:4754:15)
#5 StatefulElement.performRebuild (package:flutter/src/widgets/framework.dart:4928:11)
#6 Element.rebuild (package:flutter/src/widgets/framework.dart:4477:5)
#7 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:4735:5)
#8 StatefulElement._firstBuild (package:flutter/src/widgets/framework.dart:4919:11)
#9 ComponentElement.mount (package:flutter/src/widgets/framework.dart:4729:5)
... Normal element mounting (4 frames)
#13 Element.inflateWidget (package:flutter/src/widgets/framework.dart:3790:14)
#14 MultiChildRenderObjectElement.inflateWidget (package:flutter/src/widgets/framework.dart:6422:36)
#15 MultiChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:6433:32)
... Normal element mounting (199 frames)
#214 Element.inflateWidget (package:flutter/src/widgets/framework.dart:3790:14)
#215 MultiChildRenderObjectElement.inflateWidget (package:flutter/src/widgets/framework.dart:6422:36)
#216 Element.updateChild (package:flutter/src/widgets/framework.dart:3540:18)
#217 RenderObjectElement.updateChildren (package:flutter/src/widgets/framework.dart:5845:32)
#218 MultiChildRenderObjectElement.update (package:flutter/src/widgets/framework.dart:6445:17)
#219 Element.updateChild (package:flutter/src/widgets/framework.dart:3501:15)
#220 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:4780:16)
#221 StatefulElement.performRebuild (package:flutter/src/widgets/framework.dart:4928:11)
#222 Element.rebuild (package:flutter/src/widgets/framework.dart:4477:5)
#223 StatefulElement.update (package:flutter/src/widgets/framework.dart:4960:5)
#224 Element.updateChild (package:flutter/src/widgets/framework.dart:3501:15)
#225 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:4780:16)
#226 Element.rebuild (package:flutter/src/widgets/framework.dart:4477:5)
#227 ProxyElement.update (package:flutter/src/widgets/framework.dart:5108:5)
#228 Element.updateChild (package:flutter/src/widgets/framework.dart:3501:15)
#229 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:4780:16)
#230 Element.rebuild (package:flutter/src/widgets/framework.dart:4477:5)
#231 ProxyElement.update (package:flutter/src/widgets/framework.dart:5108:5)
#232 _InheritedNotifierElement.update (package:flutter/src/widgets/inherited_notifier.dart:111:11)
#233 Element.updateChild (package:flutter/src/widgets/framework.dart:3501:15)
#234 SingleChildRenderObjectElement.update (package:flutter/src/widgets/framework.dart:6291:14)
#235 Element.updateChild (package:flutter/src/widgets/framework.dart:3501:15)
#236 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:4780:16)
#237 StatefulElement.performRebuild (package:flutter/src/widgets/framework.dart:4928:11)
#238 Element.rebuild (package:flutter/src/widgets/framework.dart:4477:5)
#239 StatefulElement.update (package:flutter/src/widgets/framework.dart:4960:5)
#240 Element.updateChild (package:flutter/src/widgets/framework.dart:3501:15)
#241 SingleChildRenderObjectElement.update (package:flutter/src/widgets/framework.dart:6291:14)
#242 Element.updateChild (package:flutter/src/widgets/framework.dart:3501:15)
#243 SingleChildRenderObjectElement.update (package:flutter/src/widgets/framework.dart:6291:14)
#244 Element.updateChild (package:flutter/src/widgets/framework.dart:3501:15)
#245 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:4780:16)
#246 Element.rebuild (package:flutter/src/widgets/framework.dart:4477:5)
#247 ProxyElement.update (package:flutter/src/widgets/framework.dart:5108:5)
#248 Element.updateChild (package:flutter/src/widgets/framework.dart:3501:15)
#249 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:4780:16)
#250 StatefulElement.performRebuild (package:flutter/src/widgets/framework.dart:4928:11)
#251 Element.rebuild (package:flutter/src/widgets/framework.dart:4477:5)
#252 BuildOwner.buildScope (package:flutter/src/widgets/framework.dart:2659:19)
#253 WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:882:21)
#254 RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:363:5)
#255 SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:1144:15)
#256 SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:1081:9)
#257 SchedulerBinding._handleDrawFrame (package:flutter/src/scheduler/binding.dart:995:5)
#261 _invoke (dart:ui/hooks.dart:151:10)
#262 PlatformDispatcher._drawFrame (dart:ui/platform_dispatcher.dart:308:5)
#263 _drawFrame (dart:ui/hooks.dart:115:31)
(elided 3 frames from dart:async)
====================================================================================================
======== Exception caught by widgets library =======================================================
The following assertion was thrown building _InkResponseStateWidget(gestures: [tap], mouseCursor: null, clipped to BoxShape.rectangle, dirty, state: _InkResponseState#0f1a8):
No Material widget found.
_InkResponseStateWidget widgets require a Material widget ancestor.
In material design, most widgets are conceptually "printed" on a sheet of material. In Flutter's material library, that material is represented by the Material widget. It is the Material widget that renders ink splashes, for instance. Because of this, many material library widgets require that there be a Material widget in the tree above them.
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.
The specific widget that could not find a Material ancestor was: _InkResponseStateWidget
gestures: tap
mouseCursor: null
clipped to BoxShape.rectangle
dirty
state: _InkResponseState#0f1a8
The ancestors of this widget were:
: InkWell
: Row
direction: horizontal
mainAxisAlignment: start
crossAxisAlignment: center
dependencies: [Directionality]
renderObject: RenderFlex#5d8b0 NEEDS-LAYOUT NEEDS-PAINT
: Column
direction: vertical
mainAxisAlignment: start
crossAxisAlignment: center
renderObject: RenderFlex#e2f6d NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
: Padding
padding: EdgeInsets.all(5.0)
dependencies: [Directionality]
renderObject: RenderPadding#31a15 NEEDS-LAYOUT NEEDS-PAINT NEEDS-COMPOSITING-BITS-UPDATE
: Container
bg: BoxDecoration(color: Color(0xff2e2b47), borderRadius: BorderRadius.circular(3.0))
: MaterialApp
state: _MaterialAppState#99820
: ChangeNotifierProvider<APIData>
value: Instance of 'APIData'
listening to value
: Consumer<AppLocale>
dependencies: [_InheritedProviderScope<AppLocale?>]
: MyApp
: ChangeNotifierProvider<AppLocale>
value: Instance of 'AppLocale'
listening to value
...
The relevant error-causing widget was:
InkWell InkWell:file:///C:/Users/Hp/AndroidStudioProjects/myboardplusv2/lib/visual_components/dialogs/ask_doubt_dialog.dart:32:17
When the exception was thrown, this was the stack:
#0 debugCheckHasMaterial.<anonymous closure> (package:flutter/src/material/debug.dart:29:7)
#1 debugCheckHasMaterial (package:flutter/src/material/debug.dart:50:4)
#2 InkResponse.debugCheckContext (package:flutter/src/material/ink_well.dart:624:12)
#3 _InkResponseState.build (package:flutter/src/material/ink_well.dart:1070:36)
#4 StatefulElement.build (package:flutter/src/widgets/framework.dart:4870:27)
#5 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:4754:15)
#6 StatefulElement.performRebuild (package:flutter/src/widgets/framework.dart:4928:11)
#7 Element.rebuild (package:flutter/src/widgets/framework.dart:4477:5)
#8 ComponentElement._firstBuild (package:flutter/src/widgets/framework.dart:4735:5)
#9 StatefulElement._firstBuild (package:flutter/src/widgets/framework.dart:4919:11)
#10 ComponentElement.mount (package:flutter/src/widgets/framework.dart:4729:5)
... Normal element mounting (7 frames)
#17 Element.inflateWidget (package:flutter/src/widgets/framework.dart:3790:14)
#18 MultiChildRenderObjectElement.inflateWidget (package:flutter/src/widgets/framework.dart:6422:36)
#19 MultiChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:6433:32)
#20 Element.inflateWidget (package:flutter/src/widgets/framework.dart:3790:14)
#21 MultiChildRenderObjectElement.inflateWidget (package:flutter/src/widgets/framework.dart:6422:36)
#22 MultiChildRenderObjectElement.mount (package:flutter/src/widgets/framework.dart:6433:32)
... Normal element mounting (199 frames)
#221 Element.inflateWidget (package:flutter/src/widgets/framework.dart:3790:14)
#222 MultiChildRenderObjectElement.inflateWidget (package:flutter/src/widgets/framework.dart:6422:36)
#223 Element.updateChild (package:flutter/src/widgets/framework.dart:3540:18)
#224 RenderObjectElement.updateChildren (package:flutter/src/widgets/framework.dart:5845:32)
#225 MultiChildRenderObjectElement.update (package:flutter/src/widgets/framework.dart:6445:17)
#226 Element.updateChild (package:flutter/src/widgets/framework.dart:3501:15)
#227 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:4780:16)
#228 StatefulElement.performRebuild (package:flutter/src/widgets/framework.dart:4928:11)
#229 Element.rebuild (package:flutter/src/widgets/framework.dart:4477:5)
#230 StatefulElement.update (package:flutter/src/widgets/framework.dart:4960:5)
#231 Element.updateChild (package:flutter/src/widgets/framework.dart:3501:15)
#232 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:4780:16)
#233 Element.rebuild (package:flutter/src/widgets/framework.dart:4477:5)
#234 ProxyElement.update (package:flutter/src/widgets/framework.dart:5108:5)
#235 Element.updateChild (package:flutter/src/widgets/framework.dart:3501:15)
#236 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:4780:16)
#237 Element.rebuild (package:flutter/src/widgets/framework.dart:4477:5)
#238 ProxyElement.update (package:flutter/src/widgets/framework.dart:5108:5)
#239 _InheritedNotifierElement.update (package:flutter/src/widgets/inherited_notifier.dart:111:11)
#240 Element.updateChild (package:flutter/src/widgets/framework.dart:3501:15)
#241 SingleChildRenderObjectElement.update (package:flutter/src/widgets/framework.dart:6291:14)
#242 Element.updateChild (package:flutter/src/widgets/framework.dart:3501:15)
#243 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:4780:16)
#244 StatefulElement.performRebuild (package:flutter/src/widgets/framework.dart:4928:11)
#245 Element.rebuild (package:flutter/src/widgets/framework.dart:4477:5)
#246 StatefulElement.update (package:flutter/src/widgets/framework.dart:4960:5)
#247 Element.updateChild (package:flutter/src/widgets/framework.dart:3501:15)
#248 SingleChildRenderObjectElement.update (package:flutter/src/widgets/framework.dart:6291:14)
#249 Element.updateChild (package:flutter/src/widgets/framework.dart:3501:15)
#250 SingleChildRenderObjectElement.update (package:flutter/src/widgets/framework.dart:6291:14)
#251 Element.updateChild (package:flutter/src/widgets/framework.dart:3501:15)
#252 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:4780:16)
#253 Element.rebuild (package:flutter/src/widgets/framework.dart:4477:5)
#254 ProxyElement.update (package:flutter/src/widgets/framework.dart:5108:5)
#255 Element.updateChild (package:flutter/src/widgets/framework.dart:3501:15)
#256 ComponentElement.performRebuild (package:flutter/src/widgets/framework.dart:4780:16)
#257 StatefulElement.performRebuild (package:flutter/src/widgets/framework.dart:4928:11)
#258 Element.rebuild (package:flutter/src/widgets/framework.dart:4477:5)
#259 BuildOwner.buildScope (package:flutter/src/widgets/framework.dart:2659:19)
#260 WidgetsBinding.drawFrame (package:flutter/src/widgets/binding.dart:882:21)
#261 RendererBinding._handlePersistentFrameCallback (package:flutter/src/rendering/binding.dart:363:5)
#262 SchedulerBinding._invokeFrameCallback (package:flutter/src/scheduler/binding.dart:1144:15)
#263 SchedulerBinding.handleDrawFrame (package:flutter/src/scheduler/binding.dart:1081:9)
#264 SchedulerBinding._handleDrawFrame (package:flutter/src/scheduler/binding.dart:995:5)
#268 _invoke (dart:ui/hooks.dart:151:10)
#269 PlatformDispatcher._drawFrame (dart:ui/platform_dispatcher.dart:308:5)
#270 _drawFrame (dart:ui/hooks.dart:115:31)
(elided 3 frames from dart:async)
====================================================================================================
I/flutter ( 5561): token eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJ1c2VyX2lkIjoiMWQyNmNjMDUtNjY0OC00MTA0LThhMGItOTMwMjFjMzk3ODY1IiwidXNlcm5hbWUiOjk1NDk0NDE5MjIsImV4cCI6MTY0NzkzMTkwNCwiZW1haWwiOiIiLCJjb250YWN0Ijo5NTQ5NDQxOTIyfQ.WeJuZp2aOFaa29Ko0zysyaJSxz0SVvLNUrf8TfGcM1k
D/EGL_emulation( 5561): app_time_stats: avg=206.76ms min=13.14ms max=1307.28ms count=10
======== Exception caught by rendering library =====================================================
The following assertion was thrown during layout:
A RenderFlex overflowed by 99617 pixels on the right.
The relevant error-causing widget was:
Row Row:file:///C:/Users/Hp/AndroidStudioProjects/myboardplusv2/lib/visual_components/dialogs/ask_doubt_dialog.dart:30:13
The overflowing RenderFlex has an orientation of Axis.horizontal.
The edge of the RenderFlex that is overflowing has been marked in the rendering with a yellow and black striped pattern. This is usually caused by the contents being too big for the RenderFlex.
Consider applying a flex factor (e.g. using an Expanded widget) to force the children of the RenderFlex to fit within the available space instead of being sized to their natural size.
This is considered an error condition because it indicates that there is content that cannot be seen. If the content is legitimately bigger than the available space, consider clipping it with a ClipRect widget before putting it in the flex, or using a scrollable container rather than a Flex, like a ListView.
The specific RenderFlex in question is: RenderFlex#5d8b0 relayoutBoundary=up1 OVERFLOWING
... parentData: offset=Offset(0.0, 201.0); flex=null; fit=null (can use size)
... constraints: BoxConstraints(0.0<=w<=382.7, 0.0<=h<=Infinity)
... size: Size(382.7, 100000.0)
... direction: horizontal
... mainAxisAlignment: start
... mainAxisSize: max
... crossAxisAlignment: center
... textDirection: ltr
... verticalDirection: down
child 1: RenderErrorBox#d0d6c
parentData: offset=Offset(0.0, 0.0); flex=null; fit=null (can use size)
constraints: BoxConstraints(unconstrained)
size: Size(100000.0, 100000.0)
◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤
====================================================================================================
======== Exception caught by rendering library =====================================================
The following assertion was thrown during layout:
A RenderFlex overflowed by 99466 pixels on the bottom.
The relevant error-causing widget was:
Column Column:file:///C:/Users/Hp/AndroidStudioProjects/myboardplusv2/lib/visual_components/dialogs/ask_doubt_dialog.dart:14:16
The overflowing RenderFlex has an orientation of Axis.vertical.
The edge of the RenderFlex that is overflowing has been marked in the rendering with a yellow and black striped pattern. This is usually caused by the contents being too big for the RenderFlex.
Consider applying a flex factor (e.g. using an Expanded widget) to force the children of the RenderFlex to fit within the available space instead of being sized to their natural size.
This is considered an error condition because it indicates that there is content that cannot be seen. If the content is legitimately bigger than the available space, consider clipping it with a ClipRect widget before putting it in the flex, or using a scrollable container rather than a Flex, like a ListView.
The specific RenderFlex in question is: RenderFlex#e2f6d OVERFLOWING
... parentData: offset=Offset(5.0, 5.0) (can use size)
... constraints: BoxConstraints(w=382.7, h=735.5)
... size: Size(382.7, 735.5)
... direction: vertical
... mainAxisAlignment: start
... mainAxisSize: max
... crossAxisAlignment: center
... verticalDirection: down
◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤
====================================================================================================
Solution 1:[1]
Try to Wrap your Container inside AlertDialog Widget, Try below code
Your AlertDialog method:
askDoubtDialog(context) {
return showDialog(
context: context,
builder: (context) => AlertDialog(
title: Text('Some Text'),
content: Container(
decoration: BoxDecoration(
color: Colors.blue,
borderRadius: BorderRadius.all(Radius.circular(3)),
),
child: Padding(
padding: const EdgeInsets.all(5.0),
child: Column(
children: [
SizedBox(
height: 200,
width: MediaQuery.of(context).size.width * 0.9,
child: TextField(
decoration: InputDecoration(
hintText: 'Type your question here',
),
),
),
Container(
height: 1,
color: Colors.red,
width: double.infinity,
),
Row(
children: [
InkWell(
onTap: () {},
child: Container(
child: Text('Add an image'),
),
),
],
),
],
),
),
),
),
);
}
Your Widget:
InkWell(
onTap: () {
askDoubtDialog(context);
},
child: Text('Pressed Me'),
),
Your Result screen-> 
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | Ravindra S. Patil |