5

这是我尝试设置 TextFormField 小部件颜色的以下代码。我尝试更改 Container Widget 和 Card Widget 的颜色，但我无法特别更改 TextFormField Widget 的颜色。

child: Container(
                  height: MediaQuery.of(context).size.height,
                  color: Colors.white,
                  child: Card(
                      color: Colors.blue,
                      child: Form(
                          key: _formKey,
                          child: Column(children: [
    Padding(
                                  padding:
                                      const EdgeInsets.fromLTRB(30, 50, 30, 20),
                                  child: TextFormField(
                                      keyboardType: TextInputType.emailAddress,
                                      decoration: InputDecoration(
                                          border: OutlineInputBorder(
                                          borderSide:
                                              const BorderSide(color: Colors.white),
                                          borderRadius: BorderRadius.circular(25.0),
                                        ),
                                        prefixIcon: Icon(
                                          Icons.email,
                                          color: Colors.blue,
                                        ),
                                        labelText: "Email",
                                        labelStyle: TextStyle(
                                            color: Colors.black,
                                            fontSize: 18,
                                            fontWeight: FontWeight.w300),
                                      ),
        

                        ),
4

3 回答 3

6

使用 InputDecoration 的 fillColor 和 Filled 属性

decoration: InputDecoration(
                                filled: true,

          labelText: "Resevior Name",
          fillColor: Colors.black,
          
        ),
于 2021-05-29T14:51:07.200 回答
2

我尝试了几种不同的方法来更改 TextFormField 小部件的颜色。最后，我发现了如何更改 TextFormField 小部件的背景颜色。

将 TextFormField 小部件的填充属性设置为 true，并将 fillColor 属性设置为所需的颜色。IE，

fillColor: Colors.white,
filled: true,

代码

child: Container(
                  height: MediaQuery.of(context).size.height,
                  color: Colors.white,
                  child: Card(
                      color: Colors.blue,
                      child: Form(
                          key: _formKey,
                          child: Column(children: [
    Padding(
                                  padding:
                                      const EdgeInsets.fromLTRB(30, 50, 30, 20),
                                  child: TextFormField(
                                      keyboardType: TextInputType.emailAddress,
                                      decoration: InputDecoration(
                                          fillColor: Colors.white,
                                          filled: true,
                                          border: OutlineInputBorder(
                                          borderSide:
                                              const BorderSide(color: Colors.white),
                                          borderRadius: BorderRadius.circular(25.0),
                                        ),
                                        prefixIcon: Icon(
                                          Icons.email,
                                          color: Colors.blue,
                                        ),
                                        labelText: "Email",
                                        labelStyle: TextStyle(
                                            color: Colors.black,
                                            fontSize: 18,
                                            fontWeight: FontWeight.w300),
                                      ),
        

                        ),
于 2021-05-29T14:51:27.803 回答
0 
TextFormField(
    decoration: InputDecoration(
        labelText: "title",
        fillColor: Colors.white,
        filled: true, // dont forget this line
        ...
    )
    ...
)
于 2022-02-24T07:55:46.803 回答