使用 Sqflite 保存客户姓名、金额和手机号码并将它们显示在 ListBuilder 上后，我还想根据各自的索引在 ListBuilder 上显示客户图像。我已经实现了图像选择器代码，但是当我从我的画廊中选择图像或使用我的相机时，它什么也不显示。我如何显示图像并保留它们？请我需要帮助。感谢你们。
这是我的代码；
File _imageFile;
final picker = ImagePicker();
String _imagePath;
//Alert Dialog for picking profile picture
_pickPicture(mCtx) {
return showDialog(
context: mCtx,
builder: (context) {
return SimpleDialog(
title: Center(
child: Text(
'Upload Profile Image',
style: TextStyle(
fontWeight: FontWeight.w800,
fontSize: 25,
color: BluePrimaryColor),
),
),
children: [
SimpleDialogOption(
child: Center(
child: Text('Capture with Camera'),
),
onPressed: () {
_pickImage(ImageSource.camera);
Navigator.of(context).pop();
},
),
SimpleDialogOption(
child: Center(
child: Text('Select from gallery'),
),
onPressed: () {
_pickImage(ImageSource.gallery);
Navigator.of(context).pop();
},
),
SimpleDialogOption(
child: Center(
child: Text('Cancel'),
),
onPressed: () {
Navigator.of(context).pop();
},
),
],
);
});
}
//This is the Use to Pick Image from the Source
Future<void> _pickImage(ImageSource source) async {
final selected = await picker.getImage(
source: source,
maxWidth: 200.0,
maxHeight: 300.0,
);
setState(() {
if (selected != null){
_imageFile = File(selected.path);
}
});
}
//Object of the DatabaseHelper Class
DataBaseHelper _dataBaseHelper;
//Object of the List of the Contact Class.
List<Contact> _contacts = [];
Contact _contact = new Contact();
//My Custom ListBuilder to display the Customer Details
_list() => Center(
child: ListView.builder(
itemCount: _contacts.length,
itemBuilder: (context, index) {
return Padding(
padding: const EdgeInsets.all(4.0),
child: Container(
width: double.maxFinite,
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(5),
color: Colors.blue.shade100,
),
child: Column(
children: [
Text(
"CUSTOMER DETAILS.",
style: TextStyle(
fontSize: 14,
color: BluePrimaryColor,
fontFamily: 'Poppins',
fontWeight: FontWeight.bold,
),
),
Divider(
color: BluePrimaryColor,
),
Row(
children: [
Padding(
padding: const EdgeInsets.only(left: 8),
child: Container(
child: Column(
children: [
InkWell(
child: Center(
child: CircleAvatar(
backgroundColor: Colors.white,
radius: 32,
child: _imagePath == null
? Icon(
Icons.add_a_photo,
size: 35,
color: BluePrimaryColor,
)
: null,
backgroundImage: _imagePath != null
? FileImage(File(_imagePath))
: null,
),
),
onTap: () => _pickPicture(context),
),
],
),
)
),
SizedBox(width: 8),
Column(
crossAxisAlignment: CrossAxisAlignment.start,
children: [
RichText(
text: TextSpan(
text: 'NAME: ',
style: TextStyle(
fontSize: 11,
color: BluePrimaryColor,
letterSpacing: 1,
fontFamily: 'Poppins',
),
children: [
TextSpan(
text: _contacts[index].name,
style: TextStyle(
fontSize: 10,
color: BluePrimaryColor,
fontFamily: 'Poppins',
))
])),
RichText(
text: TextSpan(
text: 'AMOUNT: ₦ ',
style: TextStyle(
fontSize: 11,
color: BluePrimaryColor,
letterSpacing: 1,
fontFamily: 'Poppins',
),
children: [
TextSpan(
text: _contacts[index].amount,
style: TextStyle(
color: BluePrimaryColor,
fontSize: 10,
fontFamily: 'Poppins',
))
])),
RichText(
text: TextSpan(
text: 'MOBILE: ',
style: TextStyle(
fontSize: 10,
color: BluePrimaryColor,
letterSpacing: 1,
fontFamily: 'Poppins',
),
children: [
TextSpan(
text: _contacts[index].mobile,
style: TextStyle(
color: BluePrimaryColor,
fontSize: 10,
fontFamily: 'Poppins'))
])),
],
),
],
),
//My Contact Class for the Customer's Details
class Contact {
static const tblContact = 'contacts';
static const colId = 'id';
static const colName = 'name';
static const colAmount = 'amount';
static const colMobile = 'mobile';
Contact.fromMap(Map<String, dynamic> map) {
id = map[colId];
name = map[colName];
amount = map[colAmount];
mobile = map[colMobile];
}
int id;
String name;
String amount;
String mobile;
String picture;
Contact({this.id, this.name, this.amount, this.mobile, this.picture});
Map<String, dynamic> toMap() {
var map = <String, dynamic>{
colName: name,
colAmount: amount,
colMobile: mobile,
};
if (id != null)
map[colId] = id;
return map;
}
}
//My DataBaseHelper Class
//singleton constructor.
DataBaseHelper._();
static final DataBaseHelper instance = DataBaseHelper._();
//Properties of the db
Database _database;
Future<Database> get database async {
if (_database != null) return _database;
_database = await _initDatabase();
return _database;
}
_initDatabase() async {
Directory dataDirectory = await getApplicationDocumentsDirectory();
String dbPath = join(dataDirectory.path, _databaseName);
return await openDatabase(dbPath,
version: _databaseVersion, onCreate: _onCreateDB);
}
Future _onCreateDB(Database db, int version) async {
await db.execute('''
CREATE TABLE ${Contact.tblContact}(
${Contact.colId} INTEGER PRIMARY KEY AUTOINCREMENT NOT NULL,
${Contact.colName} TEXT NOT NULL,
${Contact.colAmount} TEXT NOT NULL,
${Contact.colMobile} TEXT NOT NULL
)
''');
}
//Insert function
Future<int> insertContact(Contact contact) async {
Database db = await database;
return await db.insert(Contact.tblContact, contact.toMap());
}
//fetch function
Future <List<Contact>> fetchContact() async {
final Database db = await database;
var response = await db.query(Contact.tblContact);
List<Contact> list = response.isNotEmpty ? response.map((e) => Contact.fromMap(e)).toList() : [];
return list;
}
//UpDate function
Future<int> updateContact(Contact contact) async {
Database db = await database;
return await db.update(Contact.tblContact, contact.toMap(),
where: '${Contact.colId}=?', whereArgs: [contact.id]
);
}
//Delete function
Future<int> deleteContact(int id) async {
Database db = await database;
return await db.delete(Contact.tblContact,
where: '${Contact.colId}=?', whereArgs: [id]);
}
Future<Contact> getContactByNum(String mobile) async {
final db = await database;
var result = await db.query("Contact", where: "colMobile = ?", whereArgs: [mobile]);
return result.isNotEmpty ? Contact.fromMap(result.first) : null;
}
}