How to apply properties to imported library on flutter project

Question

I am new on flutter and i am trying to add some properties to a library i just imported from pub.dev.

The library is "flutter_input_field.dart' from this repo: https://github.com/SatishKumarRaizada/fancy_textfield/blob/master/lib/src/flutter_form_field.dart

Everything work fine until when i add the InputDecoration "(focusedBorder: OutlineInputBorder( borderSide: BorderSide( color: borderColor)" property and i get an error: "The argument type 'InputDecoration' can't be assigned to the parameter type 'Color' "

this is the code

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();
          },
        ),
      ],
    );
  }
}


  

add this textfield to your project and call it

FlutterInputField( borderColor: Colors.white, focusColor: Colors.green, hintText: 'Enter 1st Flour Quantity', labelText: 'Flour Quantity', textFieldController: TextEditingController(), filledColor: Colors.grey.shade200, onChange: (String st) {}, prefixWidget: const Icon( Icons.fastfood, color: Colors.green, ), cursorColor: Colors.green, onDone: () {}, ),

I just simply added defined a variable focus color and called it in constructor and assigned color from where i want to call it, Note you dont need to do this if you want borderColor and focusColor same. for this you can simply give

borderColor:Colors.black