点击时更改 TextField 的边框颜色 - Flutter

时间:2021-04-14 12:35:53

标签: flutter dart flutter-layout

这个问题可能看起来很简单,但是每当我点击文本字段时,它会自动在文本字段周围显示一个蓝色边框,如您在附图中所见。我曾尝试更改各种属性的颜色,但似乎没有任何效果。

我正在尝试将边框的颜色更改为 Colors.green

我的代码如下 -

class MainMap extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData(fontFamily: 'Quicksand',),
      home: Map(),
    );
  }
}


// ----> Stateful Widget <-----

class Map extends StatefulWidget {
  @override
  _MapState createState() => _MapState();
}

class _MapState extends State<Map> {
  LatLng currentLatLng;
  Completer<GoogleMapController> _controller = Completer();

  @override
  void initState(){
    super.initState();
    Geolocator.getCurrentPosition().then((currLocation){
      setState((){
        currentLatLng = new LatLng(currLocation.latitude, currLocation.longitude);
      });
    });
  }

  @override
  Widget build(BuildContext context) {

    final mediaQuery = MediaQuery.of(context);
    return new Scaffold(
        body: Stack(
          children: [
          currentLatLng == null ?
          Center(child: CircularProgressIndicator(),) :
          GoogleMap(
            myLocationEnabled: true,
            myLocationButtonEnabled: false,
            mapType: MapType.normal,
            zoomControlsEnabled: false,
            initialCameraPosition: CameraPosition(target: currentLatLng, zoom: 15),
            onMapCreated: (GoogleMapController controller) {
              _controller.complete(controller);
            },
          ),
            
            // ------> TEXT FIELD CODE IS BELOW <--------- 
    
            Container(
              margin: EdgeInsets.symmetric(horizontal: mediaQuery.size.width * 0.05, vertical: (mediaQuery.padding.top + 20)),
                child: TextField(
                  style: TextStyle(color: Colors.white, fontWeight: FontWeight.bold,),
                  cursorColor: Colors.white,
                  decoration: InputDecoration(
                    contentPadding: EdgeInsets.all(15),
                    focusColor: Colors.white,
                    prefixIcon: Image.asset("assets/icons/search.png",scale: 15,),
                    suffixIcon: Image.asset("assets/icons/profile.png",scale: 14,),
                    filled: true,
                      fillColor: AppColors.darkGreenSearch,
                      hintText: "Location",
                      hintStyle: TextStyle(color: Colors.white, fontWeight: FontWeight.bold),
                      border: new OutlineInputBorder(
                          borderRadius: const BorderRadius.all(const Radius.circular(50.0)),
                        borderSide: BorderSide(color: AppColors.darkGreen,),
                      ),
                  ),
                ),
            )
        ]),

enter image description here

0 个答案:

没有答案