简体   繁体   English

如何在flutter应用程序中的PopupMenuItem的开头添加一个图标

[英]How to add an Icon at the beginning of PopupMenuItem in flutter app

I have a PopupMenuButton widget in which I want to add an icon at the beginning of each PopupMenuItem .我有一个PopupMenuButton小部件,我想在每个PopupMenuItem的开头添加一个图标。 I've been trying to find a way to do this but I'm not finding any.我一直试图找到一种方法来做到这一点,但我没有找到任何方法。

Below is the **main.dart** file.
import 'package:flutter/material.dart';
import 'package:practical_0/homepage.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
          primarySwatch: Colors.blue
      ),
      home: Homepage(),
    );
  }
}

Below is the home.dart file.下面是home.dart文件。 This is where I have implemented the PopupMenuButton.这是我实现 PopupMenuButton 的地方。 I want the icon to appear at the beginning of PopupMenuItem before the text .我希望图标出现在text之前的PopupMenuItem的开头。

import 'package:flutter/material.dart';

enum WhyFarther { harder, smarter, selfStarter, tradingCharter }

class Homepage extends StatelessWidget {

  final double heightFactor = 600/896;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        return new Card(
          new Row(
            children: <Widget>[
              PopupMenuButton<WhyFarther>(
               onSelected: (WhyFarther result) { setState(() { _selection = result; }); },
               itemBuilder: (BuildContext context) => <PopupMenuEntry<WhyFarther>>[
                const PopupMenuItem<WhyFarther>(
                  value: WhyFarther.harder,
                  child: Text('Working a lot harder'),
                ),
                const PopupMenuItem<WhyFarther>(
                  value: WhyFarther.smarter,
                  child: Text('Being a lot smarter'),
                ),
                const PopupMenuItem<WhyFarther>(
                  value: WhyFarther.selfStarter,
                  child: Text('Being a self-starter'),
                 ),
                 const PopupMenuItem<WhyFarther>(
                   value: WhyFarther.tradingCharter,
                   child: Text('Placed in charge of trading charter'),
                 ),
                ],
              ),
            ],
          )
        ),
      ),
    );
  }
}

You can do it with a Row, like this :你可以用一行来做,就像这样:

PopupMenuItem<WhyFarther>(
                    value: WhyFarther.harder,
                    child: Row(
                      children: <Widget>[
                        Icon(Icons.work),
                        Text('Working a lot harder'),
                      ],
                    ),
                  ),

I would actually suggest using a ListTile like this:我实际上建议使用这样的 ListTile:

              PopupMenuItem<WhyFarther>(
                value: WhyFarther.harder,
                child: ListTile(
                  leading: Icon(Icons.work),
                  title: Text('Working a lot harder'),
                ),
              )

Checkout Flutter Gallery for a live example: https://gallery.flutter.dev/#/demo/menu查看 Flutter Gallery 以获取实时示例: https : //gallery.flutter.dev/#/demo/menu

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM