1
0
mirror of https://github.com/ppy/osu.git synced 2024-12-15 16:25:32 +08:00

Merge pull request #302 from peppy/login-updates

Move login screen to toolbar and update design (still not fully implemented).
This commit is contained in:
Dean Herbert 2017-02-03 13:10:05 +09:00 committed by GitHub
commit 1f8df447c7
10 changed files with 340 additions and 169 deletions

View File

@ -21,6 +21,7 @@ using osu.Game.Modes;
using osu.Game.Overlays.Toolbar;
using osu.Game.Screens;
using osu.Game.Screens.Menu;
using OpenTK;
namespace osu.Game
{
@ -101,14 +102,20 @@ namespace osu.Game
//overlay elements
(chat = new ChatOverlay { Depth = 0 }).Preload(this, overlayContent.Add);
(options = new OptionsOverlay { Depth = -1 }).Preload(this, overlayContent.Add);
(musicController = new MusicController() { Depth = -3 }).Preload(this, overlayContent.Add);
(musicController = new MusicController()
{
Depth = -2,
Position = new Vector2(0, Toolbar.HEIGHT),
Anchor = Anchor.TopRight,
Origin = Anchor.TopRight,
}).Preload(this, overlayContent.Add);
Dependencies.Cache(options);
Dependencies.Cache(musicController);
(Toolbar = new Toolbar
{
Depth = -2,
Depth = -3,
OnHome = delegate { mainMenu?.MakeCurrent(); },
OnPlayModeChange = delegate (PlayMode m) { PlayMode.Value = m; },
}).Preload(this, t =>

View File

@ -0,0 +1,77 @@
//Copyright (c) 2007-2016 ppy Pty Ltd <contact@ppy.sh>.
//Licensed under the MIT Licence - https://raw.githubusercontent.com/ppy/osu/master/LICENCE
using osu.Framework.Allocation;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers;
using osu.Framework.Graphics.Primitives;
using osu.Framework.Graphics.Sprites;
using osu.Framework.Graphics.Transformations;
using osu.Game.Graphics;
using osu.Game.Overlays.Options.General;
using OpenTK;
using OpenTK.Graphics;
namespace osu.Game.Overlays
{
class LoginOverlay : OverlayContainer
{
private LoginOptions optionsSection;
const float transition_time = 400;
public LoginOverlay()
{
AutoSizeAxes = Axes.Both;
}
[BackgroundDependencyLoader]
private void load(OsuColour colours)
{
Children = new Drawable[]
{
new Box {
RelativeSizeAxes = Axes.Both,
Colour = Color4.Black,
Alpha = 0.8f,
},
new Container
{
Width = 360,
AutoSizeAxes = Axes.Y,
Masking = true,
AutoSizeDuration = transition_time,
AutoSizeEasing = EasingTypes.OutQuint,
Children = new Drawable[]
{
optionsSection = new LoginOptions
{
Padding = new MarginPadding(10),
},
new Box
{
RelativeSizeAxes = Axes.X,
Anchor = Anchor.BottomLeft,
Origin = Anchor.BottomLeft,
Height = 3,
Colour = colours.Yellow,
Alpha = 1,
},
}
}
};
}
protected override void PopIn()
{
optionsSection.Bounding = true;
FadeIn(transition_time, EasingTypes.OutQuint);
}
protected override void PopOut()
{
optionsSection.Bounding = false;
FadeOut(transition_time);
}
}
}

View File

@ -28,8 +28,6 @@ namespace osu.Game.Overlays
{
public class MusicController : OverlayContainer
{
private static readonly Vector2 start_position = new Vector2(0, 50);
private MusicControllerBackground backgroundSprite;
private DragBar progress;
private TextAwesome playButton, listButton;
@ -47,22 +45,13 @@ namespace osu.Game.Overlays
private BeatmapDatabase beatmaps;
private BaseGame game;
private Container dragContainer;
public MusicController()
{
Width = 400;
Height = 130;
CornerRadius = 5;
EdgeEffect = new EdgeEffect
{
Type = EdgeEffectType.Shadow,
Colour = Color4.Black.Opacity(40),
Radius = 5,
};
Masking = true;
Anchor = Anchor.TopRight;//placeholder
Origin = Anchor.TopRight;
Position = start_position;
Margin = new MarginPadding(10);
}
@ -75,13 +64,13 @@ namespace osu.Game.Overlays
// Diminish the drag distance as we go further to simulate "rubber band" feeling.
change *= (float)Math.Pow(change.Length, 0.7f) / change.Length;
MoveTo(start_position + change);
dragContainer.MoveTo(change);
return base.OnDrag(state);
}
protected override bool OnDragEnd(InputState state)
{
MoveTo(start_position, 800, EasingTypes.OutElastic);
dragContainer.MoveTo(Vector2.Zero, 800, EasingTypes.OutElastic);
return base.OnDragEnd(state);
}
@ -93,111 +82,126 @@ namespace osu.Game.Overlays
Children = new Drawable[]
{
title = new SpriteText
dragContainer = new Container
{
Origin = Anchor.BottomCentre,
Anchor = Anchor.TopCentre,
Position = new Vector2(0, 40),
TextSize = 25,
Colour = Color4.White,
Text = @"Nothing to play",
Font = @"Exo2.0-MediumItalic"
},
artist = new SpriteText
{
Origin = Anchor.TopCentre,
Anchor = Anchor.TopCentre,
Position = new Vector2(0, 45),
TextSize = 15,
Colour = Color4.White,
Text = @"Nothing to play",
Font = @"Exo2.0-BoldItalic"
},
new ClickableContainer
{
AutoSizeAxes = Axes.Both,
Origin = Anchor.Centre,
Anchor = Anchor.BottomCentre,
Position = new Vector2(0, -30),
Action = () =>
Masking = true,
CornerRadius = 5,
EdgeEffect = new EdgeEffect
{
if (current?.Track == null) return;
if (current.Track.IsRunning)
current.Track.Stop();
else
current.Track.Start();
Type = EdgeEffectType.Shadow,
Colour = Color4.Black.Opacity(40),
Radius = 5,
},
RelativeSizeAxes = Axes.Both,
Children = new Drawable[]
{
playButton = new TextAwesome
title = new SpriteText
{
TextSize = 30,
Icon = FontAwesome.fa_play_circle_o,
Origin = Anchor.Centre,
Anchor = Anchor.Centre
}
}
},
new ClickableContainer
{
AutoSizeAxes = Axes.Both,
Origin = Anchor.Centre,
Anchor = Anchor.BottomCentre,
Position = new Vector2(-30, -30),
Action = prev,
Children = new Drawable[]
{
new TextAwesome
Origin = Anchor.BottomCentre,
Anchor = Anchor.TopCentre,
Position = new Vector2(0, 40),
TextSize = 25,
Colour = Color4.White,
Text = @"Nothing to play",
Font = @"Exo2.0-MediumItalic"
},
artist = new SpriteText
{
Origin = Anchor.TopCentre,
Anchor = Anchor.TopCentre,
Position = new Vector2(0, 45),
TextSize = 15,
Icon = FontAwesome.fa_step_backward,
Origin = Anchor.Centre,
Anchor = Anchor.Centre
}
}
},
new ClickableContainer
{
AutoSizeAxes = Axes.Both,
Origin = Anchor.Centre,
Anchor = Anchor.BottomCentre,
Position = new Vector2(30, -30),
Action = next,
Children = new Drawable[]
{
new TextAwesome
Colour = Color4.White,
Text = @"Nothing to play",
Font = @"Exo2.0-BoldItalic"
},
new ClickableContainer
{
TextSize = 15,
Icon = FontAwesome.fa_step_forward,
AutoSizeAxes = Axes.Both,
Origin = Anchor.Centre,
Anchor = Anchor.Centre
}
}
},
new ClickableContainer
{
AutoSizeAxes = Axes.Both,
Origin = Anchor.Centre,
Anchor = Anchor.BottomRight,
Position = new Vector2(20, -30),
Children = new Drawable[]
{
listButton = new TextAwesome
Anchor = Anchor.BottomCentre,
Position = new Vector2(0, -30),
Action = () =>
{
if (current?.Track == null) return;
if (current.Track.IsRunning)
current.Track.Stop();
else
current.Track.Start();
},
Children = new Drawable[]
{
playButton = new TextAwesome
{
TextSize = 30,
Icon = FontAwesome.fa_play_circle_o,
Origin = Anchor.Centre,
Anchor = Anchor.Centre
}
}
},
new ClickableContainer
{
TextSize = 15,
Icon = FontAwesome.fa_bars,
AutoSizeAxes = Axes.Both,
Origin = Anchor.Centre,
Anchor = Anchor.Centre
Anchor = Anchor.BottomCentre,
Position = new Vector2(-30, -30),
Action = prev,
Children = new Drawable[]
{
new TextAwesome
{
TextSize = 15,
Icon = FontAwesome.fa_step_backward,
Origin = Anchor.Centre,
Anchor = Anchor.Centre
}
}
},
new ClickableContainer
{
AutoSizeAxes = Axes.Both,
Origin = Anchor.Centre,
Anchor = Anchor.BottomCentre,
Position = new Vector2(30, -30),
Action = next,
Children = new Drawable[]
{
new TextAwesome
{
TextSize = 15,
Icon = FontAwesome.fa_step_forward,
Origin = Anchor.Centre,
Anchor = Anchor.Centre
}
}
},
new ClickableContainer
{
AutoSizeAxes = Axes.Both,
Origin = Anchor.Centre,
Anchor = Anchor.BottomRight,
Position = new Vector2(20, -30),
Children = new Drawable[]
{
listButton = new TextAwesome
{
TextSize = 15,
Icon = FontAwesome.fa_bars,
Origin = Anchor.Centre,
Anchor = Anchor.Centre
}
}
},
progress = new DragBar
{
Origin = Anchor.BottomCentre,
Anchor = Anchor.BottomCentre,
Height = 10,
Colour = colours.Yellow,
SeekRequested = seek
}
}
},
progress = new DragBar
{
Origin = Anchor.BottomCentre,
Anchor = Anchor.BottomCentre,
Height = 10,
Colour = colours.Yellow,
SeekRequested = seek
}
};
@ -210,7 +214,7 @@ namespace osu.Game.Overlays
playList = beatmaps.GetAllWithChildren<BeatmapSetInfo>();
backgroundSprite = new MusicControllerBackground();
AddInternal(backgroundSprite);
dragContainer.Add(backgroundSprite);
}
protected override void LoadComplete()
@ -333,7 +337,7 @@ namespace osu.Game.Overlays
(newBackground = new MusicControllerBackground(beatmap)).Preload(game, delegate
{
Add(newBackground);
dragContainer.Add(newBackground);
switch (direction)
{

View File

@ -15,7 +15,6 @@ namespace osu.Game.Overlays.Options.General
{
Children = new Drawable[]
{
new LoginOptions(),
new LanguageOptions(),
new UpdateOptions(),
};

View File

@ -12,13 +12,28 @@ using osu.Framework.Graphics.UserInterface;
using osu.Game.Graphics.UserInterface;
using osu.Game.Online.API;
using osu.Game.Configuration;
using osu.Framework.Graphics.Primitives;
namespace osu.Game.Overlays.Options.General
{
public class LoginOptions : OptionsSubsection, IOnlineComponent
{
private bool bounding = true;
protected override string Header => "Sign In";
public override RectangleF BoundingBox => bounding ? base.BoundingBox : RectangleF.Empty;
public bool Bounding
{
get { return bounding; }
set
{
bounding = value;
Invalidate(Invalidation.Geometry);
}
}
[BackgroundDependencyLoader(permitNulls: true)]
private void load(APIAccess api)
{
@ -109,24 +124,24 @@ namespace osu.Game.Overlays.Options.General
},
saveUsername = new CheckBoxOption
{
LabelText = "Remember Username",
LabelText = "Remember username",
Bindable = config.GetBindable<bool>(OsuConfig.SaveUsername),
},
savePassword = new CheckBoxOption
{
LabelText = "Remember Password",
LabelText = "Stay logged in",
Bindable = config.GetBindable<bool>(OsuConfig.SavePassword),
},
new OsuButton
{
RelativeSizeAxes = Axes.X,
Text = "Log in",
Text = "Sign in",
Action = performLogin
},
new OsuButton
{
RelativeSizeAxes = Axes.X,
Text = "Register",
Text = "Register new account",
//Action = registerLink
}
};

View File

@ -19,65 +19,25 @@ namespace osu.Game.Overlays.Toolbar
{
public class Toolbar : OverlayContainer
{
private const float height = 50;
public const float HEIGHT = 50;
public Action OnHome;
public Action<PlayMode> OnPlayModeChange;
private ToolbarModeSelector modeSelector;
private Box solidBackground;
private Box gradientBackground;
private const int transition_time = 250;
private const float alpha_hovering = 0.8f;
private const float alpha_normal = 0.6f;
protected override void PopIn()
{
MoveToY(0, transition_time, EasingTypes.OutQuint);
FadeIn(transition_time, EasingTypes.OutQuint);
}
protected override void PopOut()
{
MoveToY(-DrawSize.Y, transition_time, EasingTypes.InQuint);
FadeOut(transition_time, EasingTypes.InQuint);
}
protected override bool OnHover(InputState state)
{
solidBackground.FadeTo(alpha_hovering, transition_time, EasingTypes.OutQuint);
gradientBackground.FadeIn(transition_time, EasingTypes.OutQuint);
return true;
}
protected override void OnHoverLost(InputState state)
{
solidBackground.FadeTo(alpha_normal, transition_time, EasingTypes.OutQuint);
gradientBackground.FadeOut(transition_time, EasingTypes.OutQuint);
}
public override bool Contains(Vector2 screenSpacePos) => true;
public Toolbar()
{
Children = new Drawable[]
{
solidBackground = new Box
{
RelativeSizeAxes = Axes.Both,
Colour = OsuColour.Gray(0.1f),
Alpha = alpha_normal,
},
gradientBackground = new Box
{
RelativeSizeAxes = Axes.X,
Anchor = Anchor.BottomLeft,
Alpha = 0,
Height = 90,
ColourInfo = ColourInfo.GradientVertical(
OsuColour.Gray(0.1f).Opacity(0.5f), OsuColour.Gray(0.1f).Opacity(0)),
},
new ToolbarBackground(),
new FlowContainer
{
Direction = FlowDirection.HorizontalOnly,
@ -96,21 +56,21 @@ namespace osu.Game.Overlays.Toolbar
}
}
},
new FlowContainer
new PassThroughFlowContainer
{
Anchor = Anchor.TopRight,
Origin = Anchor.TopRight,
Direction = FlowDirection.HorizontalOnly,
RelativeSizeAxes = Axes.Y,
AutoSizeAxes = Axes.X,
Children = new []
Children = new Drawable[]
{
new ToolbarMusicButton(),
new ToolbarButton
{
Icon = FontAwesome.fa_search
},
new ToolbarUserButton(),
new ToolbarUserArea(),
new ToolbarButton
{
Icon = FontAwesome.fa_bars
@ -120,9 +80,69 @@ namespace osu.Game.Overlays.Toolbar
};
RelativeSizeAxes = Axes.X;
Size = new Vector2(1, height);
Size = new Vector2(1, HEIGHT);
}
public class ToolbarBackground : Container
{
private Box solidBackground;
private Box gradientBackground;
public ToolbarBackground()
{
RelativeSizeAxes = Axes.Both;
Children = new Drawable[]
{
solidBackground = new Box
{
RelativeSizeAxes = Axes.Both,
Colour = OsuColour.Gray(0.1f),
Alpha = alpha_normal,
},
gradientBackground = new Box
{
RelativeSizeAxes = Axes.X,
Anchor = Anchor.BottomLeft,
Alpha = 0,
Height = 90,
ColourInfo = ColourInfo.GradientVertical(
OsuColour.Gray(0.1f).Opacity(0.5f), OsuColour.Gray(0.1f).Opacity(0)),
},
};
}
protected override bool OnHover(InputState state)
{
solidBackground.FadeTo(alpha_hovering, transition_time, EasingTypes.OutQuint);
gradientBackground.FadeIn(transition_time, EasingTypes.OutQuint);
return true;
}
protected override void OnHoverLost(InputState state)
{
solidBackground.FadeTo(alpha_normal, transition_time, EasingTypes.OutQuint);
gradientBackground.FadeOut(transition_time, EasingTypes.OutQuint);
}
}
public void SetGameMode(PlayMode mode) => modeSelector.SetGameMode(mode);
protected override void PopIn()
{
MoveToY(0, transition_time, EasingTypes.OutQuint);
FadeIn(transition_time, EasingTypes.OutQuint);
}
protected override void PopOut()
{
MoveToY(-DrawSize.Y, transition_time, EasingTypes.InQuint);
FadeOut(transition_time, EasingTypes.InQuint);
}
class PassThroughFlowContainer : FlowContainer
{
//needed to get input to the login overlay.
public override bool Contains(Vector2 screenSpacePos) => true;
}
}
}

View File

@ -122,6 +122,7 @@ namespace osu.Game.Overlays.Toolbar
};
RelativeSizeAxes = Axes.Y;
AutoSizeAxes = Axes.X;
}
[BackgroundDependencyLoader]
@ -168,6 +169,12 @@ namespace osu.Game.Overlays.Toolbar
{
RelativeSizeAxes = Axes.Both;
Masking = true;
EdgeEffect = new EdgeEffect
{
Type = EdgeEffectType.Shadow,
Colour = Color4.Black.Opacity(40),
Radius = 5,
};
Children = new Drawable[]
{

View File

@ -0,0 +1,46 @@
//Copyright (c) 2007-2016 ppy Pty Ltd <contact@ppy.sh>.
//Licensed under the MIT Licence - https://raw.githubusercontent.com/ppy/osu/master/LICENCE
using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers;
using osu.Framework.Graphics.Primitives;
using OpenTK;
namespace osu.Game.Overlays.Toolbar
{
class ToolbarUserArea : Container
{
private LoginOverlay loginOverlay;
private ToolbarUserButton button;
public override RectangleF BoundingBox => button.BoundingBox;
public override bool Contains(Vector2 screenSpacePos) => true;
public override Vector2 Size => button.Size;
public ToolbarUserArea()
{
RelativeSizeAxes = Axes.Y;
Children = new Drawable[] {
button = new ToolbarUserButton
{
Action = toggle,
},
loginOverlay = new LoginOverlay
{
Position = new Vector2(0, 1),
RelativePositionAxes = Axes.Y,
Anchor = Anchor.TopRight,
Origin = Anchor.TopRight,
}
};
}
private void toggle()
{
loginOverlay.ToggleVisibility();
}
}
}

View File

@ -1,18 +1,12 @@
//Copyright (c) 2007-2016 ppy Pty Ltd <contact@ppy.sh>.
//Licensed under the MIT Licence - https://raw.githubusercontent.com/ppy/osu/master/LICENCE
using System;
using System.Collections.Generic;
using System.Diagnostics;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using osu.Framework.Allocation;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers;
using osu.Framework.Graphics.Sprites;
using osu.Framework.Graphics.Textures;
using osu.Game.Configuration;
using osu.Game.Online.API;
using OpenTK;
using OpenTK.Graphics;
@ -34,7 +28,7 @@ namespace osu.Game.Overlays.Toolbar
}
[BackgroundDependencyLoader]
private void load(APIAccess api, OsuConfigManager config)
private void load(APIAccess api)
{
api.Register(this);
}

View File

@ -76,6 +76,7 @@
<Compile Include="Online\API\IOnlineComponent.cs" />
<Compile Include="Online\API\Requests\GetUserRequest.cs" />
<Compile Include="Overlays\DragBar.cs" />
<Compile Include="Overlays\LoginOverlay.cs" />
<Compile Include="Overlays\MusicController.cs" />
<Compile Include="Beatmaps\Beatmap.cs" />
<Compile Include="Beatmaps\Formats\ConstructableBeatmapDecoder.cs" />
@ -99,6 +100,7 @@
<Compile Include="Overlays\Toolbar\ToolbarMusicButton.cs" />
<Compile Include="Overlays\Toolbar\ToolbarSettingsButton.cs" />
<Compile Include="Overlays\Toolbar\ToolbarOverlayToggleButton.cs" />
<Compile Include="Overlays\Toolbar\ToolbarUserArea.cs" />
<Compile Include="Overlays\Toolbar\ToolbarUserButton.cs" />
<Compile Include="Screens\BackgroundMode.cs" />
<Compile Include="Screens\Backgrounds\BackgroundModeBeatmap.cs" />