当用户在颤动中滚动时如何拉伸图像

Posted 2023-02-23

【中文标题】当用户在颤动中滚动时如何拉伸图像

【英文标题】：How to stretch an image when user scrolls in flutter

【发布时间】：2021-02-23 03:25:06

【问题描述】：

我想在用户滚动时拉伸图像。

Container(
 child: Image.asset(
  'assets/appHeader.png',
   fit: BoxFit.cover,
   width: size.width,
   height: 170,
 ),
)

此图像位于页面顶部，当用户向上滚动时，我想拉伸图像。 这就像 SliverAppBar 中的伸展。我对 Flutter 很陌生，所以我对动画不太了解。

【参考方案1】：

此答案更新关于（您在评论中询问）（仅适用于我们讨论的这种情况）。

  @override
  Widget build(BuildContext context) 
    return Container(
      child: Stack(
        children: [
          Scaffold(
              //same code that above write
              )
        ],
      ),
    );
  

【讨论】：

那我可以加一个栈吗？？

【参考方案2】：

试试这个，我是用 FlexibleSpaceBar 创建的。

  @override
  Widget build(BuildContext context) 
    return Scaffold(
      body: NestedScrollView(
        headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) 
          return <Widget>[
            SliverAppBar(
              expandedHeight: 200.0,
              floating: false,
              //pinned: true, if you need to show appBar.
              pinned: false,

              flexibleSpace: FlexibleSpaceBar(
                  centerTitle: true,
                  title: Text("Image Text(optional)",
                      style: TextStyle(
                        color: Colors.white,
                        fontSize: 16.0,
                      )),
                  background: Image.network(
                    "https://miro.medium.com/max/700/1*_nCC_uFDVYas8uYa9m6fQQ.jpeg",
                    fit: BoxFit.cover,
                  )
                  /*-------Your Image here--------*/
                  /* Image.asset(
          'assets/appHeader.png',
          fit: BoxFit.cover,
          width: size.width,
          height: 170,
          ),*/
                  ),
            ),
          ];
        ,
        body: Center(
          child: Text("Your screen data"),
        ),
      ),
    );
  

【讨论】：

我不希望在滚动到底部时出现标题。

好的，我会根据你的要求更新答案。

另一个问题。我怎样才能在它上面放另一个容器？就像我们在堆栈中做的一样

意味着..你需要在body.或任何其他地方添加容器。我不明白，“我怎样才能把另一个容器放在它上面？？就像我们在堆栈中做的那样”'

我想在 SliverAppBar 上添加容器