From c1b2fc19c162a06ba81b437860fe44a05d96bcc6 Mon Sep 17 00:00:00 2001 From: Wojtek Figat Date: Tue, 10 Aug 2021 13:29:42 +0200 Subject: [PATCH] Add better timeline UI positioning for improved viewport navigation --- Source/Editor/GUI/Timeline/GUI/PositionHandle.cs | 5 +++-- Source/Editor/GUI/Timeline/GUI/TimelineEdge.cs | 3 ++- Source/Editor/GUI/Timeline/Timeline.cs | 16 ++++++++-------- Source/Engine/UI/GUI/Panels/ScrollBar.cs | 1 + 4 files changed, 14 insertions(+), 11 deletions(-) diff --git a/Source/Editor/GUI/Timeline/GUI/PositionHandle.cs b/Source/Editor/GUI/Timeline/GUI/PositionHandle.cs index 0e9cddc46..6cc2f12c4 100644 --- a/Source/Editor/GUI/Timeline/GUI/PositionHandle.cs +++ b/Source/Editor/GUI/Timeline/GUI/PositionHandle.cs @@ -27,7 +27,8 @@ namespace FlaxEditor.GUI.Timeline.GUI { var style = Style.Current; var icon = Editor.Instance.Icons.VisjectArrowClosed32; - var timeAxisHeaderOffset = -_timeline.MediaBackground.ViewOffset.Y; + var timeAxisOverlap = Timeline.HeaderTopAreaHeight * 0.5f; + var timeAxisHeaderOffset = -_timeline.MediaBackground.ViewOffset.Y - timeAxisOverlap; Matrix3x3.RotationZ(Mathf.PiOverTwo, out var m1); var m2 = Matrix3x3.Translation2D(0, timeAxisHeaderOffset); @@ -36,7 +37,7 @@ namespace FlaxEditor.GUI.Timeline.GUI Render2D.DrawSprite(icon, new Rectangle(new Vector2(4, -Width), Size), _timeline.IsMovingPositionHandle ? style.ProgressNormal : style.Foreground); Render2D.PopTransform(); - Render2D.FillRectangle(new Rectangle(Width * 0.5f, Height + timeAxisHeaderOffset, 1, _timeline.MediaPanel.Height - timeAxisHeaderOffset), _timeline.IsMovingPositionHandle ? style.ProgressNormal : style.Foreground.RGBMultiplied(0.8f)); + Render2D.FillRectangle(new Rectangle(Width * 0.5f, Height + timeAxisHeaderOffset, 1, _timeline.MediaPanel.Height - timeAxisHeaderOffset - timeAxisOverlap), _timeline.IsMovingPositionHandle ? style.ProgressNormal : style.Foreground.RGBMultiplied(0.8f)); base.Draw(); } diff --git a/Source/Editor/GUI/Timeline/GUI/TimelineEdge.cs b/Source/Editor/GUI/Timeline/GUI/TimelineEdge.cs index 0a7699cc5..83cb9760e 100644 --- a/Source/Editor/GUI/Timeline/GUI/TimelineEdge.cs +++ b/Source/Editor/GUI/Timeline/GUI/TimelineEdge.cs @@ -37,7 +37,8 @@ namespace FlaxEditor.GUI.Timeline.GUI public override void Draw() { var style = Style.Current; - var timeAxisHeaderOffset = -_timeline.MediaBackground.ViewOffset.Y; + var timeAxisOverlap = Timeline.HeaderTopAreaHeight * 0.5f; + var timeAxisHeaderOffset = -_timeline.MediaBackground.ViewOffset.Y - timeAxisOverlap; var moveColor = style.ProgressNormal; var thickness = 2.0f; diff --git a/Source/Editor/GUI/Timeline/Timeline.cs b/Source/Editor/GUI/Timeline/Timeline.cs index 5f7dbb912..6f7564f7a 100644 --- a/Source/Editor/GUI/Timeline/Timeline.cs +++ b/Source/Editor/GUI/Timeline/Timeline.cs @@ -959,12 +959,12 @@ namespace FlaxEditor.GUI.Timeline private void UpdatePositionHandle() { var handleWidth = 12.0f; - _positionHandle.Bounds = new Rectangle( - StartOffset * 2.0f - handleWidth * 0.5f + _currentFrame / _framesPerSecond * UnitsPerSecond * Zoom, - HeaderTopAreaHeight * -0.5f, - handleWidth, - HeaderTopAreaHeight * 0.5f - ); + var bounds = new Rectangle(); + bounds.Location.X = StartOffset * 2.0f - handleWidth * 0.5f + _currentFrame / _framesPerSecond * UnitsPerSecond * Zoom; + bounds.Location.Y = 0; + bounds.Size.X = handleWidth; + bounds.Size.Y = HeaderTopAreaHeight * 0.5f; + _positionHandle.Bounds = bounds; } private void OnFpsPopupShowing(ComboBox comboBox) @@ -1936,8 +1936,8 @@ namespace FlaxEditor.GUI.Timeline _background.Bounds = new Rectangle(StartOffset, 0, Duration * UnitsPerSecond * Zoom, height); var edgeWidth = 6.0f; - _leftEdge.Bounds = new Rectangle(_background.Left - edgeWidth * 0.5f + StartOffset, HeaderTopAreaHeight * -0.5f, edgeWidth, height + HeaderTopAreaHeight * 0.5f); - _rightEdge.Bounds = new Rectangle(_background.Right - edgeWidth * 0.5f + StartOffset, HeaderTopAreaHeight * -0.5f, edgeWidth, height + HeaderTopAreaHeight * 0.5f); + _leftEdge.Bounds = new Rectangle(_background.Left - edgeWidth * 0.5f + StartOffset, 0, edgeWidth, height); + _rightEdge.Bounds = new Rectangle(_background.Right - edgeWidth * 0.5f + StartOffset, 0, edgeWidth, height); _backgroundScroll.Bounds = new Rectangle(0, 0, _background.Width + 5 * StartOffset, height); } diff --git a/Source/Engine/UI/GUI/Panels/ScrollBar.cs b/Source/Engine/UI/GUI/Panels/ScrollBar.cs index bea692e19..0bae50591 100644 --- a/Source/Engine/UI/GUI/Panels/ScrollBar.cs +++ b/Source/Engine/UI/GUI/Panels/ScrollBar.cs @@ -140,6 +140,7 @@ namespace FlaxEngine.GUI { _targetValue = value; _value = value; + SetUpdate(ref _update, null); OnValueChanged(); } }