The default ImageTarget prefab that we added to our scene includes a Default Trackable Event Handler component. It implements the ITrackableEventHandler interface, specifically the OnTrackingFound, OnTrackingLost, and OnTrackingChanged events. We used these events and interface in earlier projects in this book.

For Smart Terrain and our app, we need a different implementation of this interface. Our implementation began with the Penguin example project provided by Vuforia for Smart Terrain. Like all good programmers, don't start coding from scratch when you don't need to! The implementation is slightly different from the DefaultTrackableEventHandler class in three ways:

• We provide the option to toggle children components (or not) when tracking is lost and found
• We toggle the Canvas component when tracking like other objects
• We send an event when an item is first tracked (to initiate our Smart Terrain)

Let's get started:

1. In the Scripts folder create a new C# script named ImageTrackableEventHandler.
2. Drag it onto ImageTarget as a component.
3. Remove the Default Trackable Event Handler component that we're replacing (gear-icon | Remove Component).

Open the ImageTrackableEventHandler script for editing and begin by defining the class and class variables that are initialized in the Start() function, as follows:

File: ImageTrackableEventHandler.cs
using UnityEngine; 
using UnityEngine.Events; 
using Vuforia; 
 
public class ImageTrackableEventHandler : MonoBehaviour, ITrackableEventHandler { 
 
    public UnityEvent OnImageTrackableFoundFirstTime; 
    private bool toggleOnStateChange; 
 
    private TrackableBehaviour mTrackableBehaviour; 
    private bool m_TrackableDetectedForFirstTime; 
 
    void Start() { 
        mTrackableBehaviour = GetComponent<TrackableBehaviour>(); 
        if (mTrackableBehaviour) { 
            mTrackableBehaviour.RegisterTrackableEventHandler(this); 
        } 
    } 

Next, add an accessor function to toggle state, which will be used by the UI:

    public bool ToggleOnStateChange { 
        get { return toggleOnStateChange; } 
        set { toggleOnStateChange = value; ToggleComponenets(value); } 
    } 
 

Now, we implement the ITrackableEventHandler interface functions, as follows:

    public void OnTrackableStateChanged( 
                                    TrackableBehaviour.Status previousStatus, 
                                    TrackableBehaviour.Status newStatus) { 
        if (newStatus == TrackableBehaviour.Status.DETECTED || 
            newStatus == TrackableBehaviour.Status.TRACKED) { 
            OnTrackingFound(); 
        } else { 
            OnTrackingLost(); 
        } 
    } 
 
    private void OnTrackingFound() { 
        if (toggleOnStateChange) 
            ToggleComponenets(true); 
        if (!m_TrackableDetectedForFirstTime) { 
            OnImageTrackableFoundFirstTime.Invoke(); 
            m_TrackableDetectedForFirstTime = true; 
        } 
 
        Debug.Log("Trackable " + mTrackableBehaviour.TrackableName + " found"); 
    } 
 
    private void OnTrackingLost() { 
        if (toggleOnStateChange) 
            ToggleComponenets(false); 
 
        transform.position = Vector3.zero; 
        transform.rotation = Quaternion.identity; 
 
        Debug.Log("Trackable " + mTrackableBehaviour.TrackableName + " lost"); 
    } 
 

Finally, the ToggleComponents function reaches all the child renderers, colliders, and canvases:

    void ToggleComponents(bool enabled) { 
        Renderer[] rendererComponents = GetComponentsInChildren<Renderer>(true); 
        Collider[] colliderComponents = GetComponentsInChildren<Collider>(true); 
        Canvas[] canvasComponents = GetComponentsInChildren<Canvas>(true); 
        // Enable rendering: 
        foreach (Renderer component in rendererComponents) { 
            component.enabled = enabled; 
        } 
 
        // Enable colliders: 
        foreach (Collider component in colliderComponents) { 
            component.enabled = enabled; 
        } 
 
        //Enable Canvases 
        foreach (Canvas component in canvasComponents) { 
            component.enabled = enabled; 
        } 
    } 
} 

Save the script.