1
0
mirror of https://github.com/ppy/osu.git synced 2024-12-14 10:52:53 +08:00

Merge pull request #7541 from EVAST9919/overlay-header-web-colours

Implement colour schemes for OverlayHeader
This commit is contained in:
Dean Herbert 2020-01-20 14:13:09 +09:00 committed by GitHub
commit fab8f4661a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 96 additions and 56 deletions

View File

@ -3,6 +3,7 @@
using System;
using osu.Game.Beatmaps;
using osuTK;
using osuTK.Graphics;
namespace osu.Game.Graphics
@ -63,6 +64,46 @@ namespace osu.Game.Graphics
}
}
public Color4 ForOverlayElement(OverlayColourScheme colourScheme, float saturation, float lightness, float opacity = 1) => Color4.FromHsl(new Vector4(getBaseHue(colourScheme), saturation, lightness, opacity));
// See https://github.com/ppy/osu-web/blob/4218c288292d7c810b619075471eaea8bbb8f9d8/app/helpers.php#L1463
private static float getBaseHue(OverlayColourScheme colourScheme)
{
float hue;
switch (colourScheme)
{
default:
throw new ArgumentException($@"{colourScheme} colour scheme does not provide a hue value in {nameof(getBaseHue)}.");
case OverlayColourScheme.Red:
hue = 0;
break;
case OverlayColourScheme.Pink:
hue = 333;
break;
case OverlayColourScheme.Orange:
hue = 46;
break;
case OverlayColourScheme.Green:
hue = 115;
break;
case OverlayColourScheme.Purple:
hue = 255;
break;
case OverlayColourScheme.Blue:
hue = 200;
break;
}
return hue / 360f;
}
// See https://github.com/ppy/osu-web/blob/master/resources/assets/less/colors.less
public readonly Color4 PurpleLighter = FromHex(@"eeeeff");
public readonly Color4 PurpleLight = FromHex(@"aa88ff");
@ -165,4 +206,14 @@ namespace osu.Game.Graphics
public readonly Color4 ContextMenuGray = FromHex(@"223034");
}
public enum OverlayColourScheme
{
Red,
Pink,
Orange,
Green,
Purple,
Blue
}
}

View File

@ -1,8 +1,10 @@
// Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the MIT Licence.
// See the LICENCE file in the repository root for full licence text.
using osu.Framework.Allocation;
using osu.Framework.Graphics;
using osu.Framework.Graphics.UserInterface;
using osu.Game.Graphics;
using osu.Game.Graphics.UserInterface;
namespace osu.Game.Overlays
@ -13,6 +15,17 @@ namespace osu.Game.Overlays
protected override TabControl<string> CreateTabControl() => BreadcrumbControl = new OverlayHeaderBreadcrumbControl();
protected BreadcrumbControlOverlayHeader(OverlayColourScheme colourScheme)
: base(colourScheme)
{
}
[BackgroundDependencyLoader]
private void load(OsuColour colours)
{
BreadcrumbControl.AccentColour = colours.ForOverlayElement(ColourScheme, 1, 0.75f);
}
public class OverlayHeaderBreadcrumbControl : BreadcrumbControl<string>
{
public OverlayHeaderBreadcrumbControl()

View File

@ -26,6 +26,7 @@ namespace osu.Game.Overlays.Changelog
private const string listing_string = "listing";
public ChangelogHeader()
: base(OverlayColourScheme.Purple)
{
BreadcrumbControl.AddItem(listing_string);
BreadcrumbControl.Current.ValueChanged += e =>
@ -43,14 +44,6 @@ namespace osu.Game.Overlays.Changelog
};
}
[BackgroundDependencyLoader]
private void load(OsuColour colours)
{
BreadcrumbControl.AccentColour = colours.Violet;
TitleBackgroundColour = colours.GreyVioletDarker;
ControlBackgroundColour = colours.GreyVioletDark;
}
private ChangelogHeaderTitle title;
private void showBuild(ValueChangedEvent<APIChangelogBuild> e)
@ -117,12 +110,6 @@ namespace osu.Game.Overlays.Changelog
Version = null;
}
[BackgroundDependencyLoader]
private void load(OsuColour colours)
{
AccentColour = colours.Violet;
}
protected override Drawable CreateIcon() => new ScreenTitleTextureIcon(@"Icons/changelog");
}
}

View File

