如何使用 flutter 将文本框的边框设为圆形？

Question

I am making an email textfield and would love for the edges of the textbox to be circular. I have no clue on how to go about it. Any help will be beneficial.

Answer 1

It is more like you need to use OutlineInputBorder() .

TextFormField(
  decoration: InputDecoration(
    border: OutlineInputBorder(
      borderRadius: BorderRadius.circular(24)  
      ),
    focusedBorder: OutlineInputBorder(), // or just OutlineInputBorder()
  ),
),

Answer 2

If you use Flutter Form Builder package , you can define it in decoration -> border -> OutlineInputBorder -> borderRadius. You can play with different options. Example with borderRadius 20 below:

       FormBuilderTextField(
          name: 'email',
          decoration: InputDecoration(
            border: const OutlineInputBorder(
              borderRadius: BorderRadius.all(Radius.circular(20)),
            ),
          ),
        ),