Unity3D: How to create a link button, with fun

How to create a link style button in Unity3D? Here the considerations include:

The link button should look like a label, instead of a button

The link button should work like a button, with clickable responses such as navigating to a URL;

When the mouse hovers, the mouse cursor should look like a hand cursor, instead of the arrow cursor.

Emmmmm, interesting! But it is not as easy as imagined to get it implemented. Let’s get started!

To meet requirement (1) and (2) , we can use below code:

But you may find that this works well, but the color of text is not blue as of a true link button!

To change the text color to blue, we can improve the implementation with below code. Specifically by setting the use rich text to true to the style, and use html tags:

Now this looks better, and the color matches our expectation. But note the cursor, it is still arrow, instead of hand cursor.

Let’s move one step further as following:

We first get the rect of the button control as in Line (1), and then use EditorGUILayout.AddCursorRect( ) to specify the link cursor, see Line (3). Cool, this works! See the cursor now!

But hold on, note that when the mouse is over the same line, but a little bit off the text, the cursor is still hand/link cursor! This is because we are using GUILayout.Button, whose rect is the entire parent’s width! To fix this, see Line (2), where we calculate the width of the link’s text, and adjust the rect’s width. Oh yeah! Done!

To recap, we can use below function to create a Link button in Unity3D.