如何在颤动的屏幕底部放置一行

时间:2020-07-17 21:59:08

标签: flutter flutter-layout flutter-listview flutter-container flutter-row

我有3列,我想使用这些列制作不可滚动的屏幕 前两列只有一个图像最后一列具有一行,其中有四个图标 我想在屏幕底部放置最后一列,该行的每个尺寸都需要在屏幕底部显示一个行图标 现在看起来如何

enter image description here

     body: Center(
            child: Container(
              decoration: BoxDecoration(
                  gradient: LinearGradient(
                      begin: Alignment.topRight,
                      end: Alignment.bottomLeft,
                      colors: [barColor, Colors.white])),

              child: ListView(
                physics: const NeverScrollableScrollPhysics(),
                children: <Widget>[
                  Column(
                    crossAxisAlignment: CrossAxisAlignment.center,
                    mainAxisSize: MainAxisSize.max,
                    mainAxisAlignment: MainAxisAlignment.start,

                    children: <Widget>[
                      Image.asset(
                        'assets/images/istv.png',
                        fit: BoxFit.cover,
                      ),
                    ],
                  ),
                  InkWell(
                    child:  Column(
                      crossAxisAlignment: CrossAxisAlignment.center,
                      mainAxisSize: MainAxisSize.max,
                      mainAxisAlignment: MainAxisAlignment.center,
                     children: <Widget>[
                       Image.asset(
                         'assets/images/live.png',
                         fit: BoxFit.cover,

                       ),
                     ],
                    ),
                    onTap: (){
                      _launchInApp(_launchUrl);
                    },
                  ),
                  Column(
                    children: <Widget>[
                      Align(
                        alignment: Alignment.bottomCenter,
                        child:  Row(
                          crossAxisAlignment: CrossAxisAlignment.end,
                          children: <Widget>[
                            Expanded(
                              child: InkWell(
                                child :Container(
                                  child: Image.asset(''
                                      'assets/images/fb.png',
                                    height: 200,
                                    fit: BoxFit.cover,
                                  ) ,
                                ),
                                onTap: (){
                                  openfb();
                                },
                              ),
                            ),

                            Expanded(
                              child: InkWell(
                                child :Container(
                                  child: Image.asset(''
                                      'assets/images/insta.png',
                                    height: 200,
                                    fit: BoxFit.cover,
                                  ) ,
                                ),
                                onTap: (){
                                  openinsta();
                                },
                              ),
                            ),
                            Expanded(
                              child: InkWell(
                                child :Container(
                                  child: Image.asset(''
                                      'assets/images/yt.png',
                                    height: 200,
                                    fit: BoxFit.cover,
                                  ) ,
                                ),
                                onTap: (){
                                  openyt();
                                },
                              ),
                            ),

                            Expanded(
                              child: InkWell(
                                  child :Container(

                                    child: Image.asset(''
                                        'assets/images/share.png',

                                      height: 200,

                                      fit: BoxFit.cover,
                                    ) ,
                                  ),
                                  onTap: () {Share.share('check out my website https://example.com');}
                              ),
                            )
                          ],
                        ),
                      ),
                    ],
                  ),
                ],
              ),
            )
        )

2 个答案:

答案 0 :(得分:1)

如果我理解您的问题,这并不容易,那么我相信这就是您想要做的:

class UI62962286 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        Expanded(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: <Widget>[
              Container(
                child: Icon(Icons.accessibility),
                height: 10,
              ),
              Container(
                child: Icon(Icons.account_balance),
                height: 10,
              ),
            ],
          )
        ),
        Container(
          padding: EdgeInsets.all(8.0),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.spaceAround,
            children: <Widget>[
              Icon(Icons.account_balance_wallet),
              Icon(Icons.adb),
              Icon(Icons.account_box),
              Icon(Icons.ac_unit),
            ],
          ),
        ),
      ],
    );
  }
}

它看起来像这样: enter image description here

答案 1 :(得分:0)

在小部件中尝试以下操作:

 Naam.Enabled = False

在此处看到要插入行的文本。无论屏幕有多大,Expand都会占据中间的所有空间。您可以层叠该设计思路。

相关问题