-1

我有 3 列我想使用这些列制作不可滚动的屏幕 前 2 列只有一个图像 最后一列有一行,其中有四个图标我想在最后一列放置一个在屏幕底部有一个行图标对于每种尺寸的屏幕,我现在都想要它的样子

在此处输入图像描述

     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');}
                              ),
                            )
                          ],
                        ),
                      ),
                    ],
                  ),
                ],
              ),
            )
        )
4

2 回答 2

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),
            ],
          ),
        ),
      ],
    );
  }
}

它看起来像这样: 在此处输入图像描述

于 2020-07-17T22:34:31.053 回答
0

Try this in the Widget:


 body: Center(
        child: Column(
          children: <Widget>[
            Text(
              'Start Row',
            ),
            Expanded(child:
              Center(child:Text('Middle Row')),
            ),
            Text('End Row'),
          ],
        ),
      ),

Where you see the text you want to insert a Row. Expand takes all the space in the middle no matter how big your screen. You can cascade that design idea.

于 2020-07-17T23:58:35.880 回答