1
0
mirror of https://github.com/ppy/osu.git synced 2025-01-14 02:22:56 +08:00

Initial implementation

This commit is contained in:
DrabWeb 2017-03-24 05:59:26 -03:00
parent f23372599d
commit 215b016f32
4 changed files with 523 additions and 119 deletions

View File

@ -123,6 +123,8 @@ namespace osu.Game.Graphics.UserInterface
set { label.Text = value; }
}
protected readonly TextAwesome Icon;
private Color4? accentColour;
public virtual Color4 AccentColour
{
@ -145,19 +147,19 @@ namespace osu.Game.Graphics.UserInterface
Foreground.Children = new Drawable[]
{
label = new OsuSpriteText
{
Anchor = Anchor.CentreLeft,
Origin = Anchor.CentreLeft,
},
new TextAwesome
{
Icon = FontAwesome.fa_chevron_down,
Anchor = Anchor.CentreRight,
Origin = Anchor.CentreRight,
Margin = new MarginPadding { Right = 4 },
TextSize = 20
}
label = new OsuSpriteText
{
Anchor = Anchor.CentreLeft,
Origin = Anchor.CentreLeft,
},
Icon = new TextAwesome
{
Icon = FontAwesome.fa_chevron_down,
Anchor = Anchor.CentreRight,
Origin = Anchor.CentreRight,
Margin = new MarginPadding { Right = 4 },
TextSize = 20
}
};
}

View File

