Home > database >  Passing function as parameter to a widget
Passing function as parameter to a widget

Time:11-27

I have a button that calls a widget to open a custom dialog:

child: GestureDetector(
         onTap: () {
           showDialog(
             context: context,
             builder: (context){ 
                return MovMapAlert(
titulo: "yasiguiendo".tr(),
texto: "dejarsiguiendo".tr(),
aceptar: "dejardeseguir".tr(),
cancelar: "cancelar".tr(),
funcion: SeguidoresCrud().dejarDeSeguir(documentIdSeguidores),);
 });
},
 child: Image.asset('assets/profile/boton_follow_rojo.png'),
  )
)

As you may see,I am posting some parameters to the custom dialog widget, including a function that should be executed when the user taps on a dialog button.

Here you have the custom dialog widget:

class MovMapAlert extends StatelessWidget {

  final String titulo;
  final String texto;
  final String aceptar;
  final String cancelar;
  final Function funcion;

  const MovMapAlert({Key key, this.titulo, this.texto, this.aceptar, this.cancelar, this.funcion}) : super(key: key);
  @override
  Widget build(BuildContext context) {


    return Dialog(
      shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(16)
      ),
      elevation: 0,
      backgroundColor: Colors.transparent,
      child: _buildChild(context),
    );
  }

  _buildChild(BuildContext context) => Container(
    height: 350,
    decoration: BoxDecoration(
        color: Colors.redAccent,
        shape: BoxShape.rectangle,
        borderRadius: BorderRadius.all(Radius.circular(12))
    ),
    child: Column(
      children: <Widget>[
        Container(
          child: Padding(
            padding: const EdgeInsets.all(12.0),
            child: Image.asset('assets/images/movmap_transparente1024.png', height: 120, width: 120,),
          ),
          width: double.infinity,
          decoration: BoxDecoration(
              color: Colors.white,
              shape: BoxShape.rectangle,
              borderRadius: BorderRadius.only(topLeft: Radius.circular(12), topRight: Radius.circular(12))
          ),
        ),
        SizedBox(height: 24,),
        Padding(
          padding: const EdgeInsets.all(8.0),
          child: Text(this.titulo, style: TextStyle(fontSize: 20, color: Colors.white, fontWeight: FontWeight.bold),),
        ),
        SizedBox(height: 8,),
        Padding(
          padding: const EdgeInsets.only(right: 16, left: 16),
          child: Text(this.texto, style: TextStyle(fontSize: 18,color: Colors.white), textAlign: TextAlign.center,),
        ),
        SizedBox(height: 24,),
        Row(
          mainAxisSize: MainAxisSize.min,
          children: <Widget>[
            FlatButton(onPressed: (){
              Navigator.of(context).pop();
            }, child: Text(this.cancelar),textColor: Colors.white,),
            SizedBox(width: 8,),
            RaisedButton(onPressed: (){
              return Navigator.of(context).pop(true);
              this.funcion();
            }, child: Text(this.aceptar), color: Colors.white, textColor: Colors.redAccent,)
          ],
        )
      ],
    ),
  );
}

My issue is that the line of code that should include the function to be posted to the dialog widget :

  funcion: SeguidoresCrud().dejarDeSeguir(documentIdSeguidores),

is marked as warning in the editor, the warning message says: Convert to an if element

I guess I am not doing it well, I mean, what I need is to pass a function as parameter to another widget, if possible...

CodePudding user response:

The problem is that you're calling the function, not passing it

Change to:

funcion: () => SeguidoresCrud().dejarDeSeguir(documentIdSeguidores),

This happens because when you pass the function using (), you're actually calling the function and passing it's return value as an argument not the function itself to be called elsewhere

CodePudding user response:

Pass function with () invoking operator

funcion: (){
   SeguidoresCrud().dejarDeSeguir(documentIdSeguidores);
},
  • Related