flutter - Flutter 条码扫描结果未列出
问题描述
我的应用程序是搜索书籍列表。搜索时可以使用两个不同的变量(书名或条形码)。按名称搜索时没有问题。但是使用条码扫描搜索时,没有列出任何结果。当我手动输入条形码时,该应用程序仍然可以正常工作。
你能帮我吗?
手动输入的条码:https ://i.stack.imgur.com/njtLA.png
条码扫描结果:https ://i.stack.imgur.com/ZsGot.png
我的代码在这里..
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..'),
)
),
)
);
}
}
解决方案
我认为您只需要一个 TextEditingController 的侦听器。你应该在那个监听器中编写你的 onChanged 方法。
@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();
});
});
}
推荐阅读
- mysql - MySQL 默认字符集选项
- c# - 如何在多个浏览器上处理“AspNetCore.Correlation.OpenIdConnect cookie not found”错误
- php - FFmpeg - 不允许操作
- java - 使用 replaceAll() 修改现有元素时列表不更新
- xml - Powershell脚本将一个大文件拆分为多个文件,每个文件中有两对标签,文件名有命名约定
- apache-spark - 使用多列更新 Apache Spark / Databricks 中的表
- elasticsearch - ElasticSearch 批量插入导致 WriteStateException 和未分配的分片
- javascript - 如何将 GitHub 项目和时间线嵌入网站
- sql - 有没有办法在添加间隔的同时保留一个月的最后一天?
- angular-tree-component - 角树组件虚拟滚动不起作用