James C
James C

Reputation: 21

Flutter: Is there any way I can change the color of the hintText in just one text field?

enter image description here

                        Padding(
                          padding: const EdgeInsets.all(20),
                          child: TextFormField(
                            style: TextStyle(fontSize: 18),
                            decoration: InputDecoration(
                              labelText: 'Balance',
                              labelStyle: TextStyle(fontSize: 18),
                              prefixText: '\$',
                              border: OutlineInputBorder(
                                borderRadius: BorderRadius.circular(10),
                              ),
                            ),
                            keyboardType: TextInputType.number,
                            validator: (input) =>
                                input.trim().isEmpty ? 'Required' : null,
                            onSaved: (input) {
                              _giftCardBalance = input;
                            },
                            initialValue: _giftCardBalance,
                          ),
                        ),

How can I change the color of just the dollar sign to black, but leave the rest of the placeholders in the text fields as gray? I have tried changing the hint color in the theme data, but that changes the color to black for all of the fields.

Upvotes: 1

Views: 272

Answers (1)

Akif
Akif

Reputation: 7660

There is a prefixStyle property of InputDecoration. You can set it like this:

Padding(
  padding: const EdgeInsets.all(20),
  child: TextFormField(
    style: TextStyle(fontSize: 18),
    decoration: InputDecoration(
      labelText: 'Balance',
      labelStyle: TextStyle(fontSize: 18),
      prefixText: '\$',
      // Here we can define the style!
      prefixStyle: TextStyle(
         color: Colors.blue,            
      ),
      border: OutlineInputBorder(
        borderRadius: BorderRadius.circular(10),
      ),
    ),
    keyboardType: TextInputType.number,
    validator: (input) =>
        input.trim().isEmpty ? 'Required' : null,
    onSaved: (input) {
      _giftCardBalance = input;
    },
    initialValue: _giftCardBalance,
  ),
),

Upvotes: 3

Related Questions