Flutter报错：ThemeData未定义textSelectionColor getter方法求助

问题描述 #

我是一名Flutter新手，在使用代码时遇到错误：The getter 'textSelectionColor' isn't defined for the type 'ThemeData'。已搜索相关解决方案但未找到有效办法，检查代码后仍无头绪，希望能得到帮助。

错误说明 #

报错指向代码中Theme.of(context).textSelectionColor的调用，提示该属性在ThemeData类中未定义。

相关代码 #

import 'package:ordering_app/consts/color.dart';
import 'package:ordering_app/consts/my_icons.dart';
import 'package:ordering_app/inner_screens/product_details.dart';
import 'package:ordering_app/provider/cart_provider.dart';
import 'package:ordering_app/provider/dark_theme_provider.dart';
import 'package:ordering_app/provider/favs_provider.dart';
import 'package:ordering_app/provider/products.dart';
import 'package:flutter/material.dart';
import 'package:flutter_icons/flutter_icons.dart';
import 'package:provider/provider.dart';

class FeedDialog extends StatelessWidget {
  final String productId;
  const FeedDialog({required this.productId});

  @override
  Widget build(BuildContext context) {
    final productsData = Provider.of<Products>(context, listen: false);

    final cartProvider = Provider.of<CartProvider>(context);

    final favsProvider = Provider.of<FavsProvider>(context);

    final prodAttr = productsData.findById(productId);
    return Dialog(
      shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(16),
      ),
      elevation: 0.0,
      backgroundColor: Colors.transparent,
      child: SingleChildScrollView(
        child: Column(children: [
          Container(
            constraints: BoxConstraints(
                minHeight: 100,
                maxHeight: MediaQuery.of(context).size.height * 0.5),
            width: double.infinity,
            decoration: BoxDecoration(
              color: Theme.of(context).scaffoldBackgroundColor,
            ),
            child: Image.network(
              prodAttr.imageUrl,
            ),
          ),
          Container(
            color: Theme.of(context).scaffoldBackgroundColor,
            child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceEvenly,
                children: [
                  Flexible(
                    child: dialogContent(
                        context,
                        0,
                            () => {
                          favsProvider.addAndRemoveFromFav(
                              productId,
                              prodAttr.price,
                              prodAttr.title,
                              prodAttr.imageUrl),
                          Navigator.canPop(context)
                              ? Navigator.pop(context)
                              : null
                        }),
                  ),
                  Flexible(
                    child: dialogContent(
                        context,
                        1,
                            () => {
                          Navigator.pushNamed(
                              context, ProductDetails.routeName,
                              arguments: prodAttr.id)
                              .then((value) => Navigator.canPop(context)
                              ? Navigator.pop(context)
                              : null),
                        }),
                  ),
                  Flexible(
                    child: dialogContent(
                      context,
                      2,
                      cartProvider.getCartItems.containsKey(productId)
                          ? () {}
                          : () {
                        cartProvider.addProductToCart(
                            productId,
                            prodAttr.price,
                            prodAttr.title,
                            prodAttr.imageUrl);
                        Navigator.canPop(context)
                            ? Navigator.pop(context)
                            : null;
                      },
                    ),
                  ),
                ]),
          ),

          /************close****************/
          Container(
            margin: EdgeInsets.all(8),
            decoration: BoxDecoration(
                border: Border.all(color: Colors.white, width: 1.3),
                shape: BoxShape.circle),
            child: Material(
              color: Colors.transparent,
              child: InkWell(
                borderRadius: BorderRadius.circular(30),
                splashColor: Colors.grey,
                onTap: () =>
                Navigator.canPop(context) ? Navigator.pop(context) : null,
                child: Padding(
                  padding: const EdgeInsets.all(8.0),
                  child: Icon(Icons.close, size: 28, color: Colors.white),
                ),
              ),
            ),
          ),
        ]),
      ),
    );
  }

  Widget dialogContent(BuildContext context, int index, Function fct) {
    final cart = Provider.of<CartProvider>(context);
    final favs = Provider.of<FavsProvider>(context);
    List<IconData> _dialogIcons = [
      favs.getFavsItems.containsKey(productId)
          ? Icons.favorite
          : Icons.favorite_border,
      Feather.eye,
      MyAppIcons.cart,
    ];

    List<String> _texts = [
      favs.getFavsItems.containsKey(productId)
          ? 'In wishlist'
          : 'Add to wishlist',
      'View product',
      cart.getCartItems.containsKey(productId) ? 'In Cart ' : 'Add to cart',
    ];
    List<Color> _colors = [
      favs.getFavsItems.containsKey(productId)
          ? Colors.red
          : Theme.of(context).textSelectionColor,
      Theme.of(context).textSelectionColor,
      Theme.of(context).textSelectionColor,
    ];
    final themeChange = Provider.of<DarkThemeProvider>(context);
    return FittedBox(
      child: Material(
        color: Colors.transparent,
        child: InkWell(
          //onTap: fct,
          splashColor: Colors.grey,
          child: Container(
            width: MediaQuery.of(context).size.width * 0.25,
            padding: EdgeInsets.all(4),
            child: Column(
              children: [
                Container(
                  decoration: BoxDecoration(
                    color: Theme.of(context).backgroundColor,
                    shape: BoxShape.circle,
                    boxShadow: [
                      BoxShadow(
                        color: Colors.black26,
                        blurRadius: 10.0,
                        offset: const Offset(0.0, 10.0),
                      ),
                    ],
                  ),
                  child: ClipOval(
                    // inkwell color
                    child: SizedBox(
                        width: 50,
                        height: 50,
                        child: Icon(
                          _dialogIcons[index],
                          color: _colors[index],
                          size: 25,
                        )),
                  ),
                ),
                Padding(
                  padding: const EdgeInsets.all(5.0),
                  child: FittedBox(
                    child: Text(
                      _texts[index],
                      maxLines: 1,
                      textAlign: TextAlign.center,
                      style: TextStyle(
                        fontWeight: FontWeight.w800,
                        //  fontSize: 15,
                        color: themeChange.darkTheme
                            ? Theme.of(context).disabledColor
                            : ColorsConsts.subTitle,
                      ),
                    ),
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

解决方案 #

这个错误是因为Flutter版本更新后，ThemeData.textSelectionColor被废弃并移除，替代属性是ThemeData.textSelectionTheme.selectionColor。

修改代码中dialogContent方法里的_colors列表：

List<Color> _colors = [
  favs.getFavsItems.containsKey(productId)
      ? Colors.red
      : Theme.of(context).textSelectionTheme.selectionColor ?? Theme.of(context).primaryColor,
  Theme.of(context).textSelectionTheme.selectionColor ?? Theme.of(context).primaryColor,
  Theme.of(context).textSelectionTheme.selectionColor ?? Theme.of(context).primaryColor,
];

添加?? Theme.of(context).primaryColor是为了防止selectionColor为null时出现异常，你也可以替换成项目中自定义的颜色常量（比如ColorsConsts中的颜色），保持风格统一。

内容的提问来源于stack exchange，提问作者Bryce Justine Cacho