How to Create Search TextField like Nokia?

In Nokia S40 the search field for the contacts is looked like this

enter image description here

This TextField is really interactive, if I put some text the magnifier will change into x Button. I've tried to create the TextField in LWUIT and override the paint methods to put the magnifier image but it can't use as a button.

Are there any component I can use to recreate something like this (Especially with LWUIT)? Or maybe are there any ready-to-be-used component from Nokia to create something like this?

Best Regards

Solution

You can do something similar to that, but it won't look like the native SearchField, but it will work fine.

What you can do is this. Create a container with a boxLayoutX and put inside it a TextField and a Button. When you capture that the TextField has text inside, change the Image attached to the Button to a X and here it is. You only need to implement the functionallity of the Button.