1
0
mirror of https://github.com/ppy/osu.git synced 2024-11-11 13:37:25 +08:00

Adjust visuals of tick display (and fine tune some other timeline elements)

This commit is contained in:
Dean Herbert 2024-08-20 22:24:48 +09:00
parent 1a48a6f654
commit 7e6490133d
No known key found for this signature in database
6 changed files with 42 additions and 46 deletions

View File

@ -145,18 +145,18 @@ namespace osu.Game.Screens.Edit
{
case 1:
case 2:
return new Vector2(0.6f, 0.9f);
return new Vector2(1, 0.9f);
case 3:
case 4:
return new Vector2(0.5f, 0.8f);
return new Vector2(0.8f, 0.8f);
case 6:
case 8:
return new Vector2(0.4f, 0.7f);
return new Vector2(0.8f, 0.7f);
default:
return new Vector2(0.3f, 0.6f);
return new Vector2(0.8f, 0.6f);
}
}

View File

@ -526,7 +526,7 @@ namespace osu.Game.Screens.Edit.Compose.Components
AlwaysDisplayed = alwaysDisplayed;
Divisor = divisor;
Size = new Vector2(6f, 18) * BindableBeatDivisor.GetSize(divisor);
Size = new Vector2(4, 18) * BindableBeatDivisor.GetSize(divisor);
Alpha = alwaysDisplayed ? 1 : 0;
InternalChild = new Box { RelativeSizeAxes = Axes.Both };

View File

