仅在抖动中显示图像的顶部

时间:2020-09-02 10:29:57

标签: android ios image flutter

在我的应用中,我希望在屏幕的某些部分显示图片,点击阅读更多图片后,图像尺寸需要减小并仅显示图片的顶部

这是正常情况(图片1)

enter image description here

当用户点击阅读更多内容时,我只想显示图像的顶部(图2)

enter image description here

这是我的代码

Widget build(BuildContext context) {
    return Padding(
      padding: EdgeInsets.only(top:4.0),
      child: Column(
        children: <Widget>[
          Expanded(
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.stretch,
              mainAxisAlignment: MainAxisAlignment.start,
              children: <Widget>[
                Stack(
                  children: <Widget>[
                    Image.asset(       //image
                        "images/background.png",
                        height: MediaQuery.of(context).size.height*0.33,
                        width: MediaQuery.of(context).size.width,
                        fit: BoxFit.fill,
                      ),
                    Align(            // for topleft home icon
                      alignment: Alignment.topLeft,
                      child: Container(
                        width: 40, height: 40,
                        margin: EdgeInsets.all(15.0),
                        child: IconButton(
                          icon: new SvgPicture.asset("images/done_icon.svg",height: 30,width: 30,),
                          onPressed: () {},
                        ),
                        decoration: BoxDecoration(
                          shape: BoxShape.circle,
                          color: Colors.black12
                        ),
                      ),
                    ),
                ]
                ),

点击“更多信息”按钮后,我希望将其设计为图片2,只是告诉我需要更改图片,我将在点击事件中添加更多文字信息

1 个答案:

答案 0 :(得分:1)

您可以做的一种方法就是这样。

_G

在dartpad上查看-https://dartpad.dev/558fc0badbbc444d418b76fc01aa45cd