ServicePetrolPagev3.dart

import 'package:flutter/material.dart';
import 'package:http/http.dart' as http;
import 'dart:convert';
import 'dart:async';

class ServicePetrolPage extends StatefulWidget {
  @override
  _ServicePetrolPage createState() => _ServicePetrolPage();
}

class _ServicePetrolPage extends State<ServicePetrolPage> {
  int _counter = 0;
  String dropdownBrand = "All";
  String dropdownDistance = "All";
  String dropdownPrice = "All";
  String dropdownFacilities = "All";
  List<PetrolItem> _petrolList; // original list fetched from API
  List<PetrolItem> _displayedList; // displayed list, whether filtered or sorted
  TextEditingController textController = new TextEditingController();

  void _incrementCounter() {
    setState(() {
      // This call to setState tells the Flutter framework that something has
      // changed in this State, which causes it to rerun the build method below
      // so that the display can reflect the updated values. If we changed
      // _counter without calling setState(), then the build method would not be
      // called again, and so nothing would appear to happen.
      _counter++;
    });
  }

  onSearchTextChanged(String input) async {
    if (input.isNotEmpty){
      setState(() {

        _displayedList = _petrolList
            .where((PetrolItem item) => item.location.toLowerCase().contains(input.toLowerCase()))
            .toList();
      });
    } else {
      setState(() {
        // no search field input, display all items
        _displayedList = _petrolList;
      });
    }
  }

  Future<List<PetrolItem>> _getPetrolList() async {
    return _petrolList;
  }

  void _fetchData() async {
    var data = await http.get("http://157.230.131.4/gda-api-dev/petrol.php");

    var jsonData = json.decode(data.body);

    List<PetrolItem> petrolList = [];

    for (var u in jsonData) {
      PetrolItem petrol = PetrolItem(u["brand"], u["location"], double.parse(u["distance"]), double.parse(u["price"]), u["facilities"]);
      print(petrol);
      petrolList.add(petrol);
    }

    setState(() {
      _petrolList = petrolList;
      _displayedList = _petrolList;
    });
  }

