Flutter 动画:使用 opencontainer 进行 showSearch

2024-06-25

在颤振中animations包,使用容器变换动画的案例之一是

扩展搜索的搜索栏

现在显示扩展搜索的常用方法是使用showSearch函数,我唯一知道修改搜索动画是通过搜索委托。

有什么办法可以使用吗openContainer with showSearch?或者我应该创建自己的搜索页面来打开openContainer而不是依赖showSearch?


Here I found a Solution that may be complex because in our SearchDelegate we can't 
implement animation implicitly.
We can change the package provided by flutter. GoTO 
<Flutter Sdk Path>\packages\flutter\lib\src\material\search.dart(Ex: 
E:\software\flutter\packages\flutter\lib\src\material\search.dart)
enter code here
Inside  Official Search.dart we can make changes accordingly...

Here what I have done to change the animation Duration and type of Animation itself...

To change the animation DUration: line no 341
  Duration get transitionDuration => const Duration(milliseconds: 700);//give your
// flexible number

To change the animation : line no 353
return your own animation type default there will be FadeTransition from line No 353-356 you can use SlideTransition, ScaleTransition in the place of FadeTransition
return SlideTransition(        //for slide transition return this instead of Fade 
 //Animation
               position: Tween<Offset>(
               begin: const Offset(0, -0.5),
               end: Offset.zero,
             ).animate(animation),
             child: child,
           );
  // ScaleTransition( //for scale transition uncomment this(ZoomIn and Zoom out)
   //   scale: Tween<double>(
   //               begin: 0.0,
   //               end: 1.0,
   //             ).animate(
   //               CurvedAnimation(
   //                 parent: animation,
   //                 curve: Curves.fastOutSlowIn,
   //               ),
   //             ),
   //             child: child,
   //           );

如果您想将标签从“搜索”更改为您的自定义标签 提供您使用 SearchDelegate 扩展的类中的标签 在 super() 内作为属性 searchFieldLabel

  To Change the Label :
  class StoreSearch extends SearchDelegate<String> {
  // @override
  // TODO: implement searchFieldLabel
  StoreSearch()
    : super(
        searchFieldLabel: "StoreSearch",//provide your Label here
     );}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

Flutter 动画:使用 opencontainer 进行 showSearch 的相关文章

随机推荐