flutter change border color on focus

Question

what is the easy way to change border color on focus? on focus, I want

in border: Border.all(width: 2, color: Colors.white)), child: Icon(...

to be Colors.yellow

MaterialButton(
    padding: EdgeInsets.all(4.0),
    focusColor: Colors.indigo,
    elevation: 0.0,
    //focusNode: myFocusNode,
    child: Container(
      child: new Align(
          alignment: Alignment.bottomRight,
          child: Container(
            margin: EdgeInsets.all(20),
            padding: EdgeInsets.all(10),
            decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(50),
                border: Border.all(width: 2, color: Colors.white)),
            child: Icon(
              Icons.search,
              color: Colors.white,
            ),
          )),
    ),
    onPressed: () async {},
  )

Salim Murshed Salim Murshed · Accepted Answer · 2020-10-02T20:14:05

You can follow the below code.

import 'package:flutter/material.dart';

bool focus = false;

class teset extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => teset_RunAppPageState();
}

class teset_RunAppPageState extends State<teset> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: MaterialButton(
        padding: EdgeInsets.all(4.0),
        focusColor: Colors.indigo,
        elevation: 0.0,
        //focusNode: myFocusNode,
        child: Container(
          child: new Align(
              alignment: Alignment.bottomRight,
              child: Container(
                margin: EdgeInsets.all(20),
                padding: EdgeInsets.all(10),
                decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(50),
                    border: Border.all(
                        width: 2, color: focus ? Colors.white : Colors.yellow)),
                child: Icon(
                  Icons.search,
                  color: Colors.white,
                ),
              )),
        ),
        onPressed: () async {
          setState(() {
            focus = !focus;
          });
        },
      ),
    );
  }
}

flutter change border color on focus

1 Answers