How to use floating action button to scroll over another widget?

Question

I want to use FloatingActionButton() to scroll through a widget below it in for example a Stack widget.

Right now i just use Stack widget to stack the FloatingActionButton on top of an Image.assets. But the FloatingActionButton doesn't do anything, it just is on top of the image. I can only scroll when i hover on the image itself.

I want to hover on the FloatingActionButton and when i do that i want to swipe through the ListView. Also i want that the FloatingActionButton dissapears when i do that and appears back when you don't press anymore.

Right now i use ListView to scroll horizontally if image doesn't fit. And its inside a Stack widget where FloatingActionButton is on top of it.

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

  @override
  State<AppView3> createState() => _AppView3State();
}

class _AppView3State extends State<AppView3> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(),
        body: Stack(
          children: [
            ListView(
              scrollDirection: Axis.horizontal,
              shrinkWrap: true,
              children: [
                SizedBox(width: 500, child: Image.asset("assets/example.jpg")),
              ],
            ),
            Align(
              alignment: Alignment.centerRight,
              child: FloatingActionButton(
                  child: const FaIcon(FontAwesomeIcons.handPointUp),
                  onPressed: () {}),
            )
          ],
        ));
  }
}

Is it possible to do what i ask for with Stack? Or should approach it differently?

Answer 1

I did not understand the rest of the problem but I solved your problem that making the floating action button moves with the image. Here's the code:

import 'package:flutter/material.dart';

    class AppView3 extends StatefulWidget {
      const AppView3({Key? key}) : super(key: key);
    
      @override
      State<AppView3> createState() => _AppView3State();
    }
    
    class _AppView3State extends State<AppView3> {
      @override
      Widget build(BuildContext context) {
        return Scaffold(
            appBar: AppBar(),
            body: ListView(
              scrollDirection: Axis.horizontal,
              shrinkWrap: true,
              children: [
                Stack(
                  alignment: Alignment.centerRight,
                  children: [
                    SizedBox(
                        width: 500,
                        child: Image.asset("assets/example.jpg")),
                    Align(
                      child: FloatingActionButton(
                          child: Icon(Icons.check), onPressed: () {}),
                    )
                  ],
                ),
              ],
            ));
      }
    }