@ -23,6 +23,7 @@ namespace osu.Game.Overlays.News
public Action ShowFrontPage;
public NewsHeader()
: base(OverlayColourScheme.Purple)
{
BreadcrumbControl.AddItem(front_page_string);
@ -35,14 +36,6 @@ namespace osu.Game.Overlays.News
Current.ValueChanged += showPost;
}
[BackgroundDependencyLoader]
private void load(OsuColour colours)
{
BreadcrumbControl.AccentColour = colours.Violet;
TitleBackgroundColour = colours.GreyVioletDarker;
ControlBackgroundColour = colours.GreyVioletDark;
}
private void showPost(ValueChangedEvent<string> e)
{
if (e.OldValue != null)
@ -97,12 +90,6 @@ namespace osu.Game.Overlays.News
}
protected override Drawable CreateIcon() => new ScreenTitleTextureIcon(@"Icons/news");
[BackgroundDependencyLoader]
private void load(OsuColour colours)
{
AccentColour = colours.Violet;
}
}
}
}

View File

@ -2,10 +2,12 @@
// See the LICENCE file in the repository root for full licence text.
using JetBrains.Annotations;
using osu.Framework.Allocation;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers;
using osu.Framework.Graphics.Shapes;
using osu.Framework.Graphics.UserInterface;
using osu.Game.Graphics;
using osu.Game.Graphics.UserInterface;
using osuTK.Graphics;
@ -16,24 +18,19 @@ namespace osu.Game.Overlays
private readonly Box titleBackground;
private readonly Box controlBackground;
private readonly Container background;
protected Color4 TitleBackgroundColour
{
set => titleBackground.Colour = value;
}
protected Color4 ControlBackgroundColour
{
set => controlBackground.Colour = value;
}
private readonly ScreenTitle title;
protected float BackgroundHeight
{
set => background.Height = value;
}
protected OverlayHeader()
protected OverlayColourScheme ColourScheme { get; }
protected OverlayHeader(OverlayColourScheme colourScheme)
{
ColourScheme = colourScheme;
RelativeSizeAxes = Axes.X;
AutoSizeAxes = Axes.Y;
@ -60,9 +57,8 @@ namespace osu.Game.Overlays
titleBackground = new Box
{
RelativeSizeAxes = Axes.Both,
Colour = Color4.Gray,
},
CreateTitle().With(title =>
title = CreateTitle().With(title =>
{
title.Margin = new MarginPadding
{
@ -92,6 +88,14 @@ namespace osu.Game.Overlays
});
}
[BackgroundDependencyLoader]
private void load(OsuColour colours)
{
titleBackground.Colour = colours.ForOverlayElement(ColourScheme, 0.2f, 0.15f);
title.AccentColour = colours.ForOverlayElement(ColourScheme, 1, 0.7f);
controlBackground.Colour = colours.ForOverlayElement(ColourScheme, 0.2f, 0.2f);
}
protected abstract Drawable CreateBackground();
[NotNull]

View File

@ -1,7 +1,6 @@
// Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the MIT Licence.
// See the LICENCE file in the repository root for full licence text.
using osu.Framework.Allocation;
using osu.Framework.Bindables;
using osu.Framework.Extensions.Color4Extensions;
using osu.Framework.Graphics;
@ -25,6 +24,7 @@ namespace osu.Game.Overlays.Profile
private DetailHeaderContainer detailHeaderContainer;
public ProfileHeader()
: base(OverlayColourScheme.Green)
{
BackgroundHeight = 150;
@ -36,14 +36,6 @@ namespace osu.Game.Overlays.Profile
centreHeaderContainer.DetailsVisible.BindValueChanged(visible => detailHeaderContainer.Expanded = visible.NewValue, true);
}
[BackgroundDependencyLoader]
private void load(OsuColour colours)
{
TabControl.AccentColour = colours.Seafoam;
TitleBackgroundColour = colours.GreySeafoamDarker;
ControlBackgroundColour = colours.GreySeafoam;
}
protected override Drawable CreateBackground() =>
new Container
{
@ -109,12 +101,6 @@ namespace osu.Game.Overlays.Profile
Section = "info";
}
[BackgroundDependencyLoader]
private void load(OsuColour colours)
{
AccentColour = colours.Seafoam;
}
protected override Drawable CreateIcon() => new ScreenTitleTextureIcon(@"Icons/profile");
}
}

View File

@ -1,6 +1,7 @@
// Copyright (c) ppy Pty Ltd <contact@ppy.sh>. Licensed under the MIT Licence.
// See the LICENCE file in the repository root for full licence text.
using osu.Framework.Allocation;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers;
using osu.Framework.Graphics.UserInterface;
@ -15,6 +16,17 @@ namespace osu.Game.Overlays
protected override TabControl<string> CreateTabControl() => TabControl = new OverlayHeaderTabControl();
protected TabControlOverlayHeader(OverlayColourScheme colourScheme)
: base(colourScheme)
{
}
[BackgroundDependencyLoader]
private void load(OsuColour colours)
{
TabControl.AccentColour = colours.ForOverlayElement(ColourScheme, 1, 0.75f);
}
public class OverlayHeaderTabControl : OverlayTabControl<string>
{
public OverlayHeaderTabControl()