如何将属性应用于 flutter 项目中导入的库

Question

我是 flutter 的新手，我正在尝试将一些属性添加到我刚从 pub.dev 导入的库中。

该库是“flutter_input_field.dart” 来自这个回购协议：https://github.com/SatishKumarRaizada/fancy_textfield/blob/master/lib/src/flutter_form_field.dart

一切正常，直到我添加 InputDecoration "(focusedBorder: OutlineInputBorder( 边框：边框（ color: borderColor)" 属性，我得到一个错误： “不能将参数类型‘InputDecoration’分配给参数类型‘Color’”

这是代码

FlutterInputField(
              borderColor: InputDecoration(focusedBorder: OutlineInputBorder(
                borderSide: BorderSide(
                    color: borderColor),
              )),
              hintText: 'Enter 1st Flour Quantity',
              labelText: 'Flour Quantity',
              textFieldController: _textEditingController,
              filledColor: Colors.grey.shade200,
              onChange: (String st) {},
              prefixWidget: const Icon(Icons.fastfood),
              onDone: () {
              },
            ),

Answer 1

import 'package:flutter/material.dart';

class FlutterInputField extends StatelessWidget {
  final String hintText;
  final String labelText;
  final Function onChange;
  final Function onDone;
  final Widget? prefixWidget;
  final Widget? suffixWidget;
  final Color borderColor;
  final Color focusColor;
  final Color cursorColor;
  final TextEditingController? textFieldController;
  final Function? suffixTap;
  final Function? validateTextField;
  final Color? filledColor;
  final bool isSecure;
  final int lineHeight;
  final double labelFontSize;
  final double hintFontSize;

  const FlutterInputField(
      {Key? key,
      required this.hintText,
      required this.labelText,
      required this.onChange,
      required this.onDone,
      this.prefixWidget,
      this.suffixWidget,
      this.borderColor = Colors.blue,
      this.textFieldController,
      this.suffixTap,
      this.validateTextField,
      this.filledColor = Colors.lightBlue,
      this.isSecure = false,
      this.lineHeight = 1,
      this.labelFontSize = 16,
      this.hintFontSize = 16,
      this.focusColor = Colors.blue,
      this.cursorColor = Colors.blue})
      : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.start,
      crossAxisAlignment: CrossAxisAlignment.start,
      children: [
        Text(labelText),
        const SizedBox(height: 10),
        TextFormField(
          cursorColor: cursorColor,
          controller: textFieldController,
          obscureText: isSecure,
          maxLines: lineHeight,
          decoration: InputDecoration(
            focusColor: Colors.blue,
            contentPadding: const EdgeInsets.symmetric(
              horizontal: 10,
              vertical: 15,
            ),
            errorStyle: const TextStyle(
              fontSize: 16,
            ),
            filled: true,
            fillColor: filledColor,
            hintText: hintText,
            prefixIcon: prefixWidget,
            suffixIcon: suffixWidget,
            labelStyle: TextStyle(
              fontSize: labelFontSize,
            ),
            hintStyle: TextStyle(
              fontSize: hintFontSize,
            ),
            border: OutlineInputBorder(
              borderRadius: BorderRadius.circular(8.0),
              borderSide: const BorderSide(
                width: 0,
                style: BorderStyle.none,
              ),
            ),
            focusedBorder: OutlineInputBorder(
              borderRadius: BorderRadius.circular(8.0),
              borderSide: BorderSide(
                width: 0.5,
                style: BorderStyle.solid,
                color: focusColor,
              ),
            ),
          ),
          onChanged: (String str) {
            onChange(str);
          },
          validator: (String? value) {
            return validateTextField!(value);
          },
          onEditingComplete: () {
            onDone();
          },
        ),
      ],
    );
  }
}


  

将此文本字段添加到您的项目并调用它

FlutterInputField( borderColor: Colors.white, focusColor: Colors.green, hintText: '输入第一个面粉数量', labelText: '面粉数量', textFieldController: TextEditingController(), 填充颜​​色：Colors.grey.shade200, onChange：（字符串 st）{}， prefixWidget：常量图标（ 图标.快餐, 颜色：Colors.green， ), cursorColor: Colors.green, onDone: () {}, ),

我只是简单地添加了一个定义的可变焦点颜色，并在构造函数中调用它，并从我想调用它的地方分配了颜色，请注意，如果您希望 borderColor 和 focusColor 相同，则不需要这样做。为此你可以简单地给

边框颜色：Colors.black