Inscription
- Holding the sword in the world, starting from your accumulation, wherever you go, you must strive for perfection, that is, toss every day.

important news

• NetEase Cloud [Fun Big Front-End] Supporting Course

• EDU supporting tutorial

• A series of articles on the accumulation of bits and pieces developed by Flutter

1 Using the wrapper library

1.1 Add dependencies

The editor has written this effect as a dependency library, and readers can directly add dependencies according to their use. The code is as follows:
github method dependency

  flutter_search_bars:
    git:
      url: https://github.com/zhaolongs/flutter_search_bar.git
      ref: master

• 1
• 2
• 3
• 4

pub repository dependencies Check latest version

  #search bar
  flutter_search_bars: ^0.0.1

• 1
• 2

1.2 Guide package

In the place where the search box SearchBar is used, the package is as follows:

import 'package:flutter_search_bars/flutter_search_bars.dart';

• 1

1.3 Use

1.3.1 Default size usage

///This is just a search box for display without input 
///The parameter [heroTag] is used for page transition animation tag 
///The parameter clickCallBack is the current search box click event callback 
SearchStaticBar ( 
	heroTag :  "searchStatidBar" , 
	clickCallBack :  ( )  { 
	  NavigatorUtils . pushPage ( context ,  TestPage2 ( ) ) ; 
	} , 
)

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9

1.3.2 Specify the size to use

 Container ( 
     width :  120 , 
      ///This is just for displaying the search box without inputting 
      ///The parameter [heroTag] is used for page transition animation tag 
      ///The parameter clickCallBack is the current search box click event callback 
      child :  SearchStaticBar ( 
        heroTag :  "searchStatidBar" , 
        clickCallBack :  ( )  { 
          NavigatorUtils . pushPage ( context ,  TestPage2 ( ) ) ; 
        } , 
      ) , 
    )

• 1
• 2
• 3
• 4
• 5
• 6
• 7
• 8
• 9
• 10
• 11
• 12

The operation effect is as follows:

The use case effect is as follows: