From 53861c479580ba36aa956fb282578be3b5acd924 Mon Sep 17 00:00:00 2001 From: Chandler Cox Date: Fri, 1 Sep 2023 14:28:26 -0500 Subject: [PATCH] Improve content item in tile view. Decrease margin between list view items. --- Source/Editor/Content/GUI/ContentView.cs | 15 ++--- Source/Editor/Content/Items/ContentItem.cs | 71 ++++++++++++++++++---- 2 files changed, 66 insertions(+), 20 deletions(-) diff --git a/Source/Editor/Content/GUI/ContentView.cs b/Source/Editor/Content/GUI/ContentView.cs index 6065ca9f8..40a06c1b6 100644 --- a/Source/Editor/Content/GUI/ContentView.cs +++ b/Source/Editor/Content/GUI/ContentView.cs @@ -711,7 +711,7 @@ namespace FlaxEditor.Content.GUI protected override void PerformLayoutBeforeChildren() { float width = GetClientArea().Width; - float x = 0, y = 0; + float x = 0, y = 1; float viewScale = _viewScale * 0.97f; switch (ViewType) @@ -722,21 +722,22 @@ namespace FlaxEditor.Content.GUI int itemsToFit = Mathf.FloorToInt(width / defaultItemsWidth) - 1; if (itemsToFit < 1) itemsToFit = 1; - float itemsWidth = width / Mathf.Max(itemsToFit, 1); + int xSpace = 4; + float itemsWidth = width / Mathf.Max(itemsToFit, 1) - xSpace; float itemsHeight = itemsWidth / defaultItemsWidth * (ContentItem.DefaultHeight * viewScale); var flooredItemsWidth = Mathf.Floor(itemsWidth); var flooredItemsHeight = Mathf.Floor(itemsHeight); - x = itemsToFit == 1 ? 0 : itemsWidth / itemsToFit; + x = itemsToFit == 1 ? 1 : itemsWidth / itemsToFit + xSpace; for (int i = 0; i < _children.Count; i++) { var c = _children[i]; c.Bounds = new Rectangle(Mathf.Floor(x), Mathf.Floor(y), flooredItemsWidth, flooredItemsHeight); - x += itemsWidth + itemsWidth / itemsToFit; + x += (itemsWidth + xSpace) + (itemsWidth + xSpace) / itemsToFit; if (x + itemsWidth > width) { - x = itemsToFit == 1 ? 0 : itemsWidth / itemsToFit; - y += itemsHeight + 5; + x = itemsToFit == 1 ? 1 : itemsWidth / itemsToFit + xSpace; + y += itemsHeight + 7; } } if (x > 0) @@ -751,7 +752,7 @@ namespace FlaxEditor.Content.GUI { var c = _children[i]; c.Bounds = new Rectangle(x, y, width, itemsHeight); - y += itemsHeight + 5; + y += itemsHeight + 1; } y += 40.0f; diff --git a/Source/Editor/Content/Items/ContentItem.cs b/Source/Editor/Content/Items/ContentItem.cs index 66825fb42..41f35b4c7 100644 --- a/Source/Editor/Content/Items/ContentItem.cs +++ b/Source/Editor/Content/Items/ContentItem.cs @@ -483,6 +483,30 @@ namespace FlaxEditor.Content else Render2D.FillRectangle(rectangle, Color.Black); } + + /// + /// Draws the item thumbnail. + /// + /// The thumbnail rectangle. + /// /// Whether or not to draw the shadow. Overrides DrawShadow. + public void DrawThumbnail(ref Rectangle rectangle, bool shadow) + { + // Draw shadow + if (shadow) + { + const float thumbnailInShadowSize = 50.0f; + var shadowRect = rectangle.MakeExpanded((DefaultThumbnailSize - thumbnailInShadowSize) * rectangle.Width / DefaultThumbnailSize * 1.3f); + if (!_shadowIcon.IsValid) + _shadowIcon = Editor.Instance.Icons.AssetShadow128; + Render2D.DrawSprite(_shadowIcon, shadowRect); + } + + // Draw thumbnail + if (_thumbnail.IsValid) + Render2D.DrawSprite(_thumbnail, rectangle); + else + Render2D.FillRectangle(rectangle, Color.Black); + } /// /// Gets the amount of references to that item. @@ -655,9 +679,32 @@ namespace FlaxEditor.Content { case ContentViewType.Tiles: { - var thumbnailSize = size.X - 2 * DefaultMarginSize; - thumbnailRect = new Rectangle(DefaultMarginSize, DefaultMarginSize, thumbnailSize, thumbnailSize); + var thumbnailSize = size.X; + thumbnailRect = new Rectangle(0, 0, thumbnailSize, thumbnailSize); nameAlignment = TextAlignment.Center; + + // Small shadow + var shadowRect = new Rectangle(2, 2, clientRect.Width + 1, clientRect.Height + 1); + var color = Color.Black.AlphaMultiplied(0.2f); + Render2D.FillRectangle(shadowRect, color); + + Render2D.FillRectangle(clientRect, style.LightBackground); + Render2D.FillRectangle(TextRectangle, style.TextBoxBackground); + var accentHeight = 2 * view.ViewScale; + var barRect = new Rectangle(0, thumbnailRect.Height - accentHeight, clientRect.Width, accentHeight); + Render2D.FillRectangle(barRect, Color.DimGray); + + DrawThumbnail(ref thumbnailRect, false); + if (isSelected) + { + Render2D.FillRectangle(textRect, Parent.ContainsFocus ? style.BackgroundSelected : style.LightBackground); + Render2D.DrawRectangle(clientRect, Parent.ContainsFocus ? style.BackgroundSelected : style.LightBackground); + } + else if (IsMouseOver) + { + Render2D.FillRectangle(textRect, style.BackgroundHighlighted); + Render2D.DrawRectangle(clientRect, style.BackgroundHighlighted); + } break; } case ContentViewType.List: @@ -665,23 +712,21 @@ namespace FlaxEditor.Content var thumbnailSize = size.Y - 2 * DefaultMarginSize; thumbnailRect = new Rectangle(DefaultMarginSize, DefaultMarginSize, thumbnailSize, thumbnailSize); nameAlignment = TextAlignment.Near; + + if (isSelected) + Render2D.FillRectangle(clientRect, Parent.ContainsFocus ? style.BackgroundSelected : style.LightBackground); + else if (IsMouseOver) + Render2D.FillRectangle(clientRect, style.BackgroundHighlighted); + + DrawThumbnail(ref thumbnailRect); break; } default: throw new ArgumentOutOfRangeException(); } - - // Draw background - if (isSelected) - Render2D.FillRectangle(clientRect, Parent.ContainsFocus ? style.BackgroundSelected : style.LightBackground); - else if (IsMouseOver) - Render2D.FillRectangle(clientRect, style.BackgroundHighlighted); - - // Draw preview - DrawThumbnail(ref thumbnailRect); - + // Draw short name Render2D.PushClip(ref textRect); - Render2D.DrawText(style.FontMedium, ShowFileExtension || view.ShowFileExtensions ? FileName : ShortName, textRect, style.Foreground, nameAlignment, TextAlignment.Center, TextWrapping.WrapWords, 0.75f, 0.95f); + Render2D.DrawText(style.FontMedium, ShowFileExtension || view.ShowFileExtensions ? FileName : ShortName, textRect, style.Foreground, nameAlignment, TextAlignment.Center, TextWrapping.WrapWords, 1f, 0.95f); Render2D.PopClip(); }