Flutter 条码扫描结果未列出

Question

My application is to search through the list of books. Two different variables (book name or barcode) can be used while searching. There is no problem when searching by name. but when searching with barcode scanning, no results are listed. When I type the barcode manually, the application still works without any problems.

Can u help me?

Manually entered barcode: https://i.stack.imgur.com/njtLA.png

Barcode scan result : https://i.stack.imgur.com/ZsGot.png

My code here..

import 'package:fff/book_tile.dart';
import 'package:flutter/material.dart';
import 'package:flutter_barcode_scanner/flutter_barcode_scanner.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';
import 'package:fff/book_model.dart';

class HomePage extends StatefulWidget {

  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  TextEditingController _controller = new TextEditingController();
  List<Book> _booksForDisplay = [];
  List<Book> _books = [];


  @override
  void initState() {
    super.initState();
    fetchBooks().then((value) {
      setState(() {
        _books.addAll(value);
        _booksForDisplay = _books;
        print(_booksForDisplay.length);
      });
    });
  }


  Future _scan(BuildContext context) async {
    String barcode = await FlutterBarcodeScanner.scanBarcode(
        '#ff0000',
        'İptal',
        true,
        ScanMode.BARCODE
    );
    _controller.text = barcode;
  }

    @override
    Widget build(BuildContext context) {
      return Scaffold(
          appBar: AppBar(
            toolbarHeight: 80,
            title: Padding(
              padding: EdgeInsets.all(8),
              child: Container(
                decoration: BoxDecoration(
                    color: Colors.white,
                    borderRadius: BorderRadius.circular(40)
                ),
                child: Padding(
                  padding: EdgeInsets.symmetric(horizontal: 12),
                  child: TextFormField(
                    textAlignVertical: TextAlignVertical.center,
                    controller: _controller,
                    decoration: InputDecoration(
                        border: InputBorder.none,
                        icon: Icon(Icons.search),
                        suffixIcon: IconButton(
                          icon: Icon(FontAwesomeIcons.barcode),
                          onPressed: (){
                            _scan(context);
                          },
                        )
                    ),
                    onChanged: (string){
                      string = string.toLowerCase();
                      setState(() {
                        _booksForDisplay = _books.where((b){
                          var bName = b.name!.toLowerCase();
                          var bBarcode = b.barcode!.toLowerCase();
                          return bName.startsWith(string) || bBarcode.startsWith(string);
                        }).toList();
                      });
                    },
                  ),
                ),
              ),
            ),
          ),
          body: SafeArea(
            child: Container(
                child: _controller.text.isNotEmpty ? new ListView.builder(
                  itemCount: _booksForDisplay.length,
                  itemBuilder: (context, index){
                    return BookTile(book: this._booksForDisplay[index]);
                  },
                )
                    :
                Center(
                  child: Text('Searching..'),
                )
            ),
          )
      );
    }
  }

Answer 1

I think you only need a listener for your TextEditingController. And you should write your onChanged method inside that listener.

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

    fetchBooks().then((value) {
      setState(() {
        _books.addAll(value);
        _booksForDisplay = _books;
        print(_booksForDisplay.length);
      });
    });

    _controller.addListener(() {
       print(_controller.text);

       var string = _controller.text.toLowerCase();
       setState(() {
            _booksForDisplay = _books.where((b){
                var bName = b.name!.toLowerCase();
                var bBarcode = b.barcode!.toLowerCase();
                return bName.startsWith(string) || 
                       bBarcode.startsWith(string);
                }).toList();
          });                   
    });
  }