Cinka/OldThink
1
0
Fork 0
Code Issues Pull Requests Actions 3 Packages Projects Releases Wiki Activity

Implement more new styling stuff.

Browse Source
This commit is contained in:
Pieter-Jan Briers
2019-10-18 14:28:24 +02:00
parent 0edccd8934
commit 743ede2243
10 changed files with 373 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

41
Content.Client/UserInterface/NanoHeading.cs Normal file
View File

@@ -0,0 +1,41 @@
using Robust.Client.UserInterface.Controls;
using Robust.Shared.Maths;
namespace Content.Client.UserInterface
{
public class NanoHeading : Container
{
private readonly Label _label;
private readonly PanelContainer _panel;
public NanoHeading()
{
_panel = new PanelContainer
{
Children = {(_label = new Label
{
StyleClasses = {NanoStyle.StyleClassLabelHeading}
})}
};
AddChild(_panel);
SizeFlagsHorizontal = SizeFlags.None;
}
public string Text
{
get => _label.Text;
set => _label.Text = value;
}
protected override Vector2 CalculateMinimumSize()
{
return _panel.CombinedMinimumSize;
}
protected override void SortChildren()
{
FitChildInBox(_panel, SizeBox);
}
}
}

68
Content.Client/UserInterface/NanoStyle.cs
View File

@@ -13,10 +13,12 @@ namespace Content.Client.UserInterface
public sealed class NanoStyle
{
public const string StyleClassLabelHeading = "LabelHeading";
public const string StyleClassLabelHeadingBigger = "LabelHeadingBigger";
public const string StyleClassLabelSubText = "LabelSubText";
public const string StyleClassLabelSecondaryColor = "LabelSecondaryColor";
public const string StyleClassLabelBig = "LabelBig";
public const string StyleClassButtonBig = "ButtonBig";
private static readonly Color NanoGold = Color.FromHex("#A88B5E");
public static readonly Color NanoGold = Color.FromHex("#A88B5E");
//Used by the APC and SMES menus
public const string StyleClassPowerStateNone = "PowerStateNone";
@@ -33,6 +35,7 @@ namespace Content.Client.UserInterface
var notoSansDisplayBold14 = resCache.GetFont("/Fonts/NotoSansDisplay/NotoSansDisplay-Bold.ttf", 14);
var notoSans16 = resCache.GetFont("/Nano/NotoSans/NotoSans-Regular.ttf", 16);
var notoSansBold16 = resCache.GetFont("/Nano/NotoSans/NotoSans-Bold.ttf", 16);
var notoSansBold20 = resCache.GetFont("/Nano/NotoSans/NotoSans-Bold.ttf", 20);
var textureCloseButton = resCache.GetTexture("/Nano/cross.svg.png");
var windowHeaderTex = resCache.GetTexture("/Nano/window_header.png");
var windowHeader = new StyleBoxTexture
@@ -56,10 +59,10 @@ namespace Content.Client.UserInterface
Texture = buttonTex,
Modulate = Color.FromHex("#464966")
};
buttonNormal.SetPatchMargin(StyleBox.Margin.All, 8);
buttonNormal.SetPatchMargin(StyleBox.Margin.All, 10);
buttonNormal.SetPadding(StyleBox.Margin.All, 1);
buttonNormal.SetContentMarginOverride(StyleBox.Margin.Vertical, 2);
buttonNormal.SetContentMarginOverride(StyleBox.Margin.Horizontal, 12);
buttonNormal.SetContentMarginOverride(StyleBox.Margin.Horizontal, 14);
var buttonHover = new StyleBoxTexture(buttonNormal)
{
@@ -150,8 +153,9 @@ namespace Content.Client.UserInterface
// Placeholder
var placeholderTexture = resCache.GetTexture("/Nano/placeholder.png");
var placeholder = new StyleBoxTexture {Texture = placeholderTexture};
placeholder.SetPatchMargin(StyleBox.Margin.All, 24);
placeholder.SetPatchMargin(StyleBox.Margin.All, 19);
placeholder.SetExpandMargin(StyleBox.Margin.All, -5);
placeholder.Mode = StyleBoxTexture.StretchMode.Tile;
var itemListBackgroundSelected = new StyleBoxFlat {BackgroundColor = new Color(75, 75, 86)};
itemListBackgroundSelected.SetContentMarginOverride(StyleBox.Margin.Vertical, 2);
@@ -163,6 +167,28 @@ namespace Content.Client.UserInterface
itemListItemBackground.SetContentMarginOverride(StyleBox.Margin.Vertical, 2);
itemListItemBackground.SetContentMarginOverride(StyleBox.Margin.Horizontal, 4);
// NanoHeading
var nanoHeadingTex = resCache.GetTexture("/Nano/nanoheading.svg.96dpi.png");
var nanoHeadingBox = new StyleBoxTexture
{
Texture = nanoHeadingTex,
PatchMarginRight = 10,
PatchMarginTop = 10,
ContentMarginTopOverride = 2,
ContentMarginLeftOverride = 10,
PaddingTop = 4
};
nanoHeadingBox.SetPatchMargin(StyleBox.Margin.Left | StyleBox.Margin.Bottom, 2);
// Stripe background
var stripeBackTex = resCache.GetTexture("/Nano/stripeback.svg.96dpi.png");
var stripeBack = new StyleBoxTexture
{
Texture = stripeBackTex,
Mode = StyleBoxTexture.StretchMode.Tile
};
Stylesheet = new Stylesheet(new[]
{
// Default font.
@@ -431,6 +457,13 @@ namespace Content.Client.UserInterface
new StyleProperty(Label.StylePropertyFontColor, NanoGold),
}),
// Bigger Label
new StyleRule(new SelectorElement(typeof(Label), new[] {StyleClassLabelHeadingBigger}, null, null), new[]
{
new StyleProperty(Label.StylePropertyFont, notoSansBold20),
new StyleProperty(Label.StylePropertyFontColor, NanoGold),
}),
// Small Label
new StyleRule(new SelectorElement(typeof(Label), new[] {StyleClassLabelSubText}, null, null), new[]
{
@@ -518,6 +551,33 @@ namespace Content.Client.UserInterface
{
new StyleProperty(Control.StylePropertyModulateSelf, Color.FromHex("#00F")),
}),
// NanoHeading
new StyleRule(
new SelectorChild(
SelectorElement.Type(typeof(NanoHeading)),
SelectorElement.Type(typeof(PanelContainer))),
new[]
{
new StyleProperty(PanelContainer.StylePropertyPanel, nanoHeadingBox),
}),
// StripeBack
new StyleRule(
SelectorElement.Type(typeof(StripeBack)),
new []
{
new StyleProperty(StripeBack.StylePropertyBackground, stripeBack),
}),
// StyleClassLabelBig
new StyleRule(
SelectorElement.Class(StyleClassLabelBig),
new []
{
new StyleProperty("font", notoSans16),
}),
});
}
}

