Implementing an on-screen joystick

To implement this on-screen joystick, we will utilize two images: a background image and then a joystick image placed on top of it. We will then write code to allow the player to simulate that they are physically moving the joystick. Later, we learn how we can have the simulated joystick actually affect the game properly:

1. Right-click on the On-Screen Controls object and create an image by selecting UI | Image. We will then rename the object to Joystick Background.
2. From the Image component, set Source Image to the analogStickBackground sprite and click on the Set Native Size button.
3. From the Rect Transform component, hold down Alt + Shift and use the Anchor Presets menu to move Joystick Background to the bottom-left option.
4. Next, right-click on the Joystick Background object and create another image by selecting UI | Image. We will then rename the object to Joystick.
5. From the Image component, set Source Image to the analogStick...