Взаимодействовать с нижним виджетом в стеке

#flutter

#flutter

Вопрос:

У меня есть стек, в котором есть GoogleMap и перекрывающийся SingleChildScrollView, заполненный виджетами.

Однако SCSV теперь блокирует карту, и я не могу взаимодействовать с ней? То, что я пытаюсь сделать, это отобразить карту в качестве «верхнего» виджета на странице, а затем scrollview можно прокручивать по карте.

 Stack(children: <Widget>[
          Container(
              height: 400,
              child: GoogleMap(
                onMapCreated: _onMapCreated,
                initialCameraPosition:
                    CameraPosition(target: _center, zoom: 13.0),
              )),
          SingleChildScrollView(
              child: Padding(
                  padding: EdgeInsets.fromLTRB(0, 300, 0, 0),
                  child: Container(
                      decoration: BoxDecoration(color: Colors.white),
                      child: Column(children: _offers))))
        ])
  

Есть идеи, как я могу это сделать? Другие предложения, отличные от моего существующего макета, более чем приветствуются, при условии, что результаты будут такими же 🙂

Комментарии:

1. если я правильно понял, вы хотите динамически изменять порядок стека?

2. @HarshBhikadia ну, я просто хочу иметь возможность перемещать карту. Но сейчас не могу взаимодействовать с ним, поскольку вид прокрутки (или отступ) находится сверху, поэтому он не позволяет мне

Ответ №1:

Похоже, вы столкнулись с проблемой, аналогичной той, которую я решил в своем приложении. У меня были два интерактивных виджета, наложенных друг на друга в предварительном просмотре фотографий, которые были виджетами панорамирования и рисования. Я хотел дать пользователям возможность переключаться между взаимодействиями двух виджетов. Поскольку оба виджета были полноэкранными, мне нужно было сделать «верхний» виджет прозрачным для кликов пользователя, в зависимости от логического флага (в моем случае, panEnable ). Для решения этой проблемы я использовал виджет IgnorePointer:

 class PhotoPreviewScreen extends StatefulWidget {
  _PhotoPreviewScreen createState() => _PhotoPreviewScreen();
}

class _PhotoPreviewScreen extends State<PhotoPreviewScreen>  {
  bool  panEnable = true; // THAT IS THE enable/disable flag
  final String imagePath = 'my_image.jpg'; // image to show and interact with

  @override
  Widget build(BuildContext context) {     
      return Scaffold(
          body: Stack(
            children: [
                InteractiveViewer( // This is the "lower widget"
                  panEnabled: panEnable, // THAT IS THE enable/disable flag
                  scaleEnabled: panEnable,  // THAT IS THE enable/disable flag
                  boundaryMargin: EdgeInsets.all(double.infinity), 
                  minScale: 1,
                  maxScale: 16,
                  child: Image.file(
                    File(imagePath), // imagePath — local path to an image in Preview
                  ),
                ),
                Center(
                  child: Stack(
                    children: <Widget>[
                           IgnorePointer(
                             ignoring: panEnable,  // THAT IS THE enable/disable flag
                             child:
                                 SomeFullScreenActionWidget( // AN UPPER ACTION
                                   onPressed: () => <SOME ACTION>,
                                   ), // SomeFullScreenActionWidget
                             ), //  IgnorePointer
                           // <here might be some "passive" widgets that are not use pointers
                          ], // children of Stack widget
                 ), // Stack
                ), // Center
                IconButton( // wrap it in Align/Positioned or any other widget to arrange the widgets switch button on the screen
                  iconSize: 33.0,
                  color: Colors.white,
                  icon: Icon(!panEnable? CupertinoIcons.pencil_outline:   CupertinoIcons.pencil_slash), // I use some stylish icons, you may choose standard
                  onPressed: () {
                    setState(() {
                      panEnable = !panEnable; // HERE IS THE SWITCH enable/disable flag
                      }); // SetState
                    }, // onPressed
                  ), // IconButton
               ], // children of Stack
              ),  // Stack
             ); // Scaffold
  

Важно отметить, что я использовал StatefulWidget класс для использования setState() . Если бы вместо этого использовался StatelessWidget класс, он не функционировал бы должным образом.