how to detect if the DraggableScrollableSheet is dropped down?

user_19359083 0
Viewed 40

I added a Listener to the DraggableScrollableSheet. When I do a print to the DSNotification.extent on the function DraggableScrollableNotification DSNotification it works and it shows me the value which is maximum 0.49, but when I add the if test and the setState I don't get the right value. It doesn't work with setState and when I remove it it always gives me false!

   NotificationListener<DraggableScrollableNotification>(
        onNotification:
            (DraggableScrollableNotification DSNotification) {
          if (DSNotification.extent == 0.49) {
           // setState(() {
              //print(DSNotification.extent);
              scrolable = true;
          //  });
          } 
          if (DSNotification.extent <= 0.49) {
            //setState(() {
             scrolable = false;
              //print(DSNotification.extent);
            //});
          }
          print(scrolable);
          return true;
          
        },
        child: DraggableScrollableSheet(
          controller: controller,
          initialChildSize: 0,
          minChildSize: 0.0,
          maxChildSize: 0.49,
          builder: (_, scrollController) {
            return Container(
              decoration: BoxDecoration(
                  color: Colors.white,
                  border: Border.all(color: Colors.transparent),
                  borderRadius: const BorderRadius.only(
                      topLeft: Radius.circular(15),
                      topRight: Radius.circular(15))),
              child: ListView(controller: scrollController, children: [
                nfController.myWidget,
              ]),
            );
          },
        ),
      ),
flutter
1 Answers

To detect when the DraggableScrollableSheet was dropped, you can wrap it with a Dismissable:

 Dismissible(
          direction: DismissDirection.vertical,
          key: Key('my_item'),
          onDismissed: (direction) {
            print('onDismissed');
          },
          child: DraggableScrollableSheet(
            // controller: controller,
            initialChildSize: 0.5,
            minChildSize: 0.0,
            maxChildSize: 1,
            builder: (_, scrollController) {
              return Container(
                decoration: BoxDecoration(
                    color: Colors.red,
                    border: Border.all(color: Colors.transparent),
                    borderRadius: const BorderRadius.only(
                        topLeft: Radius.circular(15),
                        topRight: Radius.circular(15))),
                child: ListView(controller: scrollController, children: [
                  // nfController.myWidget,
                ]),
              );
            },
          )),

Complete runnable example:

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}


class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.red,
      ),
      home: MyHomePage(),
    );
  }
}

class MyHomePage extends StatelessWidget {
  MyHomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Dismissible(
          direction: DismissDirection.vertical,
          key: Key('my_item_'),
          onDismissed: (direction) {
            print('onDismissed');
          },
          child: DraggableScrollableSheet(
            // controller: controller,
            initialChildSize: 0.5,
            minChildSize: 0.0,
            maxChildSize: 1,
            builder: (_, scrollController) {
              return Container(
                decoration: BoxDecoration(
                    color: Colors.red,
                    border: Border.all(color: Colors.transparent),
                    borderRadius: const BorderRadius.only(
                        topLeft: Radius.circular(15),
                        topRight: Radius.circular(15))),
                child: ListView(controller: scrollController, children: [
                  // nfController.myWidget,
                ]),
              );
            },
          )),
    );
  }
}
user_123497340
Related