Home > database >  Flutter how to pass a widget as a parameter
Flutter how to pass a widget as a parameter

Time:03-10

I've been developing a mobile app in flutter for a few days and just to reuse some code I'd like to pass a widget as a parameter so I don't have to duplicate a bunch of code. I tried some solutions I found here but none of them worked.

Here's what I have so far:

CarouselItem.dart

class CarouselItem extends StatelessWidget {

  CarouselItem({
    Key? key,
    required this.index, required this.height, required this.width, required this.title, required this.destination,
  }) : super(key: key);
  final int index;
  final double height;
  final double width;
  final String title;
  final RouteOneCallBack destination; //trying to pass the widget

//List of images
  List<String> list = [
    'https://audioguia.s3.eu-west-3.amazonaws.com/FOTOS/Alqueva/A1-placa entrada.jpg',
  ];


  @override
  Widget build(BuildContext context) {
    return Column(
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Container(
          margin: EdgeInsets.all(6.0),
          child: ClipRRect(
            borderRadius: BorderRadius.circular(30.0),
            child: GestureDetector(
              child: Image.network(
                  list[index],
                  fit: BoxFit.cover,
                  height: height,
                  width: width,
                ),
              onTap: () {
                Navigator.push(
                  context,
                  MaterialPageRoute(
                    builder: (context) =>
                        destination(), //widget goes here
                  ),
                );
              },
            ),
          ),
        ),
        SizedBox(height: 20),
        Container(
          padding: EdgeInsets.only(left: 10),
          child: Text(
            title,
            style: TextStyle(fontWeight: FontWeight.bold),
          ),
        ),
      ],
    );
  }
}

Home.dart

How I want this to go

              items: [
                CarouselItem(
                  index: 0,
                  width: 500,
                  height: 200,
                  title: "Destino 1",
                  destination: RouteOne()

                ),

Am I missing an extra step? Thanks in advance. Basically what I want to do is the same I do with the String or int parameters I already have, but can't seem to understand how to do this with a widget.

RouteOne() is a stateful widget

CodePudding user response:

class BottomSheetDialog extends StatelessWidget {
  final Widget? child;

  const BottomSheetDialog({Key? key, @required this.child}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
        height: Sizes.s350,
        decoration: BoxDecoration(
            color: Get.theme.cardColor,
            borderRadius: BorderRadius.only(
                topLeft: Radius.circular(Sizes.s30),
                topRight: Radius.circular(Sizes.s30))),
        child: Column(
          mainAxisSize: MainAxisSize.min,
          children: [
            Expanded(child: child!),
          ],
        ));
  }
}

// call 

 BottomSheetDialog(child:const Text("test"));



 

CodePudding user response:

You can pass the widget as a parameter because the StatefulWidget extends the Widget.

Here is common usage.

final Widget destination;

enter image description here

  • Related