(16)Flutter PopupMenuItem

最新推荐文章于 2024-12-13 09:53:17 发布

安果移不动

最新推荐文章于 2024-12-13 09:53:17 发布

阅读量1.1k

点赞数

CC 4.0 BY-SA版权

分类专栏： 042Flutter

独学而无友，则孤陋寡闻。q群582951247

本文链接：https://blog.csdn.net/mp624183768/article/details/113488286

042Flutter 专栏收录该内容

135 篇文章

订阅专栏

本文提供了一个使用Flutter实现的弹出菜单示例代码，通过点击按钮触发弹出菜单，并可以选择不同的选项，如Home、Discover和Community等。该示例展示了如何使用PopupMenuButton组件创建交互式的菜单。

效果

点击弹出按钮并可以选中

源码

import 'package:flutter/material.dart';

class PupupMenuDemo extends StatefulWidget {
  @override
  _PupupMenuDemoState createState() => _PupupMenuDemoState();
}

class _PupupMenuDemoState extends State<PupupMenuDemo> {
  String _currentMenuItem = "Home";

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("PopupMenu"),
        elevation: 0.0,
      ),
      body: Container(
        padding: EdgeInsets.all(16.0),
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Row(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                Text(_currentMenuItem),
                PopupMenuButton(
                    onSelected: (value) {
                      setState(() {
                        _currentMenuItem = value;
                        print(value);
                      });
                    },
                    itemBuilder: (BuildContext context) => [
                          PopupMenuItem(
                            child: Text("home"),
                            value: "Home",
                          ),
                          PopupMenuItem(
                            child: Text("Discover"),
                            value: "Discover",
                          ),
                          PopupMenuItem(
                            child: Text("Communtiy"),
                            value: "Communtiy",
                          )
                        ])
              ],
            )
          ],
        ),
      ),
    );
  }
}