@ -2,9 +2,7 @@
// See the LICENCE file in the repository root for full licence text.
using osu.Framework.Allocation;
using osu.Framework.Extensions.Color4Extensions;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Colour;
using osu.Framework.Graphics.Containers;
using osu.Framework.Graphics.Shapes;
using osu.Game.Overlays;
@ -29,14 +27,13 @@ namespace osu.Game.Screens.Edit.Compose.Components.Timeline
InternalChildren = new Drawable[]
{
new Box
new Circle
{
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
RelativeSizeAxes = Axes.Y,
Width = bar_width,
Blending = BlendingParameters.Additive,
Colour = ColourInfo.GradientVertical(colours.Colour2.Opacity(0.6f), colours.Colour2.Opacity(0)),
Colour = colours.Colour2,
},
new Triangle
{

View File

@ -14,7 +14,9 @@ using osu.Framework.Input.Events;
using osu.Game.Beatmaps;
using osu.Game.Configuration;
using osu.Game.Graphics;
using osu.Game.Overlays;
using osu.Game.Rulesets.Edit;
using osu.Game.Screens.Edit.Components.Timelines.Summary.Visualisations;
using osuTK;
using osuTK.Input;
@ -24,7 +26,7 @@ namespace osu.Game.Screens.Edit.Compose.Components.Timeline
public partial class Timeline : ZoomableScrollContainer, IPositionSnapProvider
{
private const float timeline_height = 80;
private const float timeline_expanded_height = 94;
private const float timeline_expanded_height = 80;
private readonly Drawable userContent;
@ -103,32 +105,28 @@ namespace osu.Game.Screens.Edit.Compose.Components.Timeline
}
[BackgroundDependencyLoader]
private void load(IBindable<WorkingBeatmap> beatmap, OsuColour colours, OsuConfigManager config)
private void load(IBindable<WorkingBeatmap> beatmap, OsuColour colours, OverlayColourProvider colourProvider, OsuConfigManager config)
{
CentreMarker centreMarker;
// We don't want the centre marker to scroll
AddInternal(centreMarker = new CentreMarker());
ticks = new TimelineTickDisplay
{
Padding = new MarginPadding { Vertical = 2, },
};
ticks = new TimelineTickDisplay();
AddRange(new Drawable[]
{
ticks = new TimelineTickDisplay(),
ticks,
controlPoints = new TimelineTimingChangeDisplay
{
RelativeSizeAxes = Axes.X,
Height = timeline_expanded_height - timeline_height,
RelativeSizeAxes = Axes.Both,
Anchor = Anchor.CentreLeft,
Origin = Anchor.CentreLeft,
},
ticks,
mainContent = new Container
{
RelativeSizeAxes = Axes.X,
Height = timeline_height,
Depth = float.MaxValue,
Children = new[]
{
waveform = new WaveformGraph
@ -139,19 +137,19 @@ namespace osu.Game.Screens.Edit.Compose.Components.Timeline
MidColour = colours.BlueDark,
HighColour = colours.BlueDarker,
},
ticks.CreateProxy(),
centreMarker.CreateProxy(),
new Box
{
Name = "zero marker",
RelativeSizeAxes = Axes.Y,
Width = 2,
Origin = Anchor.TopCentre,
Colour = colours.YellowDarker,
},
ticks.CreateProxy(),
userContent,
}
},
new Box
{
Name = "zero marker",
RelativeSizeAxes = Axes.Y,
Width = TimelineTickDisplay.TICK_WIDTH / 2,
Origin = Anchor.TopCentre,
Colour = colourProvider.Background1,
},
});
waveformOpacity = config.GetBindable<float>(OsuSetting.EditorWaveformOpacity);
@ -195,7 +193,7 @@ namespace osu.Game.Screens.Edit.Compose.Components.Timeline
if (visible.NewValue || alwaysShowControlPoints)
{
this.ResizeHeightTo(timeline_expanded_height, 200, Easing.OutQuint);
mainContent.MoveToY(15, 200, Easing.OutQuint);
mainContent.MoveToY(0, 200, Easing.OutQuint);
// delay the fade in else masking looks weird.
controlPoints.Delay(180).FadeIn(400, Easing.OutQuint);

View File

@ -17,6 +17,8 @@ namespace osu.Game.Screens.Edit.Compose.Components.Timeline
{
public partial class TimelineTickDisplay : TimelinePart<PointVisualisation>
{
public const float TICK_WIDTH = 3;
// With current implementation every tick in the sub-tree should be visible, no need to check whether they are masked away.
public override bool UpdateSubTreeMasking() => false;
@ -138,20 +140,15 @@ namespace osu.Game.Screens.Edit.Compose.Components.Timeline
// even though "bar lines" take up the full vertical space, we render them in two pieces because it allows for less anchor/origin churn.
Vector2 size = Vector2.One;
if (indexInBar != 0)
size = BindableBeatDivisor.GetSize(divisor);
var size = indexInBar == 0
? new Vector2(1.3f, 1)
: BindableBeatDivisor.GetSize(divisor);
var line = getNextUsableLine();
line.X = xPos;
line.Anchor = Anchor.CentreLeft;
line.Origin = Anchor.Centre;
line.Height = 0.6f + size.Y * 0.4f;
line.Width = PointVisualisation.MAX_WIDTH * (0.6f + 0.4f * size.X);
line.Width = TICK_WIDTH * size.X;
line.Height = size.Y;
line.Colour = colour;
}
@ -174,8 +171,15 @@ namespace osu.Game.Screens.Edit.Compose.Components.Timeline
Drawable getNextUsableLine()
{
PointVisualisation point;
if (drawableIndex >= Count)
Add(point = new PointVisualisation(0));
{
Add(point = new PointVisualisation(0)
{
Anchor = Anchor.CentreLeft,
Origin = Anchor.Centre,
});
}
else
point = Children[drawableIndex];

View File

@ -12,7 +12,6 @@ using osu.Game.Beatmaps.ControlPoints;
using osu.Game.Graphics;
using osu.Game.Graphics.Sprites;
using osu.Game.Screens.Edit.Components.Timelines.Summary.Parts;
using osu.Game.Screens.Edit.Components.Timelines.Summary.Visualisations;
using osuTK.Graphics;
namespace osu.Game.Screens.Edit.Compose.Components.Timeline
@ -122,8 +121,6 @@ namespace osu.Game.Screens.Edit.Compose.Components.Timeline
[BackgroundDependencyLoader]
private void load(OsuColour colours)
{
const float corner_radius = PointVisualisation.MAX_WIDTH / 2;
InternalChildren = new Drawable[]
{
new Container
@ -131,7 +128,7 @@ namespace osu.Game.Screens.Edit.Compose.Components.Timeline
RelativeSizeAxes = Axes.Both,
Colour = Point.GetRepresentingColour(colours),
Masking = true,
CornerRadius = corner_radius,
CornerRadius = TimelineTickDisplay.TICK_WIDTH / 2,
Child = new Box
{
Colour = Color4.White,