我目前遇到一个问题,不知道该如何解决。我的屏幕上有几张卡片,每张卡片代表一张“表格”。我想给每张卡片都加上索引。换句话说,每张表格都应该以“表格”作为标题,并附加索引。例如“表格 1、表格 2”等等。我为卡片小部件的基本外观创建了一个单独的文件:
tisch_credentials.dart
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:fabene_bestellungen/provider/tisch_provider.dart';
class TischCredentials extends ConsumerStatefulWidget {
const TischCredentials({super.key});
@override
ConsumerState<ConsumerStatefulWidget> createState() {
return _TischCredentialsState();
}
}
class _TischCredentialsState extends ConsumerState<TischCredentials> {
@override
Widget build(BuildContext context) {
//final tischIndex = ref.watch(tischProvider.notifier).state;
//tischIndexErhoehen(tischIndex);
return Card(
child: Column(
children: [
Row(
children: [
//Text("Tisch " + tischIndex.toString()),
IconButton(
icon: Icon(Icons.delete),
onPressed: () {},
),
IconButton(onPressed: () {}, icon: Icon(Icons.check))
],
),
SizedBox(
height: 8,
),
Container(
height: 50,
width: 50,
),
],
),
);
}
}
我想在这个文件中实现这个功能,但效果不如预期。所以我把它移到了主屏幕,结果还是一样。我最后一次尝试是这样的:
订单_主_屏幕.dart
import 'package:fabene_bestellungen/widgets/tisch_credentials.dart';
import 'package:flutter/material.dart';
import 'package:flutter_riverpod/flutter_riverpod.dart';
import 'package:fabene_bestellungen/provider/tisch_provider.dart';
class BestellungenMainSreen extends ConsumerWidget {
BestellungenMainSreen({super.key, required this.tischIndex});
int tischIndex = 0;
String tischIndexErhoehen(int i) {
i = ++i;
return i.toString();
}
@override
Widget build(BuildContext context, WidgetRef ref) {
String aktuellerIndex = tischIndexErhoehen(tischIndex);
return Scaffold(
appBar: AppBar(
title: Text('Bestellungen'),
),
body: Row(
mainAxisAlignment: MainAxisAlignment.spaceAround,
children: [
Column(
mainAxisAlignment: MainAxisAlignment.start,
children: [
Text('Tisch ' + aktuellerIndex),
TischCredentials(),
/* Container(
margin: EdgeInsets.all(10),
width: 100,
height: 200,
decoration:
BoxDecoration(border: Border.all(color: Colors.grey)),
),*/
Text('Tisch ' + tischIndexErhoehen(tischIndex)),
TischCredentials(),
/* Container(
margin: EdgeInsets.all(10),
alignment: Alignment(10, 10),
width: 100,
height: 100,
color: Colors.red,
),*/
Container(
margin: EdgeInsets.all(10),
alignment: Alignment(10, 10),
width: 100,
height: 100,
color: Colors.red,
),
Container(
margin: EdgeInsets.all(10),
width: 100,
height: 100,
color: Colors.red,
),
],
),
Column(
children: [
Container(
width: 100,
height: 800,
color: Colors.blue,
),
Container(
margin: EdgeInsets.all(10),
width: 100,
height: 100,
//color: Colors.red,
decoration:
BoxDecoration(shape: BoxShape.circle, color: Colors.red),
)
],
),
Column(
mainAxisAlignment: MainAxisAlignment.start,
children: [
Container(
margin: EdgeInsets.all(10),
width: 100,
height: 200,
decoration:
BoxDecoration(border: Border.all(color: Colors.grey)),
),
Container(
margin: EdgeInsets.all(10),
alignment: Alignment(10, 10),
width: 100,
height: 100,
color: Colors.red,
),
Container(
margin: EdgeInsets.all(10),
alignment: Alignment(10, 10),
width: 100,
height: 100,
color: Colors.red,
),
Container(
margin: EdgeInsets.all(10),
width: 100,
height: 100,
color: Colors.red,
),
],
),
],
),
);
}
}
很遗憾,我不知道该如何解决这个问题。Riverpod 可以考虑吗?比如,把索引保存在提供程序中,然后增加索引值并分配给各个小部件?或者用 Future 来解决整个问题?或者创建一个列表,然后将其显示在卡片中?
尝试一下:
该
tischIndex
变量将存储当前索引,因此无需向tischIndexErhoehen
方法传递任何值。希望这有帮助!