Flutter showMenu() положение оси x

#flutter #dart #flutter-layout

#flutter #дротик #flutter-макет

Вопрос:

У меня есть конструктор Gridview, который генерирует следующее, и у меня есть детектор жестов с onLongPress, который отображает меню как таковое:

карты

Я могу выровнять меню по соответствующему элементу сетки, например, если я долго нажимаю на зеленое поле, оно должно отображать меню под полем:

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

Однако я не могу установить горизонтальное положение x.

Если я установлю значение L или R, оно переместит меню в крайнее левое или правое положение, чего я не хочу. Я хочу центрировать меню по центру оси x зеленого прямоугольника.

 onLongPress: () {
        RenderBox box = key.currentContext.findRenderObject();
        double h = double.parse(box.size.height.toString());
        Offset position =
            box.localToGlobal(Offset.zero); //this is global position
        double y = position.dy;
        double x = position.dx;
        double w = double.parse(box.size.width.toString());

        print(x);
        showMenu(
            context: context,
            position: new RelativeRect.fromLTRB(x, 0, y   h, 0),
            items: <PopupMenuEntry>[
              PopupMenuItem(
                value: 1,
                child: Row(
                  children: <Widget>[
                    Icon(Icons.delete),
                    Text("Delete"),
                  ],
                ),
              )
            ]);
      },
 

Короче говоря, я хотел бы сделать что-то вроде:

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

   body: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          
          Expanded(
            child: GridView.builder(
              shrinkWrap: false,
              itemCount: data.length,
              gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                childAspectRatio: 10.0 / 10.0,
                crossAxisCount: 2,
              ),
              itemBuilder: (BuildContext context, int index) {
                GlobalKey _key = GlobalKey();

                return Padding(
                  padding: EdgeInsets.all(10),
                  child: CustomCard(data[index], _key),
                );
              },
            ),
          ),
        ],
      ),
    );
 

Пользовательская карточка

  return GestureDetector(
      onTapDown: _storePosition,
      onLongPress: () {
      
        showMenu(
            context: context,
            position:null,
            items: <PopupMenuEntry>[
              PopupMenuItem(
                value: 1,
                child: Row(
                  children: <Widget>[
                    Icon(Icons.delete),
                    Text("Delete"),
                  ],
                ),
              )
            ]);
      },
      child: Card(
        color: d.color,
        elevation: 5,
        semanticContainer: true,
        shape: RoundedRectangleBorder(
          borderRadius: BorderRadius.circular(10.0),
        ),
        clipBehavior: Clip.antiAlias,
        child: Padding(
          padding: EdgeInsets.symmetric(vertical: 20),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.center,
            mainAxisAlignment: MainAxisAlignment.spaceEvenly,
            children: <Widget>[
              Text(
                d.title,
                style: TextStyle(fontSize: 20, fontWeight: FontWeight.w500),
              ),
            
             
            ],
          ),
        ),
      ),
    );
 

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

1. Эй, position: new RelativeRect.fromLTRB(x, 0, y h, 0), это кажется неразумным. Вы устанавливаете значение R равным y h. Я думаю, вы хотите, чтобы T или B были такими

2. @ch271828n Я перепробовал много разных комбинаций, но не смог заставить ось x работать должным образом.

Ответ №1:

Это работает для меня, я взял width / 2 для обоих left и right и установил top as y h 20 (20, чтобы дать ему дополнительное пространство) top .

                     position: new RelativeRect.fromLTRB(
                        w / 2, y   h   20, w / 2, 0),
 

Это полная работа Code над A Container с некоторыми height и width .

             GestureDetector(
              onLongPress: () {
                RenderBox box = key.currentContext.findRenderObject();
                double h = double.parse(box.size.height.toString());
                Offset position = box.localToGlobal(
                    Offset.zero); //this is global position
                double y = position.dy;
                double x = position.dx;
                double w = double.parse(box.size.width.toString());
                showMenu(
                    context: context,
                    position: new RelativeRect.fromLTRB(
                        w / 2, y   h   20, w / 2, 0),
                    items: <PopupMenuEntry>[
                      PopupMenuItem(
                        value: 1,
                        child: Row(
                          children: <Widget>[
                            Icon(Icons.delete),
                            Text("Delete"),
                          ],
                        ),
                      )
                    ]);
              },
              child: new Container(
                key: key,
                color: Colors.red,
                height: 120,
                width: 300,
                child: Center(child: new Text("Tap Me")),
              ),
            ),
 

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

1. Привет, большое спасибо за вашу помощь. Однако это не работает. Когда я нажимаю на правую карту, она не отображается справа. У меня по две карты в каждом ряду.

2. Привет @latil68469 Я думаю, что вы внедряете onLongPress на неправильном виджете, пожалуйста, внимательно проверьте свой код, возможно, в реализации кода есть ошибка.

3. Я убедился, что это правильно, а также попробовал ваш код. Может ли это быть из-за разработчика? Я обновил свой пост кодом в конце, спасибо!

4. @latil68469 вы уже пытались удалить расширенные виджеты? и если это тоже не сработало, пожалуйста, вставьте код для вашего виджета CustomCard.

5. Мне нужно использовать расширенный, так как я использую GridviewBuilder в столбце.