search_page 0.1.0+1

  • Readme
  • Changelog
  • Example
  • Installing
  • new68

Search Page #

Package License Patreon Stars

Fast and easy way to build a custom search experience in you app.

This package aims to provide a simple way to build a search view, using available resources from the Flutter framework. It uses SearchDelegate as its fondation, in oder to build a 'material' experience.

One of the special features of this package is the filter parameter. It's a very simple way to filter out items inside a list, using different string representations.

Also, you can customize suggestion and on-error widgets, provide custom search filters, change AppBar's theme...

Example #

Here is a example on how to use this package. You'd need to call the SearchPage class using the showSearch function built in.

If you want to take a deeper look at the example, take a look at the example folder provided with the project.

FloatingActionButton(
  child: Icon(Icons.search),
  tooltip: 'Search people',
  onPressed: () => showSearch(
    context: context,
    delegate: SearchPage<Person>(
      items: people,
      searchLabel: 'Search people',
      suggestion: Center(
        child: Text('Filter people by name, surname or age'),
      ),
      failure: Center(
        child: Text('No person found :('),
      ),
      filter: (person) => [
        person.name,
        person.surname,
        person.age.toString(),
      ],
      builder: (person) => ListTile(
        title: Text(person.name),
        subtitle: Text(person.surname),
        trailing: Text('${person.age} yo'),
      ),
    ),
  ),
),

Getting Started #

This project is a starting point for a Dart package, a library module containing code that can be shared easily across multiple Flutter or Dart projects.

For help getting started with Flutter, view our online documentation, which offers tutorials, samples, guidance on mobile development, and a full API reference.

Built with #

Authors #

License #

This project is licensed under the GNU GPL v3 License - see the LICENSE.md file for details.

[0.1.0+1] - December 6th, 2019

  • Updated documentation

[0.1.0] - December 3rd, 2019

  • First release!

example/README.md

import 'package:flutter/material.dart';
import 'package:search_page/search_page.dart';

import 'person.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  static List<Person> people = [
    Person('Mike', 'Barron', 64),
    Person('Todd', 'Black', 30),
    Person('Ahmad', 'Edwards', 55),
    Person('Anthony', 'Johnson', 67),
    Person('Annette', 'Brooks', 39),
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Search Page'),
      ),
      body: ListView.builder(
        itemCount: people.length,
        itemBuilder: (context, index) {
          final Person person = people[index];
          return ListTile(
            title: Text(person.name),
            subtitle: Text(person.surname),
            trailing: Text('${person.age} yo'),
          );
        },
      ),
      floatingActionButton: FloatingActionButton(
        tooltip: 'Search people',
        onPressed: () => showSearch(
          context: context,
          delegate: SearchPage<Person>(
            items: people,
            searchLabel: 'Search people',
            suggestion: Center(
              child: Text('Filter people by name, surname or age'),
            ),
            failure: Center(
              child: Text('No person found :('),
            ),
            filter: (person) => [
              person.name,
              person.surname,
              person.age.toString(),
            ],
            builder: (person) => ListTile(
              title: Text(person.name),
              subtitle: Text(person.surname),
              trailing: Text('${person.age} yo'),
            ),
          ),
        ),
        child: Icon(Icons.search),
      ),
    );
  }
}

Use this package as a library

1. Depend on it

Add this to your package's pubspec.yaml file:


dependencies:
  search_page: ^0.1.0+1

2. Install it

You can install packages from the command line:

with Flutter:


$ flutter pub get

Alternatively, your editor might support flutter pub get. Check the docs for your editor to learn more.

3. Import it

Now in your Dart code, you can use:


import 'package:search_page/search_page.dart';
  
Popularity:
Describes how popular the package is relative to other packages. [more]
36
Health:
Code health derived from static analysis. [more]
100
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
100
Overall:
Weighted score of the above. [more]
68
Learn more about scoring.

We analyzed this package on Dec 9, 2019, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.6.1
  • pana: 0.12.21
  • Flutter: 1.9.1+hotfix.6

Platforms

Detected platforms: Flutter

References Flutter, and has no conflicting libraries.

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=2.5.0 <3.0.0
flutter 0.0.0
Transitive dependencies
collection 1.14.11 1.14.12
meta 1.1.7 1.1.8
sky_engine 0.0.99
typed_data 1.1.6
vector_math 2.0.8
Dev dependencies
flutter_test