textfield decoration border flutter code example

Example 1: text field outline flutter

TextField(
              decoration: new InputDecoration(
                focusedBorder: OutlineInputBorder(
                  borderSide: BorderSide(color: Colors.greenAccent, width: 5.0),
                ),
                enabledBorder: OutlineInputBorder(
                  borderSide: BorderSide(color: Colors.red, width: 5.0),
                ),
                hintText: 'Mobile Number',
              ),

Example 2: flutter 2 inputdecorations on same row

// This worked for me... Also can replace Expanded with Flexible see:
// https://stackoverflow.com/questions/52645944/flutter-expanded-vs-flexible

Row(
  children: <Widget>[
    Expanded(
      child: Row(
        children: <Widget>[
          Expanded(
            flex: 3,
            child: TextField(
              decoration: InputDecoration(
                  hintText: 'Time'),
            ),
          ),
          Expanded(
            flex: 4,
            child: Text("(in mins)/"),
          ),
        ],
      ),
    ),
    Expanded(
      child: Row(
        children: <Widget>[
          Expanded(
            flex: 3,
            child: TextField(
              decoration: InputDecoration(
                  hintText: 'Whistle'),
            ),
          ),
          Expanded(
            flex: 4,
            child: Text("(whistles)"),
          ),
        ],
      ),
    ),
  ],
),

Tags:

Dart Example