104
Content.Client/UserInterface/StripeBack.cs Normal file
View File

@@ -0,0 +1,104 @@
using Robust.Client.Graphics.Drawing;
using Robust.Client.UserInterface.Controls;
using Robust.Shared.Maths;
namespace Content.Client.UserInterface
{
public class StripeBack : Container
{
private const float PadSize = 4;
private const float EdgeSize = 2;
private static readonly Color EdgeColor = Color.FromHex("#525252ff");
private bool _hasTopEdge = true;
private bool _hasBottomEdge = true;
public const string StylePropertyBackground = "background";
public bool HasTopEdge
{
get => _hasTopEdge;
set
{
MinimumSizeChanged();
_hasTopEdge = value;
}
}
public bool HasBottomEdge
{
get => _hasBottomEdge;
set
{
_hasBottomEdge = value;
MinimumSizeChanged();
}
}
protected override Vector2 CalculateMinimumSize()
{
var size = Vector2.Zero;
foreach (var child in Children)
{
size = Vector2.ComponentMax(size, child.CombinedMinimumSize);
}
if (HasBottomEdge)
{
size += (0, PadSize + EdgeSize);
}
if (HasTopEdge)
{
size += (0, PadSize + EdgeSize);
}
return size;
}
protected override void SortChildren()
{
var box = SizeBox;
if (HasTopEdge)
{
box += (0, PadSize + EdgeSize, 0, 0);
}
if (HasBottomEdge)
{
box += (0, 0, 0, -(PadSize + EdgeSize));
}
foreach (var child in Children)
{
FitChildInBox(child, box);
}
}
protected override void Draw(DrawingHandleScreen handle)
{
UIBox2 centerBox = PixelSizeBox;
if (HasTopEdge)
{
centerBox += (0, (PadSize + EdgeSize) * UIScale, 0, 0);
handle.DrawRect(new UIBox2(0, PadSize * UIScale, PixelWidth, centerBox.Top), EdgeColor);
}
if (HasBottomEdge)
{
centerBox += (0, 0, 0, -((PadSize + EdgeSize) * UIScale));
handle.DrawRect(new UIBox2(0, centerBox.Bottom, PixelWidth, PixelHeight - PadSize * UIScale), EdgeColor);
}
GetActualStyleBox()?.Draw(handle, centerBox);
}
private StyleBox GetActualStyleBox()
{
return TryGetStyleProperty(StylePropertyBackground, out StyleBox box) ? box : null;
}
}
}