gpt4 book ai didi

How to change style of TextFormField's contextMenu(如何更改TextFormfield的上下文菜单的样式)

翻译 作者:bug小助手 更新时间:2023-10-26 22:17:03 24 4
gpt4 key购买 nike



I'm using my custom ThemeData and TextFormField. When I long press the TextFormField, the content of the menu that appears near the TextFormField does not appear. Below are my Custom ThemeData and TextFormField. How can I solve this? What I did wrong ?

我正在使用我的定制ThemeData和TextFormfield。当我长按TextFormField时,TextFormField附近出现的菜单内容不会出现。下面是我的Custom ThemeData和TextFormfield。我怎么才能解决这个问题?我做错了什么?


enter image description here
enter image description here


theme_data_manager.dart

主题数据管理器.dart


import 'package:f_weather/product/init/theme/utility/color_manager.dart';
import 'package:flutter/material.dart';

@immutable
final class ThemeDataManager {
/// The `darkTheme` getter in the `CustomThemeData` class is returning a `ThemeData` object that defines
/// the visual appearance of the app when using a dark theme.
ThemeData get darkTheme {
return ThemeData(
useMaterial3: true,
inputDecorationTheme: InputDecorationTheme(
floatingLabelBehavior: FloatingLabelBehavior.never,
hintStyle: const TextStyle(
fontSize: 14,
),
filled: true,
fillColor: ColorManager.darkSecondaryColor,
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(20),
borderSide: BorderSide(
color: ColorManager.activeColor,
width: 2,
),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(20),
borderSide: BorderSide(
color: ColorManager.lightPrimaryColor,
width: 2,
),
),
),
colorScheme: const ColorScheme.dark().copyWith(
primary: ColorManager.lightPrimaryColor,
),
scaffoldBackgroundColor: ColorManager.darkPrimaryColor,
appBarTheme: AppBarTheme(
backgroundColor: ColorManager.darkPrimaryColor,
),
bottomNavigationBarTheme: BottomNavigationBarThemeData(
selectedItemColor: ColorManager.activeColor,
backgroundColor: ColorManager.darkSecondaryColor,
elevation: 10,
),
textTheme: TextTheme(
titleMedium: TextStyle(
fontSize: 28,
fontWeight: FontWeight.bold,
color: ColorManager.lightPrimaryColor,
),
titleSmall: TextStyle(
fontSize: 20,
fontWeight: FontWeight.bold,
color: ColorManager.lightPrimaryColor,
),
),
);
}

/// The `lightTheme` getter in the `CustomThemeData` class is returning a `ThemeData` object that
/// defines the visual appearance of the app when using a light theme.
ThemeData get lightTheme {
return ThemeData(
useMaterial3: true,
inputDecorationTheme: InputDecorationTheme(
floatingLabelBehavior: FloatingLabelBehavior.never,
hintStyle: const TextStyle(
fontSize: 14,
),
filled: true,
fillColor: ColorManager.lightSecondaryColor,
focusedBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(20),
borderSide: BorderSide(
color: ColorManager.activeColor,
width: 2,
),
),
enabledBorder: OutlineInputBorder(
borderRadius: BorderRadius.circular(20),
borderSide: BorderSide(
color: ColorManager.darkSecondaryColor,
width: 2,
),
),
),
colorScheme: const ColorScheme.light().copyWith(
primary: ColorManager.darkPrimaryColor,
),
scaffoldBackgroundColor: ColorManager.lightPrimaryColor,
appBarTheme: AppBarTheme(
backgroundColor: ColorManager.lightPrimaryColor,
),
bottomNavigationBarTheme: BottomNavigationBarThemeData(
selectedItemColor: ColorManager.activeColor,
backgroundColor: ColorManager.lightSecondaryColor,
elevation: 10,
selectedIconTheme: IconThemeData(
color: ColorManager.darkPrimaryColor,
),
),
textTheme: TextTheme(
titleMedium: TextStyle(
fontSize: 28,
fontWeight: FontWeight.bold,
color: ColorManager.darkPrimaryColor,
),
titleSmall: TextStyle(
fontSize: 20,
fontWeight: FontWeight.bold,
color: ColorManager.darkPrimaryColor,
),
),
);
}
}



search_text_form_field.dart

搜索文本表单字段.dart


import 'package:f_weather/product/state/search_places_manager.dart';
import 'package:flutter/material.dart';
import 'package:flutter_mobx/flutter_mobx.dart';

class SearchTextFormField extends StatelessWidget {
const SearchTextFormField({
super.key,
required this.controller,
});

final TextEditingController controller;

@override
Widget build(BuildContext context) {
double width = MediaQuery.sizeOf(context).width;
double height = MediaQuery.sizeOf(context).height;

return SizedBox(
width: width * 0.9,
height: height * 0.06,
child: Observer(
builder: (context) => TextFormField(
contextMenuBuilder: (context, editableTextState) {
return AdaptiveTextSelectionToolbar.buttonItems(
anchors: editableTextState.contextMenuAnchors,
buttonItems: <ContextMenuButtonItem>[
ContextMenuButtonItem(
onPressed: () {
editableTextState.copySelection(SelectionChangedCause.toolbar);
},
type: ContextMenuButtonType.copy,
),
ContextMenuButtonItem(
onPressed: () {
editableTextState.selectAll(SelectionChangedCause.toolbar);
},
type: ContextMenuButtonType.selectAll,
),
ContextMenuButtonItem(
onPressed: () {
editableTextState.cutSelection(SelectionChangedCause.toolbar);
},
type: ContextMenuButtonType.cut,
),
],
);
},
enableInteractiveSelection: true,
onChanged: (value) {
value.isNotEmpty
? GetSearchPlacesStateManager.searchPlacesManager.changeClearButtonState(isActive: true)
: GetSearchPlacesStateManager.searchPlacesManager.changeClearButtonState(isActive: false);
},
controller: controller,
autofocus: true,
keyboardType: TextInputType.streetAddress,
maxLines: 1,
autocorrect: false,
onTapOutside: (_) => FocusManager.instance.primaryFocus?.unfocus(),
decoration: InputDecoration(
suffixIcon: GetSearchPlacesStateManager.searchPlacesManager.isActiveClearButton
? IconButton(
onPressed: () {
controller.clear();
GetSearchPlacesStateManager.searchPlacesManager.changeClearButtonState(isActive: false);
},
icon: const Icon(Icons.clear_outlined),
)
: null,
hintText: "Search Places",
prefixIcon: const Icon(Icons.search),
),
),
),
);
}
}



更多回答
优秀答案推荐
更多回答

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com