flutter_typeahead_plugin 0.0.4

  • README.md
  • CHANGELOG.md
  • Example
  • Installing
  • Versions
  • 78

Flutter TypeAhead plugin

A plugin built for Flutter that provides a TypeAhead Widget.

Getting Started

Simply import the Widget, give it an API of your own you want to call, and Go!
The source code repository is located here: https://github.com/jebright/flutter_typeahead_plugin

Example

You can find this working example under the example/lib folder:

Step 1 - define your API

This component expects you to supply it an API to call. You can create your own or wrap an existing one. The onlye requirement is that it adheres to the following interface:

//A simple class that provides a success/fail indicator as well as a model (result) of the specified type.
class ServiceResult<T> {
  bool ok;
  T model;
}

//A simple interface to abstract how we can search
abstract class SearchApi<T> {
  Future<ServiceResult> exec<T>(String input);
}

Here is the full source of the example provided with this Typeahead:

import 'dart:async';
import 'package:flutter_typeahead_plugin/search.dart';
import 'package:flutter_typeahead_plugin/service_result.dart';

class SampleApi<T> extends SearchApi
{

  var _names =  [
    'Frodo Baggins',
    'Bilbo Baggins',
    'Samwise Gamgee',
    'Peregrin Took',
    'Meriadoc Brandybuck',
    'Gandalf Greyham',
  ];

  @override
    Future<ServiceResult<Iterable<String>>> exec<T>(String input) async {
      await new Future.delayed(new Duration(seconds: 3)); //simulate a slow response
      var results = _names.where((x) => x.toLowerCase().contains(input.trim().toLowerCase())).toList();
      final ServiceResult<Iterable<String>> sr = new ServiceResult<Iterable<String>>();
      sr.model = results;
      sr.ok = true;
      return new Future.value(sr);
    }
}

In my example, I return local data, but there is nothing preventing you from calling a restful service or any API for that matter - as long as you map it into the expected format for all responses (ServiceResult<T>).

Step 2 - create the Typeahead component

You can use any layout you want, but here is the approach taken in the example (see /example/lib/main.dart in the source code):

body: new Column(
    children: <Widget>[
          new TypeAhead(api),
    ],
),

The only requirement of the TypeAhead is that you pass it the api you want to call.

Questions, Bugs, or Feature Requests?

Visit the github repository and let me know!

Final Notes

I also discuss this component on my blog here - https://codingwithjoe.com/a-flutter-typeahead-component

0.0.1

Initial version. A very simple looking, but easy to use TypeAhead widget

0.0.2

Upgrading to flutter 0.6.0.

0.0.3

Upgrading RxDart to version 0.18.1

0.0.4

Supporting latest flutter beta.

example/lib/main.dart

import 'package:flutter/material.dart';

import 'package:flutter_typeahead_plugin/type_ahead.dart';
import 'sample_api.dart';

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

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => new _MyAppState();
}

class _MyAppState extends State<MyApp> {
  //String _platformVersion = 'Unknown';
  SampleApi api;

  _MyAppState() {
    api = new SampleApi<String>();
  }

  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      home: new Scaffold(
        appBar: new AppBar(
          title: const Text('Flutter Typeahead Demo'),
        ),
        body: new Column(
        children: <Widget>[
          new TypeAhead(api),
        ],
      ),
      ),
     theme: new ThemeData(
        primarySwatch: Colors.orange,
      ),
    );
  }
}

Use this package as a library

1. Depend on it

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


dependencies:
  flutter_typeahead_plugin: ^0.0.4

2. Install it

You can install packages from the command line:

with Flutter:


$ flutter packages get

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

3. Import it

Now in your Dart code, you can use:


import 'package:flutter_typeahead_plugin/search.dart';
import 'package:flutter_typeahead_plugin/service_result.dart';
import 'package:flutter_typeahead_plugin/service_state.dart';
import 'package:flutter_typeahead_plugin/type_ahead.dart';
  
Version Uploaded Documentation Archive
0.0.4 Sep 22, 2018 Go to the documentation of flutter_typeahead_plugin 0.0.4 Download flutter_typeahead_plugin 0.0.4 archive
0.0.3 Sep 2, 2018 Go to the documentation of flutter_typeahead_plugin 0.0.3 Download flutter_typeahead_plugin 0.0.3 archive
0.0.2 Sep 1, 2018 Go to the documentation of flutter_typeahead_plugin 0.0.2 Download flutter_typeahead_plugin 0.0.2 archive
0.0.1 Aug 16, 2018 Go to the documentation of flutter_typeahead_plugin 0.0.1 Download flutter_typeahead_plugin 0.0.1 archive
Popularity:
Describes how popular the package is relative to other packages. [more]
60
Health:
Code health derived from static analysis. [more]
100
Maintenance:
Reflects how tidy and up-to-date the package is. [more]
90
Overall:
Weighted score of the above. [more]
78
Learn more about scoring.

We analyzed this package on Nov 14, 2018, and provided a score, details, and suggestions below. Analysis was completed with status completed using:

  • Dart: 2.0.0
  • pana: 0.12.6
  • Flutter: 0.11.3

Platforms

Detected platforms: Flutter

References Flutter, and has no conflicting libraries.

Maintenance suggestions

Package is pre-v0.1 release. (-10 points)

While there is nothing inherently wrong with versions of 0.0.*, it usually means that the author is still experimenting with the general direction of the API.

Dependencies

Package Constraint Resolved Available
Direct dependencies
Dart SDK >=1.19.0 <3.0.0
flutter 0.0.0
rxdart ^0.18.1 0.18.1 0.19.0
Transitive dependencies
collection 1.14.11
meta 1.1.6
sky_engine 0.0.99
typed_data 1.1.6
vector_math 2.0.8