August
14th
2015

Extend the functions of UnityEngine.UI.Button
by

The new Unity UI elements offers a nice and easy to use items to build graphical interfaces. But, wanted to use buttons in one of our game leads us with a problem. As matter of fact, the standard Button offers only to trigger callbacks on onClick event, meaning user have to click down and release the click on the button. Using buttons to control directions and jumps, for directions, testing player felt a lack of reactivity, action triggered when the user released the button, so a moment after he pushed the button to turn. Also, we wanted to keep the player jumping while pressing the jump button.

 

Screen Shot 2015-08-14 at 01.52.08

 

Well, it is possible to hard code the action triggered by implementing in a script attached to the button IPointerUpHandler and IPointerDownHandler but that means less re-usability of your script and not really easy to debug/use on programmer’s side. And the solution is simple and elegant, so why not taking few minutes to implement it? Well, having a look into the default implementation here, it is simple as creating a script with the following code and attaching it to your button:

 

using System.Collections;
using System;
using UnityEngine.Events;
using UnityEngine.EventSystems;
using UnityEngine.Serialization;
using UnityEngine;

namespace Takohi
{
	public class EventUpDown : MonoBehaviour, IPointerDownHandler, IPointerUpHandler
	{
	#region PointerDown
		[Serializable]
		public class ClickDownEvent : UnityEvent
		{
		}

		// Event delegates triggered on down.
		[FormerlySerializedAs("onDown")]
		[SerializeField]
		private ClickDownEvent
			m_OnDown = new ClickDownEvent ();

		public ClickDownEvent onDown {
			get { return m_OnDown; }
			set { m_OnDown = value; }
		}

		// Trigger all registered callbacks.
		public virtual void OnPointerDown (PointerEventData eventData)
		{
			m_OnDown.Invoke ();
		}
	#endregion

	#region PointerUp
		[Serializable]
		public class ClickUpEvent : UnityEvent
		{
		}

		// Event delegates triggered on down.
		[FormerlySerializedAs("onUp")]
		[SerializeField]
		private ClickUpEvent
			m_OnUp = new ClickUpEvent ();

		public ClickUpEvent onUp {
			get { return m_OnUp; }
			set { m_OnUp = value; }
		}

		public virtual void OnPointerUp (PointerEventData eventData)
		{
			m_OnUp.Invoke ();
		}
	#endregion
	}
}

Now, you’re getting these new options in your editor:
Screen Shot 2015-08-14 at 01.57.51

And if you want to remove the first line mentioning the script, you can just add your own editor script by creating a new script in Assets/Editor with the following code:

 

using UnityEngine;
using System.Collections;
using UnityEditor;

namespace Takohi
{
	[CustomEditor(typeof(EventUpDown), true)]
	public class EventUpDownEditor : Editor
	{
		SerializedProperty m_DownEventProperty;
		SerializedProperty m_UpEventProperty;

		protected void OnEnable ()
		{
			m_DownEventProperty = serializedObject.FindProperty ("m_OnDown");
			m_UpEventProperty = serializedObject.FindProperty ("m_OnUp");
		}

		public override void OnInspectorGUI ()
		{
			serializedObject.Update ();
			EditorGUILayout.PropertyField (m_DownEventProperty);
			EditorGUILayout.PropertyField (m_UpEventProperty);
			serializedObject.ApplyModifiedProperties ();
		}

	}
}

That’s it!