@ -29,10 +29,15 @@ namespace osu.Game.Overlays
{
public class MusicController : FocusedOverlayContainer
{
private const float player_height = 130;
private MusicControllerBackground backgroundSprite;
private DragBar progress;
private TextAwesome playButton;
private SpriteText title, artist;
private ClickableContainer playlistButton;
private PlaylistController playlist;
private Color4 activeColour;
private Container playerContainer;
private List<BeatmapSetInfo> playList;
private readonly List<BeatmapInfo> playHistory = new List<BeatmapInfo>();
@ -51,7 +56,7 @@ namespace osu.Game.Overlays
public MusicController()
{
Width = 400;
Height = 130;
Height = player_height + 510; //510 = playlist height
Margin = new MarginPadding(10);
}
@ -82,6 +87,8 @@ namespace osu.Game.Overlays
{
game = osuGame;
activeColour = colours.Yellow;
unicodeString = config.GetUnicodeString;
Children = new Drawable[]
@ -90,125 +97,143 @@ namespace osu.Game.Overlays
{
Anchor = Anchor.Centre,
Origin = Anchor.Centre,
Masking = true,
CornerRadius = 5,
EdgeEffect = new EdgeEffect
{
Type = EdgeEffectType.Shadow,
Colour = Color4.Black.Opacity(40),
Radius = 5,
},
RelativeSizeAxes = Axes.Both,
Children = new Drawable[]
{
title = new OsuSpriteText
playlist = new PlaylistController
{
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 OsuSpriteText
{
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 = () =>
RelativeSizeAxes = Axes.Both,
Padding = new MarginPadding { Top = player_height + 10 },
OnSelect = (set) =>
{
if (current?.Track == null) return;
if (current.Track.IsRunning)
current.Track.Stop();
else
current.Track.Start();
if ((current?.BeatmapSetInfo?.ID ?? -1) != set.ID) play(set.Beatmaps[0], true);
},
},
playerContainer = new Container
{
RelativeSizeAxes = Axes.X,
Height = player_height,
Masking = true,
CornerRadius = 5,
EdgeEffect = new EdgeEffect
{
Type = EdgeEffectType.Shadow,
Colour = Color4.Black.Opacity(40),
Radius = 5,
},
Children = new Drawable[]
{
playButton = new TextAwesome
title = new OsuSpriteText
{
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 OsuSpriteText
{
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[]
{
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
}
}
},
playlistButton = new ClickableContainer
{
AutoSizeAxes = Axes.Both,
Origin = Anchor.Centre,
Anchor = Anchor.BottomRight,
Position = new Vector2(-20, -30),
Action = () => playlist.ToggleVisibility(),
Children = new Drawable[]
{
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
}
}
}
},
},
};
this.beatmaps = beatmaps;
@ -220,7 +245,9 @@ namespace osu.Game.Overlays
playList = beatmaps.GetAllWithChildren<BeatmapSetInfo>();
backgroundSprite = new MusicControllerBackground();
dragContainer.Add(backgroundSprite);
playerContainer.Add(backgroundSprite);
playlist.StateChanged += (c, s) => playlistButton.FadeColour(s == Visibility.Visible ? activeColour : Color4.White, transition_length, EasingTypes.OutQuint);
}
protected override void LoadComplete()
@ -348,6 +375,7 @@ namespace osu.Game.Overlays
BeatmapMetadata metadata = beatmap.Beatmap.BeatmapInfo.Metadata;
title.Text = unicodeString(metadata.Title, metadata.TitleUnicode);
artist.Text = unicodeString(metadata.Artist, metadata.ArtistUnicode);
playlist.Current = beatmap.BeatmapSetInfo;
}
});
@ -356,7 +384,7 @@ namespace osu.Game.Overlays
(newBackground = new MusicControllerBackground(beatmap)).LoadAsync(game, delegate
{
dragContainer.Add(newBackground);
playerContainer.Add(newBackground);
switch (direction)
{

View File

@ -0,0 +1,373 @@
// Copyright (c) 2007-2017 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 OpenTK;
using OpenTK.Graphics;
using osu.Framework.Allocation;
using osu.Framework.Extensions.Color4Extensions;
using osu.Framework.Graphics;
using osu.Framework.Graphics.Containers;
using osu.Framework.Graphics.Primitives;
using osu.Framework.Graphics.Sprites;
using osu.Framework.Graphics.Transforms;
using osu.Framework.Graphics.UserInterface;
using osu.Game.Database;
using osu.Game.Graphics;
using osu.Game.Graphics.Sprites;
using osu.Game.Graphics.UserInterface;
using osu.Game.Screens.Select;
namespace osu.Game.Overlays
{
public class PlaylistController : FocusedOverlayContainer
{
private const float transition_duration = 800;
private Box bg;
private FilterTextBox search;
private Playlist songList;
public Action<BeatmapSetInfo> OnSelect
{
get { return songList.OnSelect; }
set { songList.OnSelect = value; }
}
public BeatmapSetInfo Current
{
get { return songList.Current; }
set { songList.Current = value; }
}
public PlaylistController()
{
Children = new Drawable[]
{
new Container
{
RelativeSizeAxes = Axes.Both,
CornerRadius = 5,
Masking = true,
EdgeEffect = new EdgeEffect
{
Type = EdgeEffectType.Shadow,
Colour = Color4.Black.Opacity(40),
Radius = 5,
},
Children = new Drawable[]
{
bg = new Box
{
RelativeSizeAxes = Axes.Both,
},
songList = new Playlist
{
RelativeSizeAxes = Axes.Both,
Padding = new MarginPadding { Top = 95, Bottom = 10, Right = 10 }, //todo: static sizes aren't good
},
new Container
{
RelativeSizeAxes = Axes.Both,
Padding = new MarginPadding(10),
Children = new Drawable[]
{
new FillFlowContainer
{
RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y,
Spacing = new Vector2(0f, 10f),
Children = new Drawable[]
{
search = new FilterTextBox
{
RelativeSizeAxes = Axes.X,
Height = 40,
},
new CollectionsDropdown<PlaylistCollection>
{
RelativeSizeAxes = Axes.X,
Items = new[] { new KeyValuePair<string, PlaylistCollection>(@"All", PlaylistCollection.All) },
}
},
},
},
},
},
},
};
}
[BackgroundDependencyLoader]
private void load(OsuColour colours)
{
bg.Colour = colours.Gray3;
}
protected override void PopIn()
{
base.PopIn();
search.HoldFocus = true;
songList.ScrollContainer.ScrollDraggerVisible = false;
ResizeTo(new Vector2(1f), transition_duration, EasingTypes.OutQuint);
}
protected override void PopOut()
{
base.PopOut();
search.HoldFocus = false;
search.TriggerFocusLost();
songList.ScrollContainer.ScrollDraggerVisible = false;
ResizeTo(new Vector2(1f, 0f), transition_duration, EasingTypes.OutQuint);
}
private class Playlist : Container
{
private FillFlowContainer<PlaylistItem> songs;
// exposed so PlaylistController can hide the scroll dragger when hidden
// because the scroller can be seen when scrolled to the bottom and PlaylistController is closed
public readonly ScrollContainer ScrollContainer;
private BeatmapDatabase database;
private Action<BeatmapSetInfo> onSelect;
public Action<BeatmapSetInfo> OnSelect
{
get { return onSelect; }
set
{
onSelect = value;
foreach (PlaylistItem s in songs.Children)
s.OnSelect = value;
}
}
private BeatmapSetInfo current;
public BeatmapSetInfo Current
{
get { return current; }
set
{
if (value == current) return;
current = value;
foreach (PlaylistItem s in songs.Children)
s.Current = s.RepresentedSet.ID == value.ID;
}
}
public Playlist()
{
Children = new Drawable[]
{
ScrollContainer = new ScrollContainer
{
RelativeSizeAxes = Axes.Both,
Children = new Drawable[]
{
songs = new FillFlowContainer<PlaylistItem>
{
RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y,
},
},
},
};
}
[BackgroundDependencyLoader]
private void load(BeatmapDatabase beatmaps)
{
database = beatmaps;
foreach (BeatmapSetInfo b in beatmaps.GetAllWithChildren<BeatmapSetInfo>())
{
songs.Add(new PlaylistItem(b)
{
OnSelect = OnSelect,
});
}
}
private class PlaylistItem : Container
{
private const float fade_duration = 100;
private Color4 current_colour;
private TextAwesome icon;
private OsuSpriteText title, artist;
public readonly BeatmapSetInfo RepresentedSet;
public Action<BeatmapSetInfo> OnSelect;
private bool current;
public bool Current
{
get { return current; }
set
{
if (value == current) return;
current = value;
title.FadeColour(Current ? current_colour : Color4.White, fade_duration);
}
}
public PlaylistItem(BeatmapSetInfo set)
{
RepresentedSet = set;
RelativeSizeAxes = Axes.X;
AutoSizeAxes = Axes.Y;
Padding = new MarginPadding { Top = 3, Bottom = 3 };
Children = new Drawable[]
{
icon = new TextAwesome
{
Anchor = Anchor.TopLeft,
Origin = Anchor.TopLeft,
TextSize = 12,
Icon = FontAwesome.fa_bars,
Alpha = 0f,
Margin = new MarginPadding { Left = 5 },
Padding = new MarginPadding { Top = 2 },
},
new FillFlowContainer
{
RelativeSizeAxes = Axes.X,
AutoSizeAxes = Axes.Y,
Padding = new MarginPadding { Left = 20 },
Spacing = new Vector2(10f, 0f),
Children = new Drawable[]
{
title = new OsuSpriteText
{
TextSize = 16,
Font = @"Exo2.0-Regular",
Text = RepresentedSet.Metadata.Title,
},
artist = new OsuSpriteText
{
TextSize = 14,
Font = @"Exo2.0-Bold",
Text = RepresentedSet.Metadata.Artist,
Padding = new MarginPadding { Top = 1 },
},
},
},
};
}
[BackgroundDependencyLoader]
private void load(OsuColour colours)
{
icon.Colour = colours.Gray5;
artist.Colour = colours.Gray9;
current_colour = colours.Yellow;
}
protected override bool OnHover(Framework.Input.InputState state)
{
icon.FadeIn(fade_duration);
return base.OnHover(state);
}
protected override void OnHoverLost(Framework.Input.InputState state)
{
icon.FadeOut(fade_duration);
}
protected override bool OnClick(Framework.Input.InputState state)
{
OnSelect?.Invoke(RepresentedSet);
return true;
}
}
}
private class FilterTextBox : SearchTextBox
{
protected override Color4 BackgroundUnfocused => OsuColour.FromHex(@"222222");
protected override Color4 BackgroundFocused => OsuColour.FromHex(@"222222");
public FilterTextBox()
{
Masking = true;
CornerRadius = 5;
}
}
private class CollectionsDropdown<T> : OsuDropdown<T>
{
protected override DropdownHeader CreateHeader() => new CollectionsHeader { AccentColour = AccentColour };
protected override Menu CreateMenu() => new CollectionsMenu();
[BackgroundDependencyLoader]
private void load(OsuColour colours)
{
AccentColour = colours.Gray6;
}
private class CollectionsHeader : OsuDropdownHeader
{
[BackgroundDependencyLoader]
private void load(OsuColour colours)
{
BackgroundColour = colours.Gray4;
}
public CollectionsHeader()
{
CornerRadius = 5;
Height = 30;
Icon.TextSize = 14;
Icon.Margin = new MarginPadding(0);
Foreground.Padding = new MarginPadding { Top = 4, Bottom = 4, Left = 10, Right = 10 };
EdgeEffect = new EdgeEffect
{
Type = EdgeEffectType.Shadow,
Colour = Color4.Black.Opacity(0.3f),
Radius = 3,
Offset = new Vector2(0f, 1f),
};
}
}
private class CollectionsMenu : OsuMenu
{
[BackgroundDependencyLoader]
private void load(OsuColour colours)
{
Background.Colour = colours.Gray4;
}
public CollectionsMenu()
{
CornerRadius = 5;
EdgeEffect = new EdgeEffect
{
Type = EdgeEffectType.Shadow,
Colour = Color4.Black.Opacity(0.3f),
Radius = 3,
Offset = new Vector2(0f, 1f),
};
}
}
}
}
//todo: placeholder
public enum PlaylistCollection
{
All
}
}

View File

@ -366,6 +366,7 @@
<Compile Include="Screens\Select\BeatmapDetailArea.cs" />
<Compile Include="Graphics\UserInterface\OsuTabControlCheckBox.cs" />
<Compile Include="Screens\Select\BeatmapDetailAreaTabControl.cs" />
<Compile Include="Overlays\PlaylistController.cs" />
</ItemGroup>
<ItemGroup>
<ProjectReference Include="$(SolutionDir)\osu-framework\osu.Framework\osu.Framework.csproj">