在Flutter中使用SQLite数据库填充下拉菜单,可以通过以下步骤实现:
步骤1:添加SQLite依赖 在pubspec.yaml文件中添加sqflite依赖,然后运行flutter packages get命令来获取依赖包。
dependencies:
sqflite: ^1.3.2
path: ^1.8.0
步骤2:创建数据库帮助类 创建一个数据库帮助类来管理SQLite数据库的创建和操作。该类将提供创建数据库、创建表、插入数据、查询数据等功能。
import 'dart:async';
import 'dart:io';
import 'package:path/path.dart';
import 'package:sqflite/sqflite.dart';
import 'package:path_provider/path_provider.dart';
class DatabaseHelper {
static final DatabaseHelper _instance = DatabaseHelper.internal();
factory DatabaseHelper() => _instance;
static Database? _db;
Future<Database?> get db async {
if (_db != null) {
return _db;
}
_db = await initDb();
return _db;
}
DatabaseHelper.internal();
Future<Database> initDb() async {
Directory documentDirectory = await getApplicationDocumentsDirectory();
String path = join(documentDirectory.path, "mydatabase.db");
var ourDb = await openDatabase(path, version: 1, onCreate: _onCreate);
return ourDb;
}
void _onCreate(Database db, int version) async {
await db.execute(
"CREATE TABLE mytable(id INTEGER PRIMARY KEY, name TEXT)");
}
Future<int> saveItem(String name) async {
var dbClient = await db;
int res = await dbClient!.insert("mytable", {"name": name});
return res;
}
Future<List<Map<String, dynamic>>> getItems() async {
var dbClient = await db;
var res = await dbClient!.query("mytable");
return res;
}
}
步骤3:创建下拉菜单组件 使用DropdownButton组件来创建下拉菜单,并使用数据库帮助类来获取数据库中的数据来填充下拉菜单项。
import 'package:flutter/material.dart';
class MyDropdown extends StatefulWidget {
@override
_MyDropdownState createState() => _MyDropdownState();
}
class _MyDropdownState extends State<MyDropdown> {
List<String> items = [];
String selectedValue = "";
@override
void initState() {
super.initState();
loadItems();
}
void loadItems() async {
var dbHelper = DatabaseHelper();
var data = await dbHelper.getItems();
List<String> tempList = [];
for (var item in data) {
tempList.add(item['name']);
}
setState(() {
items = tempList;
});
}
@override
Widget build(BuildContext context) {
return DropdownButton<String>(
value: selectedValue,
onChanged: (String? newValue) {
setState(() {
selectedValue = newValue!;
});
},
items: items.map<DropdownMenuItem<String>>((String value) {
return DropdownMenuItem<String>(
value: value,
child: Text(value),
);
}).toList(),
);
}
}
步骤4:使用下拉菜单组件 在需要使用下拉菜单的页面中,使用MyDropdown组件来显示下拉菜单。
import 'package:flutter/material.dart';
class MyPage extends StatelessWidget {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: Text("My Page")),
body: Center(child: MyDropdown()),
);
}
}
通过以上步骤,你可以在Flutter中使用SQLite数据库中的数据填充下拉菜单。这样,下拉菜单将显示数据库中存储的数据,并且可以根据用户选择来获取选中的值。
领取专属 10元无门槛券
手把手带您无忧上云