How to add icon in Textfield

Hello! friends, I am having one question that how can I insert icons in textfield like the one which we see in Whatsapp textfield while chatting.

whatsapp gif gboard (2)

The above picture shows the same what I want to say

Hi @samiur9934!

Those aren’t actually in the text field, they’re inside of a view… For example put a text field inside in a horizontal arrangement that’s inside a card view, and then inside that horizontal arrangement, place the icons to the left and right of the text field. Don’t forget to set the text field background to ‘none’ to remove the underline that comes with it.

1 Like

How can I insert these icon?
As, they are material icons.

Should I set the horizontal arrangement background also to “none”

1 Like

Did you solve it? Don’t forget to check Resolved if you have successfully :+1: :grin:

you could try the textbox extension and its method SetBackgroundImage


No need to use any extension! Try this:

  1. Take card view, make it round by changing corner radius.
  2. Insert horizontal arrangement in it.
  3. Take label, text box and one more label in horizontal arrangement. Add spaces in between them.
  4. Set label font typeface to material icons and set label text to desired material icon name.

That’s it!

Same thing I said. But you’ll still take credit for the answer.

Yes, but you can choose any type of icon you want.