  @override
  void initState() {
    super.initState();
    _fetchData();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('Petrol'),
      ),
      body: Container(
          child: SafeArea(
              child: Padding(
                padding: const EdgeInsets.all(16.0),
                child:
                Column(mainAxisAlignment: MainAxisAlignment.spaceAround, children: <
                    Widget>[
                  SizedBox(
                    height: 120,
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.spaceAround,
                      children: <Widget>[
                        Expanded(
                          child: Card(
                            child: new ListTile(
                              leading: new Icon(Icons.search),
                              title: new TextField(
                                controller: textController,
                                decoration: new InputDecoration(
                                    hintText: 'Search', border: InputBorder.none),
                                onChanged: onSearchTextChanged,
                              ),
                              trailing: new IconButton(icon: new Icon(Icons.cancel), onPressed: () {
                                textController.clear();
                                onSearchTextChanged('');
                              },),
                            ),
                          ),
                        ),
                        SizedBox(
                          child: Row(
                            children: <Widget>[
                              Expanded(
                                child: Padding(
                                  padding: const EdgeInsets.symmetric(horizontal: 2),
                                  child: DropdownButton<String>(
                                      value: dropdownBrand,

                                      onChanged: (String newValue) {
                                        setState(() {
                                          dropdownBrand = newValue;

                                          if (dropdownBrand == "All"){
                                            setState(() {
                                              // no search field input, display all items
                                              _displayedList = _petrolList;
                                            });
                                          }
                                          else {
                                            setState(() {

                                              _displayedList = _petrolList
                                                  .where((PetrolItem item) => item.brand.toString().toLowerCase() == dropdownBrand.toString().toLowerCase())
                                                  .toList();
                                            });
                                          }
                                        });
                                      },
                                      items: <String>['All','Shell', 'Esso', 'Castrol', 'Star', 'Sinopec']
                                          .map<DropdownMenuItem<String>>((String value) {
                                        return DropdownMenuItem<String>(
                                          value: value,
                                          child: Text(value),
                                        );
                                      })
                                          .toList(), isExpanded: false, hint: Text("Brand")),
                                ),
                              ),
                              Expanded(
                                child: Padding(
                                  padding: const EdgeInsets.symmetric(horizontal: 2),
                                  child: DropdownButton<String>(
                                      value: dropdownDistance,
                                      onChanged: (String newValue) {
                                        setState(() {
                                          dropdownDistance = newValue;

                                          if (dropdownDistance == "All"){
                                            _displayedList = _petrolList;
                                          }

                                          else if (dropdownDistance == "Near to far"){
                                            _displayedList.sort((a,b) => a.distance.compareTo(b.distance));
                                          }
                                          else {
                                            _displayedList.sort((a,b) => b.distance.compareTo(a.distance));
                                          }
                                        });
                                      },
                                      items: <String>[
                                        'All',
                                        'Near to far',
                                        'Far to near'
                                      ].map<DropdownMenuItem<String>>((String value) {
                                        return DropdownMenuItem<String>(
                                          value: value,
                                          child: Text(value),
                                        );
                                      }).toList(),
                                      hint: Text("Location")),
                                ),
                              ),
/*                              Expanded(
                                child: Padding(
                                  padding: const EdgeInsets.symmetric(horizontal: 3),
                                  child: DropdownButton<String>(
                                      value: dropdownPrice,
                                      onChanged: (String newValue) {
                                        setState(() {
                                          dropdownPrice = newValue;
                                          if (dropdownPrice == "Low to high"){
                                            _displayedList = _petrolList;
                                            _displayedList.sort((a,b) => a.price.compareTo(b.price));
                                          }
                                          else {
                                            _displayedList = _petrolList;
                                            _displayedList.sort((a,b) => b.price.compareTo(a.price));
                                          }
                                        });
                                      },
                                      items: <String>[
                                        'Low to high',
                                        'High to low'
                                      ].map<DropdownMenuItem<String>>((String value) {
                                        return DropdownMenuItem<String>(
                                          value: value,
                                          child: Text(value),
                                        );
                                      }).toList(),
                                      hint: Text("Price")),
                                ),

                              )*/

                              Expanded(
                                child: Padding(
                                  padding: const EdgeInsets.symmetric(horizontal: 2),
                                  child: DropdownButton<String>(
                                      value: dropdownFacilities,
                                      onChanged: (String newValue) {
                                        setState(() {
                                          dropdownFacilities = newValue;

                                          if (dropdownFacilities == "All"){
                                            if ((dropdownBrand == "All") && (dropdownDistance == "All")){

                                              setState(() {
                                                _displayedList = _petrolList;
                                              });

                                            }
                                            else {
                                              if (dropdownBrand != "All" && dropdownDistance == "All"){
                                                _displayedList = _petrolList;
                                                _displayedList = _displayedList
                                                    .where((PetrolItem item) => item.brand.toString().toLowerCase() == dropdownBrand.toString().toLowerCase())
                                                    .toList();
                                              }
                                              else if (dropdownBrand != "All" && dropdownDistance == "Near to far"){
                                                _displayedList = _petrolList;
                                                _displayedList = _displayedList
                                                    .where((PetrolItem item) => item.brand.toString().toLowerCase() == dropdownBrand.toString().toLowerCase())
                                                    .toList();
                                                _displayedList.sort((a,b) => a.distance.compareTo(b.distance));
                                              }
                                              else if (dropdownBrand != "All" && dropdownDistance == "Far to near"){
                                                _displayedList = _petrolList;
                                                _displayedList = _displayedList
                                                    .where((PetrolItem item) => item.brand.toString().toLowerCase() == dropdownBrand.toString().toLowerCase())
                                                    .toList();
                                                _displayedList.sort((a,b) => b.distance.compareTo(a.distance));
                                              }
                                            }
                                          }
                                          else {
                                            if ((dropdownBrand != "All") && (dropdownDistance != "All")){
                                              if (dropdownDistance == "Near to far"){
                                                _displayedList = _petrolList;

                                                _displayedList.sort((a,b) => a.price.compareTo(b.price));

                                                _displayedList = _displayedList
                                                    .where((PetrolItem item) => item.brand.toString().toLowerCase() == dropdownBrand.toString().toLowerCase() &&
                                                    item.facilities.toString().toLowerCase() == dropdownFacilities.toString().toLowerCase())
                                                    .toList();
                                              }
                                              else {
                                                _displayedList = _petrolList;

                                                _displayedList.sort((a,b) => b.price.compareTo(a.price));

                                                _displayedList
                                                    .where((PetrolItem item) => item.brand.toString().toLowerCase() == dropdownBrand.toString().toLowerCase() &&
                                                    item.facilities.toString().toLowerCase() == dropdownFacilities.toString().toLowerCase())
                                                    .toList();

                                              }
                                            }
                                            else if (dropdownBrand == "All" && dropdownDistance != "All"){
                                              if (dropdownDistance == "Near to far"){

                                                _displayedList = _petrolList;
                                                _displayedList.sort((a,b) => a.price.compareTo(b.price));
                                                _displayedList = _displayedList
                                                    .where((PetrolItem item) => item.facilities.toString().toLowerCase() == dropdownFacilities.toString().toLowerCase())
                                                    .toList();
                                              }
                                              else {
                                                _displayedList = _petrolList;
                                                _displayedList.sort((a,b) => b.price.compareTo(a.price));
                                                _displayedList = _displayedList
                                                    .where((PetrolItem item) => item.facilities.toString().toLowerCase() == dropdownFacilities.toString().toLowerCase())
                                                    .toList();
                                              }
                                            }
                                            else if (dropdownBrand != "All" && dropdownDistance == "All"){
                                              _displayedList = _petrolList;
                                              _displayedList = _displayedList
                                                  .where((PetrolItem item) => item.brand.toString().toLowerCase() == dropdownBrand.toString().toLowerCase() && item.facilities.toString().toLowerCase() == dropdownFacilities.toString().toLowerCase())
                                                  .toList();
                                            }
                                            else if (dropdownBrand == "All" && dropdownDistance == "All"){
                                              _displayedList = _petrolList;
                                              _displayedList = _displayedList
                                                  .where((PetrolItem item) => item.facilities.toString().toLowerCase() == dropdownFacilities.toString().toLowerCase())
                                                  .toList();
                                            }
                                          }
                                        });
                                      },
                                      items: <String>[
                                        "All",
                                        "ATM",
                                        "Toilet",
                                        "Restaurant",
                                      ].map<DropdownMenuItem<String>>((String value) {
                                        return DropdownMenuItem<String>(
                                          value: value,
                                          child: Text(value),
                                        );
                                      }).toList(),
                                      hint: Text("Facility")),
                                ),

                              )
                            ],
                          ),
                        ),
                      ],
                    ),
                  ),
                  new Expanded(child: FutureBuilder(
                    future: _getPetrolList(),
                    builder: (BuildContext context, AsyncSnapshot snapshot) {
                      if (snapshot.data == null) {
                        return Container(
                            child: Center(
                              child: new Column(
                                mainAxisSize: MainAxisSize.min,
                                children: [
                                  new CircularProgressIndicator(),
                                  new Text("Loading..."),
                                ],
                              ),
                            ));
                      }

                      return ListView.builder(
                          itemBuilder: (context, position) {
                            return Column(
                              children: <Widget>[
                                Row(
                                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                                  children: <Widget>[
                                    Column(
                                      crossAxisAlignment: CrossAxisAlignment.start,
                                      children: <Widget>[
                                        Padding(
                                            padding:
                                            const EdgeInsets.fromLTRB(12.0, 12.0, 12.0, 6.0),
                                            child: Image.asset("assets/images/"+ _displayedList[position].brand+".jpg", height: 40, width: 40)
                                        ),
                                        Padding(
                                          padding:
                                          const EdgeInsets.fromLTRB(12.0, 6.0, 12.0, 12.0),
                                          child: Text(
                                            _displayedList[position].location,
                                            style: TextStyle(fontSize: 18.0, fontWeight: FontWeight.bold),
                                          ),
                                        ),
                                        Padding(
                                          padding:
                                          const EdgeInsets.fromLTRB(12.0, 6.0, 12.0, 12.0),
                                          child: Text(
                                            _displayedList[position].distance.toString()+" KM",
                                            style: TextStyle(fontSize: 18.0),
                                          ),
                                        ),
                                      ],
                                    ),
                                    Padding(
                                      padding: const EdgeInsets.all(8.0),
                                      child: Column(
                                        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                                        children: <Widget>[
                                          Text(
                                            "\$"+ _displayedList[position].price.toString(),
                                            style: TextStyle(color: Colors.grey),
                                          ),
                                          Padding(
                                            padding: const EdgeInsets.all(8.0),
                                            child:   Text(
                                              _displayedList[position].facilities.toString(),
                                              style: TextStyle(color: Colors.grey),
                                            ),
                                          ),
                                        ],
                                      ),
                                    ),
                                  ],
                                ),
                                Divider(
                                  height: 2.0,
                                  color: Colors.grey,
                                )
                              ],
                            );
                          },
                          itemCount: _displayedList.length
                      );
                    },
                  )),
                ]),
              ))),
    );
  }
}

class PetrolItem {
  final String brand;
  final String location;
  final double distance;
  final double price;
  final String facilities;

  PetrolItem(this.brand, this.location, this.distance, this.price, this.facilities);

  String toString() {
    return "$brand"+" "+"$location"+" "+"$price";
  }
}