我的小部件包含一个被 Container 包裹的 TextField，用于样式和边框。 我必须在 TextField 的 InputDecoration 中使用 filled: true。 否则，主题（flex_color_scheme）似乎不符合我的UI需求。 在这个最小示例中使用 filled: false 可以解决，但在真实应用中似乎并非如此，这也是我不能接受此类回答的另一个原因。 你可能会建议的另一种方法是padding，看起来确实能解决，但因为我不能确定在生产模式的各种设备上不会出问题，所以也不能接受这种回答。 除此之外，我没找到其他办法，在这里请求你的帮助。谢谢。

最小代码：

import 'package:animated_custom_dropdown/custom_dropdown.dart';
import 'package:flex_color_scheme/flex_color_scheme.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';

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

// A global (or top-level) notifier for the theme state
final ValueNotifier<bool> useFlexThemeNotifier = ValueNotifier<bool>(false);

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return ListenableBuilder(
      listenable: useFlexThemeNotifier,
      builder: (context, child) {
        return MaterialApp(
          theme: useFlexThemeNotifier.value
              ? flexThemeLight
              : defaultThemeLight,
          darkTheme: useFlexThemeNotifier.value
              ? flexThemeDark
              : defaultThemeDark,
          home: MyHomePage(),
        );
      },
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key});

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final List<String> myList = [
    "Developer",
    "Designer",
    "Consultant",
    "Student",
  ];

  @override
  Widget build(BuildContext context) {
    final colorScheme = Theme.of(context).colorScheme;

    return Scaffold(
      appBar: AppBar(
        title: const Text("custom dropdown and flex color"),
        // backgroundColor: Colors.blue.shade700,
      ),
      body: Padding(
        padding: const EdgeInsets.all(25.0),
        child: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            mainAxisSize: MainAxisSize.max,
            children: [
              ElevatedButton(
                onPressed: () {
                  useFlexThemeNotifier.value = !useFlexThemeNotifier.value;
                },
                child: useFlexThemeNotifier.value
                    ? const Text("Use Default color scheme")
                    : const Text("Use Flex color scheme"),
              ),
              const SizedBox(height: 10.0),
              CustomDropdown<String>(
                decoration: CustomDropdownDecoration(
                  // closedFillColor: Colors.transparent,
                  closedBorderRadius: BorderRadius.circular(30),
                  headerStyle: TextStyle(color: colorScheme.primary),
                  listItemStyle: TextStyle(color: colorScheme.primary),
                ),
                hintText: 'Select job role',
                items: myList,
                initialItem: myList[0],
                onChanged: (value) {
                  print("### changed value to: $value");
                },
              ),
              const SizedBox(height: 10.0),
              Container(
                decoration: BoxDecoration(
                  border: Border.all(
                    color: colorScheme.primary.withValues(alpha: 0.4),
                    style: BorderStyle.solid,
                  ),
                  borderRadius: BorderRadius.circular(30),
                ),
                clipBehavior: Clip.antiAlias,
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  mainAxisSize: MainAxisSize.min,
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    TextField(
                      textInputAction: TextInputAction.done,
                      decoration: InputDecoration(
                        filled: true,
                        fillColor: colorScheme.onPrimary,
                        // prefixIcon: const Icon(Icons.search),
                        contentPadding: EdgeInsets.symmetric(
                          horizontal: 16,
                          vertical: 8,
                        ),
                        hintText: '0.00',
                        border: InputBorder.none,
                      ),
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

abstract final class AppTheme {
  // The FlexColorScheme defined light mode ThemeData.
  static ThemeData light = FlexThemeData.light(
    // Using FlexColorScheme built-in FlexScheme enum based colors
    // greenM3 a.k.a. Camarone Green in FlexColorScheme v8.
    scheme: FlexScheme.greenM3,
    appBarStyle: FlexAppBarStyle.primary,
    fontFamily: "Roboto",
    // Scaffold background customization - START:
    // scaffoldBackground: Colors.grey,
    // surfaceMode: FlexSurfaceMode.levelSurfacesLowScaffold,
    surfaceMode: FlexSurfaceMode.highScaffoldLowSurface,
    // A blendLevel of 2-5 gives a professional, slightly tinted off-white
    blendLevel: 3,
    // Scaffold background customization - END.
    // Component theme configurations for light mode.
    subThemesData: const FlexSubThemesData(
      interactionEffects: true,
      tintedDisabledControls: true,
      useM2StyleDividerInM3: true,
      inputDecoratorIsFilled: true,
      inputDecoratorBorderType: FlexInputBorderType.outline,
      alignedDropdown: true,
      navigationRailUseIndicator: true,
    ),
    // Direct ThemeData properties.
    visualDensity: FlexColorScheme.comfortablePlatformDensity,
    cupertinoOverrideTheme: const CupertinoThemeData(applyThemeToAll: true),
  );

  // The FlexColorScheme defined dark mode ThemeData.
  static ThemeData dark = FlexThemeData.dark(
    // Using FlexColorScheme built-in FlexScheme enum based colors.
    scheme: FlexScheme.greenM3,
    appBarStyle:
        FlexAppBarStyle.surface, // .primary in dark mode doesn't look good.
    fontFamily: "Roboto",
    // Scaffold background customization - START:
    // scaffoldBackground: Colors.grey,
    // surfaceMode: FlexSurfaceMode.levelSurfacesLowScaffold,
    surfaceMode: FlexSurfaceMode.highScaffoldLowSurface,
    // A blendLevel of 2-5 gives a professional, slightly tinted off-white
    blendLevel: 3,
    // Scaffold background customization - END.
    // Component theme configurations for dark mode.
    subThemesData: const FlexSubThemesData(
      interactionEffects: true,
      tintedDisabledControls: true,
      blendOnColors: true,
      useM2StyleDividerInM3: true,
      inputDecoratorIsFilled: true,
      inputDecoratorBorderType: FlexInputBorderType.outline,
      alignedDropdown: true,
      navigationRailUseIndicator: true,
    ),
    // Direct ThemeData properties.
    visualDensity: FlexColorScheme.comfortablePlatformDensity,
    cupertinoOverrideTheme: const CupertinoThemeData(applyThemeToAll: true),
  );
}

// Using the default values for Flex color scheme: Blue delight
abstract final class AppTheme02 {
  // The FlexColorScheme defined light mode ThemeData.
  static ThemeData light = FlexThemeData.light(
    // Using FlexColorScheme built-in FlexScheme enum based colors
    scheme: FlexScheme.blue,
    // Component theme configurations for light mode.
    subThemesData: const FlexSubThemesData(
      interactionEffects: true,
      tintedDisabledControls: true,
      useM2StyleDividerInM3: true,
      inputDecoratorIsFilled: true,
      inputDecoratorBorderType: FlexInputBorderType.outline,
      alignedDropdown: true,
      navigationRailUseIndicator: true,
    ),
    // Direct ThemeData properties.
    visualDensity: FlexColorScheme.comfortablePlatformDensity,
    cupertinoOverrideTheme: const CupertinoThemeData(applyThemeToAll: true),
  );

  // The FlexColorScheme defined dark mode ThemeData.
  static ThemeData dark = FlexThemeData.dark(
    // Using FlexColorScheme built-in FlexScheme enum based colors.
    scheme: FlexScheme.blue,
    // Component theme configurations for dark mode.
    subThemesData: const FlexSubThemesData(
      interactionEffects: true,
      tintedDisabledControls: true,
      blendOnColors: true,
      useM2StyleDividerInM3: true,
      inputDecoratorIsFilled: true,
      inputDecoratorBorderType: FlexInputBorderType.outline,
      alignedDropdown: true,
      navigationRailUseIndicator: true,
    ),
    // Direct ThemeData properties.
    visualDensity: FlexColorScheme.comfortablePlatformDensity,
    cupertinoOverrideTheme: const CupertinoThemeData(applyThemeToAll: true),
  );
}

final ThemeData defaultThemeLight = ThemeData.light(useMaterial3: true);
final ThemeData defaultThemeDark = ThemeData.dark(useMaterial3: true);
final ThemeData flexThemeLight = AppTheme.light;
final ThemeData flexThemeDark = AppTheme.dark;
/*
final ThemeData flexThemeLight = AppTheme02.light;
final ThemeData flexThemeDark = AppTheme02.dark;
*/

截图：

含有 clipBehavior: Clip.antiAlias

不含 clipBehavior: Clip.antiAlias

解决方案

你可以在TextDecoration里面使用 enabledBorder，

TextField(
  textInputAction: TextInputAction.done,
  decoration: InputDecoration(
    filled: true,
    // .. use the same as your decoration
    enabledBorder: OutlineInputBorder(
        borderRadius: BorderRadius.circular(30)),
    focusedBorder: ,
    errorBorder: ,
    focusedErrorBorder: ,
    disabledBorder: ,