在这个工具栏的主要位置上可以添加一个菜单,我们先定义一个菜单项目小部件,在 lib/app/components 的下面新建一个文件,名字是 app_text_menu_item.dart。
在文件里面定义一个小部件,名字是 AppTextMenuItem ,小部件里面添加几个属性,String 类型的 label,它的值是菜单项目上显示的文字。GestureTapCallback? 名字是 onTap,点按菜单项目的回调。还有一个 bool 类型的属性,名字是 isActive ,表示菜单项目当前是否是激活状态。
添加一个构造方法,AppTextMenuItem ,添加几个带名字的参数,required this.label ,this.onTap,this.isActive ,默认值是 false 。
小部件的 build 方法里面,声明一个 Color? 类型的值,名字是 color 。 还有一个 FontWeight ,名字是 fontWeight ,默认等于 FontWeight.normal 。
下面判断一下 isActive,如果项目当前是激活状态,设置一下 color ,值可以用一下 Theme.of(context) ,用一下 textTheme.bodyText1! 里的 color。 下面再把 fontWeight 设置成 FontWeight.bold 。
小部件 return 的是一个 Container ,它的 child 可以用一个 GestureDetector ,onTap 设置成 onTap ,child 是一个 Text 小部件,文字是 label,style 是一个 TextStyle ,fontSize 是 16,color 是 color,fontWeight 是 fontWeight 。