Trending Articles       10 Flutter Listview Examples       Flutter Custom Button Example       Flutter Audio Recording       Flutter 2.0 Autocomplete TextField       Current Location Google Maps

How to add placeholder text to TextField or TextformField

Flutter we have two type of edit fields are there, one is TextField and other one is TextFormField. Some times before user enter text into the field user has to know what data we have to write into that specific TextField, to do that we need to set placeholder text to that TextField widget. In this post we will show you how to add placeholder text to Textfield in flutter example. We can validate form field data with flutter form validation example

 

Let's get started

Step 1: Create android application

Step 2: Create a dart file with your required field widgets.

Step 3: To add placeholder text to textfiled we need to add like below

TextField(
  decoration: InputDecoration(
      border: InputBorder.none,
      hintText: 'Please enter a user name'
  ),
),

 

To add placeholder text to TextFormField we need to add like below

TextFormField(
  decoration: InputDecoration(
      hintText: "User Name"
  ),
  validator: (value) {
    if(value.isEmpty) {
      return 'Please enter valid user name';
    }
  },
),

 

 

Tags: How to add a placeholder text into TextField or TextFormField in Flutter


113 Views

Author: RRTutors