how to make TextField hintText vertical center?

Issue

i tried many methods.

  • textAlign: TextAlign.Center

  • contentPadding: const EdgeInsets.all(20.0)

but they are useless.

enter image description here

Expanded(
          child: Container(
            height: 30.0,
            decoration: BoxDecoration(
              color: Colors.grey[100],
              borderRadius: BorderRadius.circular(18),
            ),
            margin: const EdgeInsets.symmetric(vertical: 0, horizontal: 10.0),
            child: const TextField(
              style: TextStyle(fontSize: 14.0),
              decoration: InputDecoration(
                border: InputBorder.none,
                hintText: '请输入搜索词',
                hintStyle: TextStyle(fontSize: 13.0),
                prefixIcon: Icon(
                  Icons.search,
                  size: 18.0,
                  color: Colors.grey,
                ),
                suffixIcon: Icon(
                  Icons.clear,
                  size: 18.0,
                  color: Colors.grey,
                ),
              ),
            ),
          ),
        ),

Solution

Try below code, use textAlign: TextAlign.center,

TextField(
  textAlign: TextAlign.center,
  style: TextStyle(fontSize: 14.0),
  decoration: InputDecoration(
    border: InputBorder.none,
    hintText: '请输入搜索词',
    hintStyle: TextStyle(fontSize: 13.0),
    prefixIcon: Icon(
      Icons.search,
      size: 18.0,
      color: Colors.grey,
    ),
    suffixIcon: Icon(
      Icons.clear,
      size: 18.0,
      color: Colors.grey,
    ),
  ),
),

Result screen-> image

Answered By – Ravindra S. Patil

Answer Checked By – Robin (FlutterFixes Admin)

Leave a Reply

Your email address will not be published.