# InputField autocomplete

I'm trying to make an InputField like the one shown below in Unity. I don't see any way I could do this in Unity. I also want to use google places autocomplete API.I am using Unity v5.6.1f1 .Is this possible?.

• You should take a look at the OnValueChanged event of the InputField class – Hellium Sep 11 '17 at 10:02
• Did you ever get this working? – Jan Oct 16 '18 at 23:12
• @Jan Yes, I did. – azemda Oct 17 '18 at 6:48
• @azemda care to share your solution? Thanks! – Jan Oct 17 '18 at 20:20
• Actually it's been a while since I've done this and don't have the code right now, but I'll do this again and share as soon as possible. – azemda Oct 19 '18 at 1:17

Here is a little script I made to give you an idea :

using UnityEngine;
using UnityEngine.UI;
using System.Collections.Generic;

public class Autocomplete : MonoBehaviour
{
public InputField inputField;
public RectTransform resultsParent;
public RectTransform prefab;

private void Awake()
{
}

private void OnInputValueChanged( string newText )
{
ClearResults();
FillResults( GetResults( newText ) );
}

private void ClearResults()
{
// Reverse loop since you destroy children
for( int childIndex = resultsParent.childCount - 1 ; childIndex >= 0 ; --childIndex )
{
Transform child = resultsParent.GetChild( childIndex );
child.SetParent( null );
Destroy( child.gameObject );
}
}

private void FillResults(List<string> results)
{
for (int resultIndex = 0 ; resultIndex < results.Count ; resultIndex++)
{
RectTransform child = Instantiate( prefab ) as RectTransform;
child.GetComponentInChildren<Text>().text = results[resultIndex];
child.SetParent( resultsParent );
}
}

private List<string> GetResults( string input )
{
List<string> mockData = new List<string>() { "Paris", "Madrid", "London", "Rome", "Brussels", "Athens", "Dublin", "Lisbon", "Amsterdam", "Luxembourg" };

return mockData.FindAll( (str) => str.IndexOf( input ) >= 0 );
}

}


Attach this script to the inputfield, drag & drop in the inspector the input field, a RectTransform with a VerticalLayoutGroup component (to layout correctly the results), and a Text prefab (or any UI component you want with a child containing a Text component).

Currently, you should replace the content of the GetResults so as to retrieve the results from your library. Since I don't know this library, you will have to do it on your own ;)

• I was in the middle of sorting this out, I'll post my version of solution soon enough, thanks for the reply. – azemda Sep 11 '17 at 11:00