Код, в котором вы меняете цвет primaryColor
и primaryColorDark
, не меняет начальный цвет границы, только после нажатия цвет остается черным
Атрибут, который должен быть изменен: hintColor
BorderSide
не следует использовать для этого, вам нужно сменить тему.
Чтобы установить красный цвет по умолчанию для помещения темы в MaterialApp(theme: ...)
и изменить тему определенного виджета, например изменить красный цвет по умолчанию на желтый цвет виджета, окружает виджет с помощью:
new Theme(
data: new ThemeData(
hintColor: Colors.yellow
),
child: ...
)
Ниже приведен код и gif:
Обратите внимание, что если мы определим цвет primaryColor
как черный, нажав на виджет, он будет выделен черным цветом
Но чтобы изменить метку и текст внутри виджета, нам нужно установить тему на InputDecorationTheme
Виджет, который начинается с желтого цвета, имеет собственную тему, а виджет, который начинается с красного цвета, имеет тему по умолчанию, определенную с помощью функции buildTheme()
import 'package:flutter/material.dart';
void main() => runApp(new MyApp());
ThemeData buildTheme() {
final ThemeData base = ThemeData();
return base.copyWith(
hintColor: Colors.red,
primaryColor: Colors.black,
inputDecorationTheme: InputDecorationTheme(
hintStyle: TextStyle(
color: Colors.blue,
),
labelStyle: TextStyle(
color: Colors.green,
),
),
);
}
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new MaterialApp(
theme: buildTheme(),
home: new HomePage(),
);
}
}
class HomePage extends StatefulWidget {
@override
_HomePageState createState() => new _HomePageState();
}
class _HomePageState extends State<HomePage> {
String xp = '0';
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(),
body: new Container(
padding: new EdgeInsets.only(top: 16.0),
child: new ListView(
children: <Widget>[
new InkWell(
onTap: () {},
child: new Theme(
data: new ThemeData(
hintColor: Colors.yellow
),
child: new TextField(
decoration: new InputDecoration(
border: new OutlineInputBorder(),
hintText: 'Tell us about yourself',
helperText: 'Keep it short, this is just a demo.',
labelText: 'Life story',
prefixIcon: const Icon(Icons.person, color: Colors.green,),
prefixText: ' ',
suffixText: 'USD',
suffixStyle: const TextStyle(color: Colors.green)),
)
)
),
new InkWell(
onTap: () {},
child: new TextField(
decoration: new InputDecoration(
border: new OutlineInputBorder(
borderSide: new BorderSide(color: Colors.teal)
),
hintText: 'Tell us about yourself',
helperText: 'Keep it short, this is just a demo.',
labelText: 'Life story',
prefixIcon: const Icon(Icons.person, color: Colors.green,),
prefixText: ' ',
suffixText: 'USD',
suffixStyle: const TextStyle(color: Colors.green)),
)
)
],
),
)
);
}
}