OSU

The OSU demo is inspired by the popular rhythm game OSU

In this demo the note positions are defined on each RhythmClip within the timeline. It even supports spline hold notes by taking advantage of the U2D package Sprite Shape Renderer and Sprite Shape Controller.

This demo showcases how you can expand Rhythm Timeline to achieve any kind of result you want taking advantage of RhythmClip Parameters, custom Notes scripts and custom input.

OSU Rhythm Input Manager

This component allows you to define input by raycasting from the mouse position to colliders directly on each note, instead of relying on one input per track.

OSU Tap Note

This component is used for simple OSU tap notes. The Circle Timing Outline scales down as you reach closer to the “perfect” timing to click

In osu notes can often overlay. New notes should always render below old ones. To ensure this works properly with sprites we use the “Sort Canvas” and “Sort Order Sprite Renderers” lists to define the order in which the visuals need to render. When spawned each canvas and sprite renderer is given a descending sort order from the notes order in the timeline. The first renderer of the first note will have the max sort order value (int16.Max). We have limited the number of renderers in the lists (combined) to 15 to simplify the dynamic sort order logic.

One special feature of OSU Notes is that it uses the Vector2 parameter of the RhythmClipParmeters to specify it’s position in the world

As you select the clip in the timeline you will notice a handle in the scene view that you can use to place the note very intutively.

We also automatically set the Color from the track primary color and text (Number) from consecutive clips on that track.

OSU spline Note

The Spline note allow you to use the Sprite Shape Renderer and Sprite Shape Controller to draw splined hold notes. I recommend checking the documentation on the Sprite Shape Renderer and Controller to learn more: https://docs.unity3d.com/Packages/com.unity.2d.spriteshape@10.0/manual/SSController.html

Just like the OSU tap notes you can place the note position using the scene view handle.

And of course you can edit the shape of the note while previewing the timeline. Here are the recommened steps to do so.

First Lock the timeline window. This ensures the timeline stays selected and continues to preview even if you select gameobjects other than the Playable Director

Ensure your play head is on your clip and the clip is selected. You should see your note gameobject in the scene.

For convinience there is a “Select Note” button on the Clip inspector. This is particuarly useful if you have a lot of notes in the scene and you don’t know which one is linked to the clip.

Pressing that button will select the note in the scene that is linked to the clip.

Then click on the “edit spline” button of the SplineShapeController to enable the spline editor tool

You can now edit your shape to your liking. And the SpriteShapeControl tools should appear in the scene view

If you go back to your clip you’ll notice that the spline data was automatically saved on the clip using a custom “RhythmClipExtraNoteData”

Similarly to the osu spline hold notes, you can also set whether the spline hold note is “pingpong” meaning it goes in reverse after reaching the end.

SpriteShapeControllerSynchronizer

SpriteShapeController has a limitation of one SpriteShapeRenderer

If you are interested in making your own shapes with a combination of multiple sprite shapes renderers. You will be interested in the “SpriteShapeControllerSynchronizer” component

This component will use one main SpriteShapeController to control the other ones in the list. Conviniently you can also automatically set the height of the curve at each point. allowing you to easily create an outline or inline style look.