How do I allow gestures to pass through a widget in a stack?

Viewed 524

please look at the code sample below, or just run it here

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) => MaterialApp(
        home: Material(
          child: Stack(
            children: [
              Center(
                child: MaterialButton(
                  color: Colors.white,
                  child: Icon(Icons.ac_unit),
                  onPressed: () => print('pressed'),
                ),
              ),
              CustomScrollWidget()
            ],
          ),
        ),  
      );
}

class CustomScrollWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) => CustomScrollView(
        slivers: <Widget>[
          SliverAppBar(
            pinned: true,
            expandedHeight: MediaQuery.of(context).size.height,
            flexibleSpace: FlexibleSpaceBar(
              title: const Center(child: Text('scroll me')),
            ),
          ),
          const SliverFillRemaining(),
        ],
      );
}

how do I allow gestures to pass through a widget in a stack?

AFAIK setting the HitTestBehavior of a GestureDetector only affect the child, so shouldn't work in a Stack, any idea?

please note that the ""solutions"" (1, 2) offered here do not work

1 Answers

It's not a pretty solution but it does work:

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) => MaterialApp(
        home: Material(
          child: Stack(
            children: [
              Center(
                child: MaterialButton(
                  color: Colors.white,
                  child: Icon(Icons.ac_unit),
                  onPressed: () {},
                ),
              ),
              CustomScrollWidget(),
              Center(
                child: MaterialButton(
                  elevation: 0.0,
                  hoverColor: Colors.transparent,
                  hoverElevation: 0.0,
                  onPressed: () => print('pressed'),
                ),
              ),
            ],
          ),
        ),  
      );
}

class CustomScrollWidget extends StatelessWidget {
  @override
  Widget build(BuildContext context) => CustomScrollView(
        slivers: <Widget>[
          SliverAppBar(
            pinned: true,
            expandedHeight: MediaQuery.of(context).size.height,
            flexibleSpace: FlexibleSpaceBar(
              title: const Center(child: Text('scroll me')),
            ),
          ),
          const SliverFillRemaining(),
        ],
      );
}
Related