在 Flutter 中以函数为参数调用小部件

编程问答 2022-04-22

问题描述

我正在尝试调用具有函数作为参数的自定义小部件，但是我不知道可以为其分配什么参数。我已经测试了我想出的所有想法，但没有成功。这个想法是我从教程中获得的，但是我做了一些不同的事情，因为我有不同的要求。 这是我的代码：

import 'package:Flutter/material.dart';

class NewTransaction extends StatelessWidget {
  final Function addTx;
  const NewTransaction({Key? key,required this.addTx}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Text('I cant solve this problem');
  }
}

================================================ ==========================

import 'package:Flutter/material.dart';
import 'package:function_parameter_problem/new_transaction.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',theme: ThemeData(
        primarySwatch: Colors.blue,),home: MyHomePage(title: 'Flutter Demo Home Page'),);
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key? key,required this.title}) : super(key: key);

  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  int _counter = 0;

  void _incrementCounter() {
    setState(() {
      _counter++;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,children: <Widget>[
            NewTransaction(
                addTx:
                    addTx),// What parameter can/should I pass here? It is crucial for my project
          ],floatingActionButton: FloatingActionButton(
        onpressed: _incrementCounter,tooltip: 'Increment',child: Icon(Icons.add),// This trailing comma makes auto-formatting nicer for build methods.
    );
  }
}

编辑：好的，但假设 NewTransaction() 函数返回一个带有 appbar 等的脚手架，我必须再次调用它，但是在以下情况下：

_wykonajZapytanie() { //function called onpressed in the main window
    Navigator.push(
      context,MaterialPageRoute(builder: (context) => NewTransaction()),); /*I have to put a parameter here,but I just want to display another window,I don't kNow why,but I just can't get any ideas*/
  }

重要提示 在原始项目中，如果涉及到我提供的第一个示例，我不会在主类中调用 NewTransaction(addTx...)，而是在 UserTransaction 类中.

tldr 我需要在主类中组装一个可扩展的列表 - 根据我所知道的，可以按照以下方式完成，但我还需要在主类中调用此函数按下按钮以显示所有文本字段等

import 'package:Flutter/material.dart';
import './new_transaction.dart';
import './transaction_list.dart';
import '../models/transaction.dart';

class UserTransaction extends StatefulWidget {
  @override
  _UserTransactionState createState() => _UserTransactionState();
}

class _UserTransactionState extends State<UserTransaction> {
  final List<Transaction> _userTransactions = [
    Transaction(
        id: 1,date: DateTime.Now(),numTel: 911911911,// scoring: 'Link wygasł',user: 'Polizei pau pau'),Transaction(
        id: 2,user: 'Tha police')
  ];

  void _addNewTransaction(int txnumTel,/* String txScoring,*/ String txUser) {
    final newTx = Transaction(
      numTel: txnumTel,/*scoring: txScoring,*/
      user: 'PLZ WORK',id: 3,);
    setState(() {
      _userTransactions.add(newTx);
    });
  }

  @override
  Widget build(BuildContext context) {
    return Column(children: <Widget>[
      NewTransaction(_addNewTransaction),]);
  }
}

解决方法

如果我正确理解了您的问题，那么您可以通过以下方式传递带参数的函数：

import 'package:flutter/material.dart';

class NewTransaction extends StatelessWidget {
  final Function() addTx;
  const NewTransaction({Key? key,required this.addTx}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Text('I cant solve this problem');
  }
}

传递此函数时，请确保像这样传递它：NewTransaction(addTx: () => addTx());。如果您像这样传递它：NewTransaction(addTx: addTx()); 函数会立即被调用。

, 
import 'package:flutter/material.dart';

class NewTransaction extends StatelessWidget {
  final VoidCallback function; 
  //if nothing returns
  //else typedef CustomFunc = Function(int param); (replace int with your data type)
  const NewTransaction({Key? key,required this.function}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return InkWell(
            child: Text('I cant solve this problem'),onTap:function,//if custom 
            //onTap: (){
            // function(params);
            //}
          );
  }
}

Call like below...

body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,children: <Widget>[
            NewTransaction(
                function: (){
                    //todo  
                  },//if custome function: (params){ todo },)
          ],),
,

当您说Function addTx 时，表示可以传递任何函数。 如果 Function() addTx 表示没有参数的函数。 如果 Function(int) addTx 表示具有一个必需的位置参数整数的函数。 如果 void Function() addTx 表示没有参数的函数，返回类型应该是 void。

在颤振中你也可以使用 VoidCallback 基本上是这样写的 void Function() final VoidCallback addTd。 . 或者可以使用 ValueChanged<T> 基本上是 void Function(T value)

更多信息请访问： https://dart.dev/guides/language/language-tour#functions

functionfunctionfunctionparameterswidget