This commit is contained in:
2026-04-27 15:48:17 +07:00
parent d075d4d861
commit c259531fcc
10 changed files with 366 additions and 83 deletions

View File

@@ -33,12 +33,23 @@ namespace UI
_ribbon = _root.Q<VisualElement>("menu-ribbon");
_logoPlaceholder = _root.Q<VisualElement>("logo-placeholder");
// Đảm bảo Logo luôn có thể nhấn được
_logoContainer.pickingMode = PickingMode.Position;
_logo.pickingMode = PickingMode.Position;
_logoContainer.RegisterCallback<ClickEvent>(OnLogoClicked);
// Tracking interactions
_root.RegisterCallback<MouseMoveEvent>(evt => ResetIdleTimer());
var buttons = _root.Query<Button>().ToList();
foreach (var btn in buttons) btn.RegisterCallback<ClickEvent>(evt => ResetIdleTimer());
foreach (var btn in buttons)
{
btn.RegisterCallback<PointerDownEvent>(evt => ApplyDrumHit(btn, true));
btn.RegisterCallback<PointerUpEvent>(evt => ApplyDrumHit(btn, false));
btn.RegisterCallback<ClickEvent>(evt => ResetIdleTimer());
}
_logoContainer.RegisterCallback<PointerDownEvent>(evt => ApplyDrumHit(_logoContainer, true));
_logoContainer.RegisterCallback<PointerUpEvent>(evt => ApplyDrumHit(_logoContainer, false));
// Routing
_root.Q<Button>("btn-create")?.RegisterCallback<ClickEvent>(ev => NavigateToLobby(true));
@@ -52,18 +63,14 @@ namespace UI
private void Update()
{
// Pulsing logic
float baseScale = _isActive ? 0.38f : 1.0f;
float baseScale = _isActive ? 0.35f : 1.0f;
float pulse = Mathf.Sin(Time.time * pulseSpeed) * pulseAmount;
_logo.style.scale = new Scale(new Vector3(baseScale + pulse, baseScale + pulse, 1f));
// Idle timer logic
if (_isActive && _currentTransition == null)
{
if (Time.time - _lastInteractionTime > idleTimeout)
{
_currentTransition = StartCoroutine(TransitionToIdle());
}
}
}
@@ -74,11 +81,26 @@ namespace UI
ResetIdleTimer();
// QUAN TRỌNG: Chỉ vào Lobby nếu ĐÃ Active và KHÔNG đang chuyển cảnh
if (!_isActive) {
if (_currentTransition != null) StopCoroutine(_currentTransition);
_currentTransition = StartCoroutine(TransitionToActive());
} else {
if (_currentTransition == null) NavigateToLobby(true);
} else if (_currentTransition == null) {
NavigateToLobby(true);
}
}
private void ApplyDrumHit(VisualElement element, bool isDown)
{
if (isDown)
{
element.style.scale = new Scale(new Vector3(0.85f, 0.85f, 1f));
element.style.transitionDuration = new List<TimeValue> { new TimeValue(0.05f, TimeUnit.Second) };
}
else
{
element.style.scale = new Scale(Vector3.one);
element.style.transitionDuration = new List<TimeValue> { new TimeValue(0.15f, TimeUnit.Second) };
}
}
@@ -100,12 +122,12 @@ namespace UI
UIManager.Instance.isMainMenuActive = false;
_ribbon.style.display = DisplayStyle.None;
// Ensure logo is back in root
if (_logoContainer.parent != _root) _root.Add(_logoContainer);
_root.Add(_logoContainer);
_logoContainer.style.position = Position.Absolute;
_logoContainer.style.translate = new Translate(0, 0);
_logoContainer.pickingMode = PickingMode.Position;
_logoContainer.style.width = 300; _logoContainer.style.height = 300;
_logoContainer.style.left = Length.Percent(50);
_logoContainer.style.top = Length.Percent(50);
_logoContainer.style.translate = new Translate(Length.Percent(-50), Length.Percent(-50));
_currentTransition = null;
}
@@ -118,29 +140,29 @@ namespace UI
_ribbon.style.display = DisplayStyle.Flex;
_ribbon.style.opacity = 0;
// Wait for layout update to get correct placeholder position
yield return null;
// Animation properties
_logoContainer.style.transitionProperty = new List<StylePropertyName> { "translate", "opacity" };
_logoContainer.style.transitionDuration = new List<TimeValue> { new TimeValue(transitionDuration, TimeUnit.Second) };
_ribbon.style.transitionProperty = new List<StylePropertyName> { "opacity" };
_ribbon.style.transitionDuration = new List<TimeValue> { new TimeValue(transitionDuration, TimeUnit.Second) };
// Move to placeholder (-20% of screen width)
_logoContainer.style.translate = new Translate(Length.Percent(-20f), 0);
// Trượt Logo từ tâm sang vị trí ribbon (#2)
_logoContainer.style.translate = new Translate(Length.Percent(-75f), Length.Percent(-50f));
_ribbon.style.opacity = 1;
yield return new WaitForSeconds(transitionDuration);
// --- REPARENTING LOGIC ---
// Move logo container INSIDE the placeholder for perfect positioning
// Gán chặt vào placeholder và khóa kích thước để chống giãn
_logoPlaceholder.Add(_logoContainer);
// Reset translation because it's now relative to the placeholder
_logoContainer.style.position = Position.Relative;
_logoContainer.style.left = StyleKeyword.Auto;
_logoContainer.style.top = StyleKeyword.Auto;
_logoContainer.style.translate = new Translate(0, 0);
_logoContainer.style.position = Position.Relative; // Follow flex layout
_logoContainer.style.alignSelf = Align.Center;
// Khóa kích thước nhỏ để fit vào Ribbon
_logoContainer.style.width = 100;
_logoContainer.style.height = 100;
_currentTransition = null;
}
@@ -150,18 +172,16 @@ namespace UI
_isActive = false;
UIManager.Instance.isMainMenuActive = false;
// --- UN-PARENTING LOGIC ---
// Move back to root for animation
Vector3 worldPos = _logoContainer.worldBound.center;
_root.Add(_logoContainer);
_logoContainer.style.position = Position.Absolute;
// Keep it at current position visually before animating back
_logoContainer.style.translate = new Translate(Length.Percent(-20f), 0);
_logoContainer.style.width = 300; _logoContainer.style.height = 300;
_logoContainer.style.left = Length.Percent(50);
_logoContainer.style.top = Length.Percent(50);
_logoContainer.style.translate = new Translate(Length.Percent(-75f), Length.Percent(-50f));
yield return null; // wait for frame
yield return null;
_logoContainer.style.translate = new Translate(0, 0);
_logoContainer.style.translate = new Translate(Length.Percent(-50f), Length.Percent(-50f));
_ribbon.style.opacity = 0;
yield return new WaitForSeconds(transitionDuration);