如何将Stratless小部件包含到StatefulWidget中?

时间:2019-12-08 12:30:54

标签: flutter

我想将StatelessWidget包含在StatefulWidget中。 但是在我的StatefulWidget中如何调用StatelessWidget时遇到问题?

import 'package:flutter/material.dart';

void main() {
  runApp(new MyApp());
}
class MyApp extends StatelessWidget {
  get children => null;


  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Generated App',
      theme: new ThemeData(
        primarySwatch: Colors.blue,
        primaryColor: const Color(0xFF2196f3),
        accentColor: const Color(0xFF2196f3),
        canvasColor: const Color(0xFFfafafa),
      ),
      home: new Container(
        child: new MyHomePage(),
        ),


    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key}) : super(key: key);
  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
    @override
    Widget build(BuildContext context) {
      return new Scaffold(
        appBar: new AppBar(
          title: new Text('Web Apps'),
          ),
        body:
          new Card(
              child: new Column(
                mainAxisSize: MainAxisSize.min,
                
                children: <Widget>[
                  new Container(
                    width: 500,
                    height: 100,
                    child: new Center(
                      child: TextField(
                      decoration : InputDecoration(
                        border: OutlineInputBorder(),
                        hintText: 'Enter Your Phone Number'
                       
                      ),
                      
                     )
                    ),
                  ),
                  new Container(
                    
                    child: new FlatButton(
                      onPressed: (){},
                      shape: RoundedRectangleBorder(
                        borderRadius: new BorderRadius.circular(0.0),
                        side: BorderSide(color: Colors.red)
                      ),
                      child: new Text('Search',
                      style: TextStyle(
                        fontSize: 25
                      ),
                      ),
                    ),
                  )
                  
                ],
               
              ),
              
            ),
                   
          );
    
    }
}
   class mybuildingdata extends StatelessWidget {
  

     @override
     Widget build(BuildContext context) {
       return Card(
         child: new Text('data'),
         
       );
     }
   }

这是我想在Home : Card()下面的StatefulWidget中调用的最后一个StatelessWidget。 在StatefulWidget中设置StatelessWidget(mybuildingdata)时出现问题,但出现错误

1 个答案:

答案 0 :(得分:0)

您可以在下面复制粘贴运行完整代码
您可以使用Column来包装Cardmybuildingdata
并使用Expanded flex控制尺寸

代码段

body: Column(
        children: <Widget>[
          Expanded(
            flex: 5,
            child: new Card(

工作演示

enter image description here 完整代码

import 'package:flutter/material.dart';

void main() {
  runApp(new MyApp());
}

class MyApp extends StatelessWidget {
  get children => null;

  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Generated App',
      theme: new ThemeData(
        primarySwatch: Colors.blue,
        primaryColor: const Color(0xFF2196f3),
        accentColor: const Color(0xFF2196f3),
        canvasColor: const Color(0xFFfafafa),
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key}) : super(key: key);
  @override
  _MyHomePageState createState() => new _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        title: new Text('Web Apps'),
      ),
      body: Column(
        children: <Widget>[
          Expanded(
            flex: 5,
            child: new Card(
              child: new Column(
                mainAxisSize: MainAxisSize.min,
                children: <Widget>[
                  new Container(
                    width: 500,
                    height: 100,
                    child: new Center(
                        child: TextField(
                      decoration: InputDecoration(
                          border: OutlineInputBorder(),
                          hintText: 'Enter Your Phone Number'),
                    )),
                  ),
                  new Container(
                    child: new FlatButton(
                      onPressed: () {},
                      shape: RoundedRectangleBorder(
                          borderRadius: new BorderRadius.circular(0.0),
                          side: BorderSide(color: Colors.red)),
                      child: new Text(
                        'Search',
                        style: TextStyle(fontSize: 25),
                      ),
                    ),
                  )
                ],
              ),
            ),
          ),
          Expanded(flex: 1, child: mybuildingdata()),
        ],
      ),
    );
  }
}

class mybuildingdata extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Card(
      child: new Text('data'),
    );
  }
}