autocompeletetxtfield 0.0.7
autocompeletetxtfield #
New flutter widget used to complete the input in the text field automatically from the given suggestion with very easy implemention i dont think that`s this is the first but i hoped to try to publish a custom widget created by me and share it with you guys
Getting Started #
Hello devs to start using this please start with add ' autocompeletetxtfield: ^0.0.5 ' in your pubspec.yaml file Enjoy it :)
Small Example #
Full Example #
you can go to EXAMPLE section to see the code
Example #
import 'package:flutter/material.dart';
import 'AutoCompeleteTxtField/MultiAutoCompeleteTxtField.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
List<String> countries;
@override
Widget build(BuildContext context) {
return MaterialApp(
home: mainPage()
);
}
}
class mainPage extends StatefulWidget {
@override
_MainState createState() => _MainState();
}
class _MainState extends State<mainPage> {
List<String> countries;
@override
void initState() {
countries=["Egypt","USA","UK","Russia","France","Spain","Itally","San Andrias","Estonia","Ecuador","Eran","Ethiopia","Etria","Erangle"];
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
backgroundColor: Colors.white,
appBar: AppBar(),
body:Column(
children: <Widget>[
AutoCompeleteTextField(
decoration: InputDecoration(
labelText: 'Search',
border: OutlineInputBorder()
),
suggestions: countries,
listElevation: 9.0,
collapsed: true,
onTextSubmited: (val){
},
),
AutoCompeleteTextField(
decoration: InputDecoration(
labelText: 'Search',
border: UnderlineInputBorder()
),
suggestions: countries,
listElevation: 6.0,
collapsed: false,
width: 200.0,
onTextSubmited: (val){
},
),
],
)
);
}
}
[0.0.6] - April 2, 2020 #
- Nothing change just testing few things
[0.0.7] - April 8, 2020 #
More customization added :
- background for the textFieldbar
- border radius for the textFieldbar if u added the background color
- Elevation for the textFieldbar if u added the background color
##Full Example main.dart
import 'package:flutter/material.dart';
import 'package:autocompeletetxtfield/autocompeletetxtfield.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
List<String> countries;
@override
Widget build(BuildContext context) {
return MaterialApp(
home: MainPage()
);
}
}
class MainPage extends StatefulWidget {
@override
_MainState createState() => _MainState();
}
class _MainState extends State<MainPage> {
List<String> countries;
var width,hight;
var clr;
var currItem = 0;
@override
void initState() {
countries=["Afghanistan",
"Albania",
"Algeria",
"American Samoa",
"Andorra",
"Angola",
"Anguilla",
"Antarctica",
"Antigua and Barbuda",
"Argentina",
"Armenia",
"Aruba",
"Australia",
"Austria",
"Azerbaijan",
"Bahamas (the)",
"Bahrain",
"Bangladesh",
"Barbados",
"Belarus",
"Belgium",
"Belize",
"Benin",
"Bermuda",
"Bhutan",
"Bolivia (Plurinational State of)",
"Bonaire, Sint Eustatius and Saba",
"Bosnia and Herzegovina",
"Botswana",
"Bouvet Island",
"Brazil",
"British Indian Ocean Territory (the)",
"Brunei Darussalam",
"Bulgaria",
"Burkina Faso",
"Burundi",
"Cabo Verde",
"Cambodia",
"Cameroon",
"Canada",
"Cayman Islands (the)",
"Central African Republic (the)",
"Chad",
"Chile",
"China",
"Christmas Island",
"Cocos (Keeling) Islands (the)",
"Colombia",
"Comoros (the)",
"Congo (the Democratic Republic of the)",
"Congo (the)",
"Cook Islands (the)",
"Costa Rica",
"Croatia",
"Cuba",
"Curaçao",
"Cyprus",
"Czechia",
"Côte d'Ivoire",
"Denmark",
"Djibouti",
"Dominica",
"Dominican Republic (the)",
"Ecuador",
"Egypt",
"El Salvador",
"Equatorial Guinea",
"Eritrea",
"Estonia",
"Eswatini",
"Ethiopia",
"Falkland Islands (the) [Malvinas]",
"Faroe Islands (the)",
"Fiji",
"Finland",
"France",
"French Guiana",
"French Polynesia",
"French Southern Territories (the)",
"Gabon",
"Gambia (the)",
"Georgia",
"Germany",
"Ghana",
"Gibraltar",
"Greece",
"Greenland",
"Grenada",
"Guadeloupe",
"Guam",
"Guatemala",
"Guernsey",
"Guinea",
"Guinea-Bissau",
"Guyana",
"Haiti",
"Heard Island and McDonald Islands",
"Holy See (the)",
"Honduras",
"Hong Kong",
"Hungary",
"Iceland",
"India",
"Indonesia",
"Iran (Islamic Republic of)",
"Iraq",
"Ireland",
"Isle of Man",
"Israel",
"Italy",
"Jamaica",
"Japan",
"Jersey",
"Jordan",
"Kazakhstan",
"Kenya",
"Kiribati",
"Korea (the Democratic People's Republic of)",
"Korea (the Republic of)",
"Kuwait",
"Kyrgyzstan",
"Lao People's Democratic Republic (the)",
"Latvia",
"Lebanon",
"Lesotho",
"Liberia",
"Libya",
"Liechtenstein",
"Lithuania",
"Luxembourg",
"Macao",
"Madagascar",
"Malawi",
"Malaysia",
"Maldives",
"Mali",
"Malta",
"Marshall Islands (the)",
"Martinique",
"Mauritania",
"Mauritius",
"Mayotte",
"Mexico",
"Micronesia (Federated States of)",
"Moldova (the Republic of)",
"Monaco",
"Mongolia",
"Montenegro",
"Montserrat",
"Morocco",
"Mozambique",
"Myanmar",
"Namibia",
"Nauru",
"Nepal",
"Netherlands (the)",
"New Caledonia",
"New Zealand",
"Nicaragua",
"Niger (the)",
"Nigeria",
"Niue",
"Norfolk Island",
"Northern Mariana Islands (the)",
"Norway",
"Oman",
"Pakistan",
"Palau",
"Palestine, State of",
"Panama",
"Papua New Guinea",
"Paraguay",
"Peru",
"Philippines (the)",
"Pitcairn",
"Poland",
"Portugal",
"Puerto Rico",
"Qatar",
"Republic of North Macedonia",
"Romania",
"Russian Federation (the)",
"Rwanda",
"Réunion",
"Saint Barthélemy",
"Saint Helena, Ascension and Tristan da Cunha",
"Saint Kitts and Nevis",
"Saint Lucia",
"Saint Martin (French part)",
"Saint Pierre and Miquelon",
"Saint Vincent and the Grenadines",
"Samoa",
"San Marino",
"Sao Tome and Principe",
"Saudi Arabia",
"Senegal",
"Serbia",
"Seychelles",
"Sierra Leone",
"Singapore",
"Sint Maarten (Dutch part)",
"Slovakia",
"Slovenia",
"Solomon Islands",
"Somalia",
"South Africa",
"South Georgia and the South Sandwich Islands",
"South Sudan",
"Spain",
"Sri Lanka",
"Sudan (the)",
"Suriname",
"Svalbard and Jan Mayen",
"Sweden",
"Switzerland",
"Syrian Arab Republic",
"Taiwan (Province of China)",
"Tajikistan",
"Tanzania, United Republic of",
"Thailand",
"Timor-Leste",
"Togo",
"Tokelau",
"Tonga",
"Trinidad and Tobago",
"Tunisia",
"Turkey",
"Turkmenistan",
"Turks and Caicos Islands (the)",
"Tuvalu",
"Uganda",
"Ukraine",
"United Arab Emirates (the)",
"United Kingdom of Great Britain and Northern Ireland (the)",
"United States Minor Outlying Islands (the)",
"United States of America (the)",
"Uruguay",
"Uzbekistan",
"Vanuatu",
"Venezuela (Bolivarian Republic of)",
"Viet Nam",
"Virgin Islands (British)",
"Virgin Islands (U.S.)",
"Wallis and Futuna",
"Western Sahara",
"Yemen",
"Zambia",
"Zimbabwe",
"Åland Islands"];
clr = Colors.white;
super.initState();
}
ScrollController scrollcontroller = ScrollController();
@override
Widget build(BuildContext context) {
width = MediaQuery.of(context).size.width;
hight = MediaQuery.of(context).size.height;
return Scaffold(
backgroundColor: Colors.white,
appBar: AppBar(
title: Text("Auto Complete Text Field"),
),
body:Stack(
children: <Widget>[
lstView(),
searchBar()
],
)
);
}
ListView lstView() => ListView.builder(
itemCount: countries.length,
padding: EdgeInsets.only(top: 80),
controller: scrollcontroller,
itemBuilder: (context,index) => Card(
color: index == currItem ? Colors.green : clr,
elevation: 5,
child: ListTile(
onTap: (){
print(scrollcontroller.offset);
},
title: Text(countries[index]),
),
)
);
Widget searchBar() => Positioned(
top: 10,
left: 5,
right: 5,
child: Stack(
alignment: Alignment.center,
children: <Widget>[
AutoCompeleteTextField(
suggestions: countries,
collapsed: false,
listElevation: 5.0,
width: (width)-30.0,
decoration: InputDecoration(
border: UnderlineInputBorder(
borderRadius: BorderRadius.circular(10)
),
labelText: "Search Here",
filled: true,
fillColor: Colors.white,
),
onTextSubmited: (value){
var index=countries.indexOf(value);
scrollcontroller.animateTo(index*61.0,
duration: Duration(seconds: 1),
curve: Curves.fastOutSlowIn).then((val){
setState(() {
currItem = index;
});
});
},
)
],
)
);
}
Use this package as a library
1. Depend on it
Add this to your package's pubspec.yaml file:
dependencies:
autocompeletetxtfield: ^0.0.7
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:autocompeletetxtfield/autocompeletetxtfield.dart';
|
Popularity:
Describes how popular the package is relative to other packages.
[more]
|
48
|
|
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]
|
72
|
Learn more about scoring.
We analyzed this package on Jul 2, 2020, and provided a score, details, and suggestions below. Analysis was completed with status completed using:
- Dart: 2.8.4
- pana: 0.13.13
- Flutter: 1.17.5
Analysis suggestions
Package not compatible with SDK dart
because of import path [autocompeletetxtfield] that is in a package requiring null.
Health suggestions
Format lib/src/AutoCompeleteTxtField.dart.
Run flutter format to format lib/src/AutoCompeleteTxtField.dart.
Maintenance suggestions
Package is pre-v0.1 release. (-10 points)
While nothing is inherently wrong with versions of 0.0.*, it might mean that the author is still experimenting with the general direction of the API.
Dependencies
| Package | Constraint | Resolved | Available |
|---|---|---|---|
| Direct dependencies | |||
| Dart SDK | >=2.1.0 <3.0.0 | ||
| flutter | 0.0.0 | ||
| Transitive dependencies | |||
| collection | 1.14.12 | 1.14.13 | |
| meta | 1.1.8 | ||
| sky_engine | 0.0.99 | ||
| typed_data | 1.1.6 | 1.2.0 | |
| vector_math | 2.0.8 | ||
| Dev dependencies | |||
| flutter_test | |||