Material App styles doesn't work without Scaffold

大兔子大兔子 提交于 2021-02-08 16:42:12

问题


I'm trying to create a Material design app without the Scaffold element: Here is the purely default app:

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);
  final String title;
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Text(widget.title);
  }
}

The result is:

How to fix that and use material styles without Scaffold?

Answer:

I need to use the Material widget. As a very beginner in Flutter I had read Material design tutorials and all of them were using the Scaffold widget. Thanks for pointing out the Material widget in comments.


回答1:


It will not work without scaffold.

I think you are not getting what scaffold is and how it's behaviour is?

Scaffold is a widget which provides your screen/route a default behaviour similar to your android/ios screens like AppBar, Body, Title, FloatingActionButton, Drawer etc.

So that you do not have to make yourself a new structure.

If you are not using scaffold, then your page will act like a plain body structure in which you have to fill custom widgets as per your requirements.

For ex :

In android, Any Activity will have a default ActionBar. But, if you use NoActionBarActivity then Activity will be displayed without actionBar.

Even Scaffold works in the similar manner.

Updated Method :

@override
  Widget build(BuildContext context) {
    return Material(child: Center(child: Text(widget.title,)),color: Colors.white,);
  }

You need to use Material Widget as a parent to behave the child widgets in the similar manner when using Scaffold.



来源:https://stackoverflow.com/questions/58678614/material-app-styles-doesnt-work-without-scaffold

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!