Custom Slideable Tile for list


class CustomSlideListTile extends StatefulWidget {
  const CustomSlideListTile({
    super.key,
    this.width,
    this.height,
    required this.notificationData,
    required this.deleteAction,
  });

  final double? width;
  final double? height;
  final NotificationDataModelStruct notificationData;
  final Future Function() deleteAction;

  @override
  State<CustomSlideListTile> createState() => _CustomSlideListTileState();
}

class _CustomSlideListTileState extends State<CustomSlideListTile> {
  @override
  Widget build(BuildContext context) {
    return Slidable(
        // Specify a key if the Slidable is dismissible.
        key: const ValueKey(0),
        // The start action pane is the one at the left or the top side.
        endActionPane: ActionPane(
          // A motion is a widget used to control how the pane animates.
          motion: const BehindMotion(),
          dragDismissible: false,
          extentRatio: 0.25,
          // All actions are defined in the children parameter.
          children: [
            InkWell(
              onTap: () {
                widget.deleteAction();
              },
              child: Container(
                width: MediaQuery.sizeOf(context).width * 0.25,
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.spaceBetween,
                  children: [
                    SizedBox(
                      height: 20,
                    ),
                    Image.asset(
                      'assets/images/ic_close_thin.png',
                      height: 20,
                      width: 20,
                    ),
                    const Text(
                      "Delete",
                      style: TextStyle(
                        fontFamily: 'Pais',
                        fontSize: 12,
                        color: Colors.grey,
                      ),
                    ),
                    SizedBox(
                      height: 10,
                    ),
                  ],
                ),
              ),
            )
          ],
        ),
        // The child of the Slidable is what the user sees when the
        // component is not dragged.
        child: NotificationCardWidget(
          notificationData: widget.notificationData,
        ) //const ListTile(title: Text('')),
        );
  }
}


4
15 replies