flutter - 如何只编写一个函数来增加颤动中的不同计数器变量?
问题描述
我正在尝试在颤动中构建一个屏幕,其中一列中有三行,每行包括:
- 文本
- IconButton(添加图标)
- 文本
当我单击添加图标时,我需要增加一个计数器变量并将其显示为文本(第三个要点)
在此处查看屏幕: https ://ibb.co/37v4rDj
但是我正在为不同的计数器变量编写不同的函数,我不希望这样,我想编写一个可以增加不同计数器变量的函数
这是我的代码:
import 'package:flutter/material.dart';
void main() {
runApp(MyHomeApp());
}
class MyHomeApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
// TODO: implement build
return MaterialApp(
debugShowCheckedModeBanner: false,
home: Scaffold(
appBar: AppBar(
title: Text("ctr trial"),
),
body: Body(),
),
);
}
}
class Body extends StatefulWidget {
@override
_BodyState createState() => _BodyState();
}
class _BodyState extends State<Body> {
int upactr = 0;
int ndactr = 0;
int othctr = 0;
@override
Widget build(BuildContext context) {
return Center(
child: Column(
//mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
SizedBox(
height: 100,
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text("UPA"),
IconButton(
icon: Icon(
Icons.add,
),
onPressed: () {
setState(){
_incrementctr; // this function should increment only the upactr variable
}
),
],
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text("NDA"),
IconButton(
icon: Icon(
Icons.add,
),
onPressed: () {
setState(){
_incrementctr; // this function should increment only the ndactr variable
}
},
),
],
),
Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text("others"),
IconButton(
icon: Icon(
Icons.add,
),
onPressed: () {
setState(){
_incrementctr; // this function should increment only the othctr variable
}}
},
),
],
),
],
),
);
}
void _incrementctr() {
// this is a single function which should incerement only one counter variable , any of the following :
//1.upactr++;
//2.ndactr++;
//3.othctr++;
}
}
解决方案
为每个计数器添加一个文本字段,看起来好像它丢失了。每个文本字段都将使用其变量来显示。
不需要外部功能。在每个 onPressed() 中,特定的计数器都应该增加,例如,只需调用 upactr++
推荐阅读
- angular - 带有身份服务器的 Angular 6 SPA - 存储令牌
- node.js - tls/certificate (SMTP) 的 Nodemailer 问题
- jmeter - 如何在 jmeter 中使用 SMTP 服务器发送电子邮件
- php - Getting post featured image on different page
- vue.js - Vue.js 中的 Select2 未定义
- angular - 如何将图像加入数组并在 Angular 的滑块中显示它们
- javascript - 删除文件路径和文件名,使用 Node 将文件名留在 AWS Lambda 中
- docker - Remove docker containers with image names through jenkins pipeline
- css - 如何在 HTML Canvas 中在移动分辨率上添加另一个图标
- python - 具有特定条件的 Python 中数据集的 A/B 拆分