建造星系
我的计划是按程序生成银河模型模型,该模型能够将恒星数据结合在一起,以便更好地展示我们在银河系中的位置。
![银河系的早期原型。](https://web.dev/static/examples/images/image/T4FyVKpzu4WKF1kBNvXepbi08t52/S5ZbLFPB3RnfRTOT35mW.png?hl=zh-cn)
为了生成银河,我生成了 10 万个粒子,并通过模拟银河臂的形成方式将它们放置在螺旋中。我不太担心螺旋臂形成的细节,因为这是一种表征模型,而不是数学模型。但是,我尽力使旋臂的数量差不多是正确的,然后向“正确方向”旋转。
在后期版本的银河系模型中,我不再强调使用粒子,而是使用星系的平面图像来陪伴粒子,希望能让它更具摄影感。实际图像是距离我们大约 7000 万光年的螺旋星系 NGC 1232,我们处理了图像,使其看起来像银河。
![算出星系的规模。](https://web.dev/static/examples/images/image/T4FyVKpzu4WKF1kBNvXepbi08t52/dQZVXko0eZdufru9zpqr.png?hl=zh-cn)
![翻转](https://web.dev/static/examples/images/image/T4FyVKpzu4WKF1kBNvXepbi08t52/73JKSfkcxMnLw661RnKA.png?hl=zh-cn)
取景
在游戏的跟踪工具中找到正确的行后,下一步是找到主循环。主循环看起来像跟踪数据中的重复模式。您可以使用 W、A、S、D 键浏览跟踪数据:A 键和 D 键可左右(时间来回)移动,使用 W 和 S 键可放大和缩小数据。如果您的游戏以 60Hz 的频率运行,主循环会是一种每 16 毫秒重复一次的模式。
![似乎是三个执行帧](https://web.dev/static/examples/images/image/T4FyVKpzu4WKF1kBNvXepbi08t52/OaqgG1IveqQcmrvLbeHs.png?hl=zh-cn)
找到游戏的检测信号后,您就可以深入了解代码在每一帧的工作情况。使用 W、A、S、D 键放大屏幕,直到您能够看清函数框中的文字。
![深入了解执行帧](https://web.dev/static/examples/images/image/T4FyVKpzu4WKF1kBNvXepbi08t52/LZZ7mv7XoGiC01rIOaWh.png?hl=zh-cn)
使用翻译在视图之间移动
![在两个视图之间转换。](https://web.dev/static/examples/images/image/T4FyVKpzu4WKF1kBNvXepbi08t52/ZbdixE36RlDboM08jwGH.gif?hl=zh-cn)
为方便起见,我们假定有两个视图:一个列表视图和一个详情视图。当用户点按列表视图中的列表项时,详情视图滑入,而列表视图滑出。
为了实现这种效果,您需要一个容纳这两个视图的容器,并为容器设置 overflow: hidden
。这样,这两个视图可以并排显示在容器内,而不会显示任何水平滚动条,并且每个视图都可以根据需要在容器内左右滑动。