Analogue clocks are often more visually appealing, and often worth the little extra effort in creating the GUI elements for the clock-face and hands.
To display an analogue clock, please follow these steps:
m_seconds
, m_minutes
, and m_hours
.hand-seconds
, apply the m_seconds
material, and then turn this into a long, thin second hand by setting the following properties:hand-minutes
, apply the m_minutes
material, and turn this into a medium long, medium width minute hand by setting the following properties:hand-hours
, apply the m_hours
material, and turn this into a short, wide hour hand by setting the following properties:pivot
game objects for each hand to rotate around. Create a new empty game object named hours-pivot
at (0,0,0). Make this the parent of hand-hours
. Create another named minutes-pivot
at (0,0,0), and make this the parent of hand-minutes
. Create a final object named seconds-pivot
at (0,0,0), and make this the parent of hand-seconds
.// file: ClockAnalogue.cs using UnityEngine; using System.Collections; using System; public class ClockAnalogue : MonoBehaviour { public Transform secondHandPivot; public Transform minuteHandPivot; public Transform hourHandPivot; private void Update() { DateTime time = DateTime.Now; float seconds = (float)time.Second; float minutes = (float)time.Minute; float hours12 = (float)time.Hour % 12; float angleSeconds = -360 * (seconds/60); float angleMinutes = -360 * (minutes/60); float angleHours = -360 * (hours12 / 12); // rotate each hand secondHandPivot.localRotation = Quaternion.Euler(0f, 0f, angleSeconds); minuteHandPivot.localRotation = Quaternion.Euler(0f, 0f, angleMinutes); hourHandPivot.localRotation = Quaternion.Euler(0f, 0f, angleHours); } }
The clock-face is constructed as follows:
Every frame's Update()
method rotates all three hands about their clock-face center pivot game object by an angle proportionate to the seconds/minutes/hours of the DateTime
object.
An angle in degrees is calculated as a proportion of 360 for each hand. This angle is used as the amount the object should be rotated about its z axis (calculated using the Quaternion.Euler()
function provided by Unity).
Each clock-hand has its original position arranged as the center of the clock-face, and then half the length of the hand added to the y-axis co-ordinate. For example, the clock face has a center of (0,0,0), and the second hand is a cube with a y-axis scale of 5, so its center is (0, 2.5, 0). This means that each hand, when rotated around the center of the clock-face, moves correctly. The width of the hands is determined by the x-axis scaling, so the second hand is thin (x-axis scale is 0.1) and long (y-axis scale is 5), while the hour hand is wide (x-axis scale is 0.5) and short (y-axis scale is 3). The wider short hands are further from the user (larger z-axis positions), and the thinner long hands are nearer the user, so that the wide hour hand can be seen behind the thinner minute and second hands even when pointing to the same clock-face position.
Here are some details you don't want to miss.
Usually, a clock does not take up the whole screen, and one method of having a view of a GameObject
that only takes up part of the screen, is by having a second camera. The following screenshot shows a scene where the Main Camera shows a cube, but a second camera (Camera – clock) has been created to display in the top-right corner of the screen:
By default, cameras display to a "normalized viewport" of the whole screen (0,0)-(1,1). However, by setting the rectangle of a camera's normalized viewport to less than the whole screen, the desired effect can be created, as shown in the following screenshot. Our second Camera – clock camera has a viewport rectangle of (0.8,0.8)-(1,1) which defines the 20 percent top-right corner of the screen, as we can see in.
3.21.93.20