You like to add a search field to a screen in PowerApps and expect to be able to make something show when you enter a value in the field.

How is the component made?

‍

You will be need a Text Field, a Timer Control and an Icon to implement this. Suggest that you organize the control in container.

What we aim for here, is make changes in the UI based on actions in the text field. PowerApps only have the OnChanged property for reacting to changes in a field, it doesn't fire on every keystroke.

‍

How do I know that something is changed?

You use the Timer Control to run an expression e.g. 5 times every second. Each time you run, you compare the current value of the input field with the last stored value, and if the value is different you run whatever update you like to run. In our case we change a context variable named searchFor to the last entered value

‍

The RED Icon fields visibility is control by the value of searchFor. So whenver there isn't any value if the ORANGE text field, the RED and the GREEN elements are not visible

‍

How do I query for new data when changes are made?

That is out of scope for this post.

‍

‍

‍

‍

‍

The SearchBarTextInput isn't touched here

You find this and a lot of other components in Jumpto365's PowerApps and Design Guide starter kit. From there you can simply click on "Search Bar Component" and hit Ctrl+C, then move to your own PowerApp and press Ctrl+V.

‍

‍