PopupMenuEntry的水平对齐 [英] Horizontal Alignment of PopupMenuEntry

问题描述

是否有一种方法可以使PopupMenu的各项在水平方向而不仅仅是在垂直方向对齐？

Is there a way to have items of a PopupMenu to align horizontally and not only vertically ?

我想向小部件添加更多行为，并使其作为

I want to add more behaviours to a widget and having it passed as the child of a PopupMenu offers all the requirements except for the rendering.

推荐答案

Flutter的弹出菜单具有很多内部常量，它要求弹出窗口是垂直的。如果您想更改轴并完全控制布局和大小，则可以复制该文件并开始对其进行编辑。

Flutter's popup menu has a lot of internal constants and it requires that the axis of the popup is vertical. You can make a copy of that file and start editing it if you want to change the axis and have full control over the layout and sizing.

如果您不太喜欢对于布局有些挑剔，您可以通过将 Row 小部件嵌入为单个弹出菜单项来伪造它。以下是一些演示该方法的代码：

If you're not too picky about layout, you can fake it by embedding a Row widget as a single popup menu item. Here's some code demonstrating that approach:

< img src = https://i.stack.imgur.com/LNUmL.png alt = screenshot>

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
      title: 'Flutter Demo',
      home: new MyHomePage(),
    );
  }
}

/// An arbitrary widget that lives in a popup menu
class PopupMenuWidget<T> extends PopupMenuEntry<T> {
  const PopupMenuWidget({ Key key, this.height, this.child }) : super(key: key);

  @override
  final Widget child;

  @override
  final double height;

  @override
  bool get enabled => false;

  @override
  _PopupMenuWidgetState createState() => new _PopupMenuWidgetState();
}

class _PopupMenuWidgetState extends State<PopupMenuWidget> {
  @override
  Widget build(BuildContext context) => widget.child;
}


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

  @override
  Widget build(BuildContext context) {
    return new Scaffold(
      appBar: new AppBar(
        actions: <Widget>[
          new PopupMenuButton<String>(
            onSelected: (String value) {
              print("You selected $value");
            },
            itemBuilder: (BuildContext context) {
              return [
                new PopupMenuWidget(
                  height: 40.0,
                  child: new Row(
                    children: [
                      new IconButton(
                        icon: new Icon(Icons.add),
                        onPressed: () => Navigator.pop(context, 'add')),
                      new IconButton(
                        icon: new Icon(Icons.remove),
                        onPressed: () => Navigator.pop(context, 'remove')),
                    ],
                  ),
                ),
              ];
            }
          ),
        ],
      ),
    );
  }
}

这篇关于PopupMenuEntry的水平对齐的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！