Можно ли включить кран за пределами нижнего листа?

Я хочу, чтобы пользователи также могли выполнять действия за пределами нижнего листа. Например, на изображении, показанном ниже, я хочу, чтобы пользователь нажал кнопку воспроизведения. Я не могу сделать это сейчас, поскольку барьер нижнего листа блокирует нажатие кнопки воспроизведения.

введите описание изображения здесь

  • Согласно моим исследованиям, нижний лист представляет собой полноэкранный компонент. Вроде бы высотой в половину экрана это обман. (Сделав цвет барьера прозрачным и добавив ограничения по высоте).
showModalBottomSheet(
      context: context,
      isDismissible: false,
      barrierColor: Colors.transparent,
      builder: (_) {
        return GestureDetector(
          behavior: HitTestBehavior.translucent,
          child: Container(
            constraints: BoxConstraints(maxHeight: height),
            color: Theme.of(context).cardColor,
            child: child.....
          ),
        );
      },
      isScrollControlled: true,
    );

flutter flutter-layout gesture-recognition flutter-showmodalbottomsheet bottom-sheet
person Suman Maharjan    schedule 27.11.2020    source источник
comment
stackoverflow.com/a/57406821/6618622   -  person CopsOnRoad    schedule 27.11.2020
comment
@CopsOnRoad Не то, что они спрашивают. Suman: в этом случае вам не следует использовать нижний лист. Вы можете использовать стопку там, где хотите, чтобы раздел комментариев отображался.   -  person creativecreatorormaybenot    schedule 27.11.2020
comment
У меня есть запасной план: D   -  person Suman Maharjan    schedule 27.11.2020
comment
точно, его половина прозрачна, а половина - это виджет, который вы предоставляете, если вам нужно это решить, может быть так, поместите фон и свой виджет bottomSheet в стек   -  person Yadu    schedule 28.11.2020

Ответы (1)


arrow_upward
3
arrow_downward

Я решил это как нижний лист, но другим методом. Надеюсь, я правильно понял вопрос.

пример gif

import 'package:flutter/material.dart';
class BottomSheetOutside extends StatefulWidget {
  @override
  _BottomSheetOutsideState createState() => _BottomSheetOutsideState();
}

class _BottomSheetOutsideState extends State<BottomSheetOutside> with SingleTickerProviderStateMixin {
  AnimationController _controller;
  Animation<Offset> offset;

  @override
  void initState() {
    super.initState();
    _controller = AnimationController(vsync: this, duration: Duration(seconds: 1));
    offset = Tween<Offset>(begin: Offset(0.0, 1.0), end: Offset.zero).animate(_controller);
  }

  @override
  void dispose() {
    super.dispose();
    _controller.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Column(
        children: [
          Expanded(flex: 4, child: buildTop),
          Expanded(flex: 6, child: buildBottom),
        ],
      ),
    );
  }

  Container get buildTop {
    return Container(
      width: double.infinity,
      color: Colors.red,
      child: IconButton(
        icon: Icon(Icons.play_circle_fill_rounded),
        onPressed: () {
          switch (_controller.status) {
            case AnimationStatus.dismissed:
              _controller.forward();
              break;
            case AnimationStatus.forward:
              break;
            case AnimationStatus.reverse:
              break;
            case AnimationStatus.completed:
              _controller.reverse();
              break;
          }
        },
      ),
    );
  }

  Stack get buildBottom {
    return Stack(children: [
      Container(color: Colors.blue),
      buildBottomSlide,
    ]);
  }

  Widget get buildBottomSlide {
    return SlideTransition(
      position: offset,
      child: Card(
        child: ListView.builder(
          itemCount: 10,
          itemBuilder: (context, index) => ListTile(
            leading: Icon(Icons.comment),
            title: Text("Test $index"),
          ),
        ),
      ),
    );
  }
}
person Muhammet Ömer    schedule 27.11.2020