How to change TextFormField labeltext and border color in Flutter?

Question

I have TextFormField and I want to change color of border and labelText, how can I do that?

That's how it looks now, and I want to change blue to purple. (https://im.ge/i/FImpIh)

import 'package:flutter/material.dart';

class InputTextFormField extends StatefulWidget {
  final String labelText;
  TextEditingController? controller;

  InputTextFormField({Key? key, required this.labelText, required this.controller});

  @override
  _InputTextFormFieldState createState() => _InputTextFormFieldState();
}

class _InputTextFormFieldState extends State<InputTextFormField> {
  @override
  Widget build(BuildContext context) {
    return TextFormField(
      decoration: InputDecoration(
        alignLabelWithHint: true,
        labelText: widget.labelText,
        border: const OutlineInputBorder(
          borderRadius: BorderRadius.all(Radius.circular(12.0)),

        ),
      ),
      validator: (value) => value!.isEmpty ? 'Please, fill this field.' : null,
      controller: widget.controller,
    );
  }

Answer 1

You will need to define a focusedBorder inside TextField for the border color and labelStyle for label color

class _InputTextFormFieldState extends State<InputTextFormField> {
  FocusNode myFocusNode = FocusNode();

  @override
  void initState() {
    super.initState();

    myFocusNode.addListener((){ 
      setState((){}); 
    });
  }

  @override
  void dispose() {
    myFocusNode.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return TextFormField(
      focusNode: myFocusNode,
      decoration: InputDecoration(
        alignLabelWithHint: true,
        labelText: widget.labelText,
        labelStyle: TextStyle(
          color: myFocusNode.hasFocus ? Colors.purple : Colors.black
        ),
        border: const OutlineInputBorder(
          borderRadius: BorderRadius.all(Radius.circular(12.0)),
        ),
        focusedBorder: const OutlineInputBorder(
          borderRadius: BorderRadius.all(Radius.circular(12.0)),
          borderSide: BorderSide(color: Colors.purple, width: 0.5),
        )
      ),
      validator: (value) => value!.isEmpty ? 'Please, fill this field.' : null,
      controller: widget.controller,
    );
  }
}