Question

我刚刚开始学习如何快速开发应用程序...

但是我有话要问：

试图在所有屏幕的特定位置放置一些小部件。

例如，这是我的代码：

 class _HomePageState extends State<HomePage> {
 @override
 Widget build(BuildContext context) {
return new Scaffold(
  body: new Container(
      child: Column(
    children: [
      Container(
        padding: EdgeInsets.only(top: 50.0),
        child: new Image.asset(
          'assets/images/walk1ar.png',
          fit: BoxFit.cover,
          height: 30.0,
          width: 169.0,
          alignment: Alignment.center,
        ),
      ),
      new Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Container(
            padding: EdgeInsets.only(top: 30.0, bottom: 5.0),
            child: new Image.asset(
              'assets/images/walkside.png',
              fit: BoxFit.cover,
              height: 445.0,
              width: 14.0,
              alignment: Alignment.centerRight,
            ),
          ),
          Container(
            padding: EdgeInsets.only(
                top: 30.0, bottom: 5.0, left: 50.0, right: 50.0),
            child: new Image.asset(
              'assets/images/walkpic1.png',
              fit: BoxFit.cover,
              height: 445.0,
              width: 250.0,
              alignment: Alignment.center,
            ),
          ),
          Container(
            padding: EdgeInsets.only(top: 30.0, bottom: 5.0),
            child: new Image.asset(
              'assets/images/walkside.png',
              fit: BoxFit.cover,
              height: 445.0,
              width: 14.0,
              alignment: Alignment.centerLeft,
            ),
          ),
        ],
      ),
      new Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Container(
              child: Text(
                'اهلاً وسهلاً',
                style:
                    new TextStyle(fontSize: 20.0, color: Color(0xFF49C275)),
              )),
        ],
      ),
      new Row(
        mainAxisAlignment: MainAxisAlignment.center,
        children: <Widget>[
          Container(
              padding: EdgeInsets.only(bottom: 5.0),
              child: Text(
                'أهلا وسهلا بكم في معرض وظائف ٢٠١٨',
                style:
                    new TextStyle(fontSize: 14.0, color: Color(0xFF707070)),
              )),
        ],
      ),
      new Column(
        crossAxisAlignment: CrossAxisAlignment.stretch,
        mainAxisAlignment: MainAxisAlignment.end,
        children: <Widget>[
          Container(
            child: new RaisedButton(
              child: const Text(
                'إبدأ',
              ),
              color: Color(0xFF49C275),
              elevation: 71.0,
              splashColor: Colors.blueGrey,
              onPressed: () {
                // Perform some action
              },
            ),
          )
        ],
      ),
    ],
  )),
);

}

在这里，我希望最后一个小部件（即按钮）始终位于屏幕底部...还有步行侧图像..我希望一个粘贴在屏幕右侧，而另一个粘贴在左侧..

怎么做？

Answer 1

您可以使用堆栈并将按钮对准屏幕的末端。这是一个示例：

Stack(        
     children: <Widget>[
         Align(
            alignment: Alignment.bottomCenter,
            child: Container(
            width: width,
            height: 40.0,
             child: RaisedButton(
            color: azulClaro,
            child: Text(
                   'My Button',
                   style: TextStyle(
                     color: Colors.white,
                    ),
                   ),
               ),
           ),
        ),
     ],
  );

在所有屏幕中为小部件指定特定位置

1 个答案: