Skip to content

Commit

Permalink
Update new chat overlay day separator colours and spacing
Browse files Browse the repository at this point in the history 
Updates the `DaySeparator` component to have separately settable colours
for the text and the lines.

Updates existing overrides of the `DaySeparator` to use the new colour
setter.

Create new `ChatOverlayDrawableChannel` with adjusted spacing and new
`DaySeparator` colours.
  • Loading branch information
@jai-x
jai-x committed May 6, 2022
1 parent 4047983 commit 9d62206
Show file tree
Hide file tree
Showing 5 changed files with 64 additions and 28 deletions.
6 changes: 3 additions & 3 deletions osu.Game.Tests/Visual/Online/TestSceneChatOverlayV2.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -365,7 +365,7 @@ public void TextBoxRetainsFocus()
AddAssert("TextBox is focused", () => InputManager.FocusedDrawable == chatOverlayTextBox);
AddStep("Click listing", () => clickDrawable(chatOverlay.ChildrenOfType<ChannelListing>().Single()));
AddAssert("TextBox is focused", () => InputManager.FocusedDrawable == chatOverlayTextBox);
AddStep("Click drawable channel", () => clickDrawable(chatOverlay.ChildrenOfType<DrawableChannel>().Single()));
AddStep("Click drawable channel", () => clickDrawable(chatOverlay.ChildrenOfType<ChatOverlayDrawableChannel>().Single()));
AddAssert("TextBox is focused", () => InputManager.FocusedDrawable == chatOverlayTextBox);
AddStep("Click channel list", () => clickDrawable(chatOverlay.ChildrenOfType<ChannelList>().Single()));
AddAssert("TextBox is focused", () => InputManager.FocusedDrawable == chatOverlayTextBox);
Expand All @@ -381,8 +381,8 @@ public void TextBoxRetainsFocus()
private Visibility loadingVisibility =>
chatOverlay.ChildrenOfType<LoadingLayer>().Single().State.Value;

private DrawableChannel currentDrawableChannel =>
chatOverlay.ChildrenOfType<Container<DrawableChannel>>().Single().Child;
private ChatOverlayDrawableChannel currentDrawableChannel =>
chatOverlay.ChildrenOfType<Container<ChatOverlayDrawableChannel>>().Single().Child;

private ChannelListItem getChannelListItem(Channel channel) =>
chatOverlay.ChildrenOfType<ChannelListItem>().Single(item => item.Channel == channel);
Expand Down
33 changes: 13 additions & 20 deletions osu.Game/Online/Chat/StandAloneChatDisplay.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -155,38 +155,31 @@ public class StandAloneDrawableChannel : DrawableChannel
{
public Func<Message, ChatLine> CreateChatLineAction;

protected override ChatLine CreateChatLine(Message m) => CreateChatLineAction(m);

protected override DaySeparator CreateDaySeparator(DateTimeOffset time) => new CustomDaySeparator(time);
private Colour4 daySepColour;

public StandAloneDrawableChannel(Channel channel)
: base(channel)
{
}

[BackgroundDependencyLoader]
private void load()
private void load(OsuColour colours)
{
ChatLineFlow.Padding = new MarginPadding { Horizontal = 0 };
daySepColour = colours.Yellow;
}

private class CustomDaySeparator : DaySeparator
{
public CustomDaySeparator(DateTimeOffset time)
: base(time)
{
}
protected override ChatLine CreateChatLine(Message m) => CreateChatLineAction(m);

[BackgroundDependencyLoader]
private void load(OsuColour colours)
{
Colour = colours.Yellow;
TextSize = 14;
LineHeight = 1;
Padding = new MarginPadding { Horizontal = 10 };
Margin = new MarginPadding { Vertical = 5 };
}
}
protected override DaySeparator CreateDaySeparator(DateTimeOffset time) => new DaySeparator(time)
{
TextSize = 14,
TextColour = daySepColour,
LineHeight = 1,
LineColour = daySepColour,
Padding = new MarginPadding { Horizontal = 10 },
Margin = new MarginPadding { Vertical = 5 },
};
}

protected class StandAloneMessage : ChatLine
Expand Down
2 changes: 1 addition & 1 deletion osu.Game/Overlays/Chat/ChatTextBar.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ public class ChatTextBar : Container
private Container searchIconContainer = null!;
private ChatTextBox chatTextBox = null!;

private const float chatting_text_width = 240;
private const float chatting_text_width = 220;
private const float search_icon_width = 40;

[BackgroundDependencyLoader]
Expand Down
18 changes: 17 additions & 1 deletion osu.Game/Overlays/Chat/DrawableChannel.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@
using osu.Framework.Bindables;
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.Framework.Graphics.Sprites;
Expand Down Expand Up @@ -123,8 +124,9 @@ protected override void Dispose(bool isDisposing)

protected virtual DaySeparator CreateDaySeparator(DateTimeOffset time) => new DaySeparator(time)
{
TextColour = colours.ChatBlue.Lighten(0.7f),
LineColour = colours.ChatBlue.Lighten(0.7f),
Margin = new MarginPadding { Vertical = 10 },
Colour = colours.ChatBlue.Lighten(0.7f),
};

private void newMessagesArrived(IEnumerable<Message> newMessages) => Schedule(() =>
Expand Down Expand Up @@ -212,6 +214,12 @@ public float TextSize
set => text.Font = text.Font.With(size: value);
}

public ColourInfo TextColour
{
get => text.Colour;
set => text.Colour = value;
}

private float lineHeight = 2;

public float LineHeight
Expand All @@ -220,6 +228,14 @@ public float LineHeight
set => lineHeight = leftBox.Height = rightBox.Height = value;
}

private ColourInfo lineColour;

public ColourInfo LineColour
{
get => lineColour;
set => lineColour = leftBox.Colour = rightBox.Colour = value;
}

private readonly SpriteText text;
private readonly Box leftBox;
private readonly Box rightBox;
Expand Down
33 changes: 30 additions & 3 deletions osu.Game/Overlays/ChatOverlayV2.cs
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@

#nullable enable

using System;
using System.Collections;
using System.Collections.Generic;
using System.Collections.Specialized;
Expand Down Expand Up @@ -37,7 +38,7 @@ public class ChatOverlayV2 : OsuFocusedOverlayContainer, INamedOverlayComponent
private LoadingLayer loading = null!;
private ChannelListing channelListing = null!;
private ChatTextBar textBar = null!;
private Container<DrawableChannel> currentChannelContainer = null!;
private Container<ChatOverlayDrawableChannel> currentChannelContainer = null!;

private readonly BindableFloat chatHeight = new BindableFloat();

Expand Down Expand Up @@ -120,7 +121,7 @@ private void load()
RelativeSizeAxes = Axes.Both,
Colour = colourProvider.Background4,
},
currentChannelContainer = new Container<DrawableChannel>
currentChannelContainer = new Container<ChatOverlayDrawableChannel>
{
RelativeSizeAxes = Axes.Both,
},
Expand Down Expand Up @@ -268,7 +269,7 @@ private void currentChannelChanged(ValueChangedEvent<Channel> channel)
return;
}

LoadComponentAsync(new DrawableChannel(newChannel), loaded =>
LoadComponentAsync(new ChatOverlayDrawableChannel(newChannel), loaded =>
{
currentChannelContainer.Clear();
currentChannelContainer.Add(loaded);
Expand Down Expand Up @@ -311,4 +312,30 @@ private void handleChatMessage(string message)
channelManager.PostMessage(message);
}
}

public class ChatOverlayDrawableChannel : DrawableChannel
{
private Colour4 daySepTextColour;
private Colour4 daySepLineColour;

public ChatOverlayDrawableChannel(Channel channel)
: base(channel)
{ }

[BackgroundDependencyLoader]
private void load(OverlayColourProvider colourProvider)
{
ChatLineFlow.Padding = new MarginPadding(0);
daySepTextColour = colourProvider.Content1;
daySepLineColour = colourProvider.Background5;
}

protected override DaySeparator CreateDaySeparator(DateTimeOffset time) => new DaySeparator(time)
{
TextColour = daySepTextColour,
LineColour = daySepLineColour,
Margin = new MarginPadding { Vertical = 10 },
Padding = new MarginPadding { Horizontal = 15 },
};
}
}

0 comments on commit 9d62206

Please sign in to comment.