系列文章目录
麦田物语第十六天
文章目录
- 系列文章目录
- 一、代码链接 UI 实现时间日期对应转换
- 二、第二场景的绘制
一、代码链接 UI 实现时间日期对应转换
本小节我们实现的是根据代码将UI和数据逻辑TimeManager联系起来。
首先我们创建Scripts->Time->UI->TimeUI脚本，接着就是脚本的编写了。
先引入Ui和DoTween插件的命名空间，然后声明变量，包括通过旋转切换早晨，中午，下午，晚上的图片，通过时间增加标识的图片父物体，季节的标识图片，还有显示日期和时间的Text，季节所要切换的图片数组，最后就是通过时间增加标识的图片子物体数组；（这里解释的不是很清楚）
TimeUI脚本的变量声明
public RectTransform dayNightImage;
public RectTransform clockParent;
public Image seasonImage;
public Text dateText;
public Text timeText;
public Sprite[] seasonSprites;
private List<GameObject> clockBlocks = new List<GameObject>();
- 1
- 2
- 3
- 4
- 5
- 6
- 7
然后返回Unity将该脚本拖拽到GameTime上并对这些变量进行赋值。
变量赋值结果如下
接下来我们还要在Awake方法中对clockBlocks 数组进行赋值，即将clockParent的所有子物体添加到数组中，并且将所有的子物体都SetActive（false）。
那么我们怎么实现UI跟随数据变化嘞？
我们需要在EventHandler脚本中声明两个新的事件（这个按照自己的方法，也可以每一个变量声明一个），然后在每次变量更新时呼叫这个事件即可（和之前事件的方法类似）。
EventHandler脚本中新声明的事件如下：
//和分钟变化有关的事件
public static event Action<int, int> GameMinuteEvent;
public static void CallGameMinuteEvent(int minute, int hour)
{
GameMinuteEvent?.Invoke(minute, hour);
}
//和日期相关的变化
public static event Action<int, int, int, int, Season> GameDateEvent;
public static void CallGameDateEvent(int hour, int day, int month,int year, Season season)
{
GameDateEvent?.Invoke(hour, day, month, year, season);
}
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
那么我们只需要在gameMinute改变时调用CallGameMinuteEvent即可，在GameHour改变时调用CallGameDateEvent即可；在此就不展示这两处代码。
接着我们需要返回TimeUI脚本中注册这些事件，编写OnEnable和OnDisable方法。
TimeUI脚本中的OnEnable和OnDisable方法如下：
private void OnEnable()
{
EventHandler.GameMinuteEvent += OnGameMinuteEvent;
EventHandler.GameDateEvent += OnGameDateEvent;
}
private void OnDisable()
{
EventHandler.GameMinuteEvent -= OnGameMinuteEvent;
EventHandler.GameDateEvent -= OnGameDateEvent;
}
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
然后我们编写OnGameMinuteEvent和OnGameDateEvent方法。
在OnGameMinuteEvent方法中我们只需要更改TimeText的text属性即可。
在OnGameDateEvent方法中我们除了需要更改DateText的text的属性外，还要更改季节图片的显示，并编写SwitchHourImage方法根据小时切换时间块的显示，编写DayNightImageRotate方法根据小时旋转图片。
TimeUI脚本的OnGameMinuteEvent和OnGameDateEvent方法代码如下：
private void OnGameMinuteEvent(int minute, int hour)
{
timeText.text = hour.ToString("00") + ":" + minute.ToString("00");
}
private void OnGameDateEvent(int hour,int day, int month, int year, Season season)
{
dateText.text = year + "年" + month.ToString("00") + "月" + day.ToString("00") + "日";
seasonImage.sprite = seasonSprites[(int)season];
SwitchHourImage(hour);
DayNightImageRotate(hour);
}
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
最后我们需要编写SwitchHourImage和DayNightImageRotate方法。
在SwitchHourImage方法中，我们把每日的事件分成6等分，每等分只需要四个小时，因为我们定义index变量，如果index == 0，那么将clockBlocks数组中所有的物体都SetActive（false），如果不为0，那么根据for循环，如果index小于clockBlocks数组的序号 + 1，那么将该序号的物体SetActive（true），反之SetActive（false）。这块着重讲一下为什么要clockBlocks数组的序号 + 1，因为我设置的每天的hourHold为23，所以当gameHour为23时就会切换到0，那么index的值只会使0-5，而i的取值也是0-5，那么就会导致序号为5的图片怎么都无法显示，所以将index+ 1使得所有的图片都可以显示。
SwtichHourImage方法如下：
/// <summary>
/// 根据小时切换时间块显示
/// </summary>
/// <param name="hour"></param>
private void SwitchHourImage(int hour)
{
int index = hour / 4;
if (index == 0)
{
foreach (var item in clockBlocks)
{
item.SetActive(false);
}
}
else
{
for (int i = 0; i < clockBlocks.Count; i++)
{
if (i < index + 1) clockBlocks[i].gameObject.SetActive(true);
else clockBlocks[i].gameObject.SetActive(false);
}
}
}
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
在DayNightImageRotate方法中，我们设置旋转的目标值，只需要更改z值就行；因为我们有24个小时，所以每增加一小时图片旋转15°（360/24）,接着我们想要使得每次游戏开始时的图片是黑夜，所以我们将z值设置为hour * 15 - 90。然后用DORotate方法根据目标值进行旋转。
DayNightImageRotate方法如下：
/// <summary>
/// 按照小时旋转图片
/// </summary>
/// <param name="hour"></param>
private void DayNightImageRotate(int hour)
{
var target = new Vector3(0, 0, hour * 15 - 90);
dayNightImage.DORotate(target, 1f, RotateMode.Fast);
}
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
TimeUI脚本的代码如下：
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using DG.Tweening;
using UnityEngine.UI;
public class TimeUI : MonoBehaviour
{
public RectTransform dayNightImage;
public RectTransform clockParent;
public Image seasonImage;
public Text dateText;
public Text timeText;
public Sprite[] seasonSprites;
private List<GameObject> clockBlocks = new List<GameObject>();
private void Awake()
{
for (int i = 0; i < clockParent.childCount; i++)
{
clockBlocks.Add(clockParent.GetChild(i).gameObject);
clockParent.GetChild(i).gameObject.SetActive(false);
}
}
private void OnEnable()
{
EventHandler.GameMinuteEvent += OnGameMinuteEvent;
EventHandler.GameDateEvent += OnGameDateEvent;
}
private void OnDisable()
{
EventHandler.GameMinuteEvent -= OnGameMinuteEvent;
EventHandler.GameDateEvent -= OnGameDateEvent;
}
private void OnGameMinuteEvent(int minute, int hour)
{
timeText.text = hour.ToString("00") + ":" + minute.ToString("00");
}
private void OnGameDateEvent(int hour,int day, int month, int year, Season season)
{
dateText.text = year + "年" + month.ToString("00") + "月" + day.ToString("00") + "日";
seasonImage.sprite = seasonSprites[(int)season];
SwitchHourImage(hour);
DayNightImageRotate(hour);
}
/// <summary>
/// 根据小时切换时间块显示
/// </summary>
/// <param name="hour"></param>
private void SwitchHourImage(int hour)
{
int index = hour / 4;
if (index == 0)
{
foreach (var item in clockBlocks)
{
item.SetActive(false);
}
}
else
{
for (int i = 0; i < clockBlocks.Count; i++)
{
if (i < index + 1) clockBlocks[i].gameObject.SetActive(true);
else clockBlocks[i].gameObject.SetActive(false);
}
}
}
/// <summary>
/// 按照小时旋转图片
/// </summary>
/// <param name="hour"></param>
private void DayNightImageRotate(int hour)
{
var target = new Vector3(0, 0, hour * 15 - 90);
dayNightImage.DORotate(target, 1f, RotateMode.Fast);
}
}
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 83
- 84
- 85
- 86
- 87
- 88
- 89
最后为了方便测试，我们在TimeManager的Update方法中添加了加速方法，长按T键可以快速增加时间，代码如下。
private void Update()
{
if (!gameClockPause)
{
tikTime += Time.deltaTime;
if (tikTime >= Settings.secondThreshold)
{
tikTime -= Settings.secondThreshold;
UpdateGameTime();
}
}
//作弊命令
if (Input.GetKey(KeyCode.T))
{
for (int i = 0; i < 60; i++)
{
UpdateGameTime();
}
}
}
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
二、第二场景的绘制
本小节要绘制房间的场景，还是需要完成之前的工作，创建Tilemap，然后绘制好场景后，绘制Collision层，添加Bounds设置摄像机边界，创建ItemParent并设置Tag。