expandable_search_bar

Visão geral do pacote

Orientação gerada a partir de informações públicas. Apenas para referência.

Uma barra de pesquisa visualmente atraente e animada para Flutter, oferecendo transições suaves e alta personalização. Ela melhora a experiência do usuário com expansão dinâmica e design intuitivo, adequada para aplicativos que exigem uma interface de busca envolvente. O pacote suporta múltiplas plataformas e permite que os desenvolvedores ajustem sua aparência e comportamento para combinar com o tema do seu aplicativo.

Casos de uso

Melhorando interfaces de pesquisa de aplicativos móveis
Criando experiências interativas de busca na web
Integrando busca animada em aplicativos de desktop
Melhorando a UX em aplicativos de comércio eletrônico
Adicionando barras de pesquisa responsivas aos painéis

Principais recursos

Animação suave expansível
Aparência altamente personalizável
Compatibilidade multiplataforma
Suporta modo escuro
Integração fácil com a interface existente
Gatilhos de pesquisa configuráveis

Indicado para

Desenvolvedores Flutter construindo aplicativos com foco em busca
equipes de UI/UX focadas em design
Aplicativos direcionados a múltiplas plataformas
Desenvolvedores procurando componentes animados
Projetos que exigem estética moderna de barra de pesquisa

Considerações

Pode exigir ajuste de desempenho em dispositivos de baixa configuração
Estilos personalizados podem aumentar o tempo de desenvolvimento
Lógica de pesquisa interna limitada (implementação externa necessária)
Depende do framework de animação do Flutter
Não otimizado para conjuntos de dados muito grandes sem tratamento adicional

README original

Snapshot do README original do repositório-fonte vinculado. Consulte o repositório para o conteúdo mais recente.

Pub

Animated Search Bar

Animated Search Bar package lets you add a beautiful search bar to your Flutter app.

Installation

Add the latest version of package to your pubspec.yaml (and rundart pub get):

dependencies:
  expandable_search_bar: ^latest_version

Import the package and use it in your Flutter App.

import 'package:expandable_search_bar/expandable_search_bar.dart';

Screenshots

⚠Note: As you see in the screenshots this package is only available on Mouse devices (Web, Windows, macOS, Linux), but I'm working on a solution to add mobile devices too.

Example

There are a number of properties that you can modify. Customize them as you want:

width
text
gutter (space between TextField and Button)
background color
icon color
icon background color
shadow under the bar
shadow under the button
animation duration (also for TextField)
animation curve (also for TextField)

class AnimatedBar extends StatelessWidget {  
  const AnimatedBar({
    Key? key,
  }) : super(key: key);

  final TextEditingController? searchController 
  = TextEditingController();

  @override  
  Widget build(BuildContext context) {  
    return Scaffold(  
      body: Center(  
        child: const AnimatedSearchBar(  
          ExpandableSearchBar(
            onTap: () {
              print(
                searchController!.text.toString(),
              );
            },
            hintText: "search something",
            editTextController: searchController,
          ),
        ),  
      ),  
    );  
  }  
}

Next Goals

[ ] Support mobile devices (Unfortunately it's only available for "Mouse" devices).
[ ] Change font style and color for text.

Support

You can support me by following me on and GitHub

And also don't forget to star this package on GitHub

Buscar pacotes, repositórios e categorias de apps

Instalar pacote