I can't see all texts written inside OutlineInputBorder in Flutter-CodePudding

 Container(
                margin: const EdgeInsets.only(left: 10, bottom: 12),
                constraints: BoxConstraints.tightFor(width: 50, height: 40),
                child: TextFormField(
                  decoration: InputDecoration(
                    enabledBorder: OutlineInputBorder(
                      borderSide: BorderSide(width: 1, color: Colors.green),
                    ),
                    disabledBorder: OutlineInputBorder(
                      borderSide: BorderSide(width: 1, color: Colors.green),
                    ),
                    focusedBorder: OutlineInputBorder(
                      borderSide: BorderSide(width: 1, color: Colors.green),
                    ),
                  ),

When I don't assign any borders to the TextFormField, my text goes forever. But when I add OutlineInputBorder, it doesn't show the texts.

If I enter another value, it does not show that value. becomes an empty TextFormField. However, when I delete it, I can see those values are there. But it doesn't fit inside OutlineInputBorder.

As seen when OutlineInputBorder is removed, previously written texts are also seen and the line continues forever.

If there's something wrong with the width I've given in BoxConstraints, I need to fix it without breaking that value.

CodePudding user response：

Try the following code:

Container(
  margin: const EdgeInsets.only(left: 10, bottom: 12),
  constraints: const BoxConstraints.tightFor(width: 50),
  child: TextFormField(
    decoration: const InputDecoration(
      enabledBorder: OutlineInputBorder(
        borderSide: BorderSide(width: 1, color: Colors.green),
      ),
      disabledBorder: OutlineInputBorder(
        borderSide: BorderSide(width: 1, color: Colors.green),
      ),
      focusedBorder: OutlineInputBorder(
        borderSide: BorderSide(width: 1, color: Colors.green),
      ),
    ),
  ),
),

CodePudding user response：

Try the following code, add content Padding in Input Decoration.

 Container(
    margin: const EdgeInsets.only(left: 10, bottom: 12),
    constraints: BoxConstraints.tightFor(width: 50, height: 40),
    child: TextFormField(
      decoration: const InputDecoration(
        contentPadding: EdgeInsets.symmetric(horizontal: 8),
        enabledBorder: OutlineInputBorder(
          borderSide: BorderSide(width: 1, color: Colors.green),
        ),
        disabledBorder: OutlineInputBorder(
          borderSide: BorderSide(width: 1, color: Colors.green),
        ),
        focusedBorder: OutlineInputBorder(
          borderSide: BorderSide(width: 1, color: Colors.green),
        ),
      ),),),