Flutter information window googlemaps

How can I add multiple pages and slide it on my information window? I am looking for a reference but there is no one. How can I implement it on my code?

We are developing an application use for locating food parks but the difference is that when the user clicked the map markers there will be an information window that pops up that can be scrolled and slide to right or left side. Here is the code.

Here is my code. The image I upload is something I want to achieve.this is a sample image from youtube

import 'package:custom_info_window/custom_info_window.dart';
import 'package:flutter/material.dart';
import 'package:flutter_rating_bar/flutter_rating_bar.dart';
import 'package:google_maps_flutter/google_maps_flutter.dart';

const LatLng customLocation = LatLng(14.852885352588201, 120.81614049713285);

class HomePage extends StatefulWidget {
  const HomePage({Key? key}) : super(key: key);

  @override
  State<HomePage> createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  late GoogleMapController _mapController;
  final Map<String, Marker> _markers = {};
  final _customInfoWindowController = CustomInfoWindowController();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Stack(
        children: [
          GoogleMap(
            initialCameraPosition:
                const CameraPosition(target: customLocation, zoom: 11.5),
            onMapCreated: (controller) {
              _mapController = controller;
              _customInfoWindowController.googleMapController = controller;

              addMarker5('test5',
                  const LatLng(14.896344082681443, 120.77674251390367));
            },
            onTap: (location) {
              _customInfoWindowController.hideInfoWindow!();
            },
            onCameraMove: (position) {
              _customInfoWindowController.onCameraMove!();
            },
            markers: _markers.values.toSet(),
          ),
          CustomInfoWindow(
            controller: _customInfoWindowController,
            height: 245,
            width: 220,
            offset: 50,
          )
        ],
      ),
    );
  }

  addMarker5(String markerid4, LatLng location) async {
    var markerIcon = await BitmapDescriptor.fromAssetImage(
        const ImageConfiguration(), 'assets/images/sanmarcosfoodpark.png');
    var marker = Marker(
        markerId: MarkerId(markerid4),
        position: location,
        //infoWindow: const InfoWindow(
        //  title: 'Title of Place',
        // snippet: 'Description',
        //),
        icon: markerIcon,
        onTap: () {
          _customInfoWindowController.addInfoWindow!(
            Container(
              clipBehavior: Clip.antiAlias,
              decoration: BoxDecoration(
                color: Colors.white,
                borderRadius: BorderRadius.circular(24),
              ),
              child: Column(
                children: [
                  Image.asset(
                    'assets/images/sanmarcoswindow.jpg',
                    fit: BoxFit.cover,
                  ),
                  const Text(
                    'San Marcos Foodpark',
                    style: TextStyle(fontSize: 15, fontWeight: FontWeight.bold),
                  ),
                  const Text(
                    'Address:',
                    textAlign: TextAlign.right,
                    style: TextStyle(
                      fontSize: 12,
                      fontWeight: FontWeight.bold,
                    ),
                  ),
                  const Padding(
                    padding: EdgeInsets.only(left: 8.0, right: 8.0),
                    child: Text(
                      '13, R-9, Calumpit, Bulacan',
                      style: TextStyle(fontSize: 11),
                    ),
                  ),
                  const SizedBox(
                    height: 5.0,
                  ),
                  const Text('Contact no: ',
                      style:
                          TextStyle(fontSize: 12, fontWeight: FontWeight.bold)),
                  const Text('',
                      style: TextStyle(
                        fontSize: 11,
                      )),
                ],
              ),
            ),
            location,
          );
        });

    _markers[markerid4] = marker;
    setState(() {});
  }

here I make a custom markers and I want to implement something like a slide function in my information window