Skip to content

style: adjust folder icon animation durations#737

Merged
deepin-bot[bot] merged 1 commit intolinuxdeepin:masterfrom
mhduiy:ani
Mar 18, 2026
Merged

style: adjust folder icon animation durations#737
deepin-bot[bot] merged 1 commit intolinuxdeepin:masterfrom
mhduiy:ani

Conversation

@mhduiy
Copy link
Contributor

@mhduiy mhduiy commented Mar 17, 2026

Changed animation durations for folder icon scaling and positioning to create smoother visual transitions. The scale animation duration increased from 400ms to 600ms, while the x and y position animations increased from 400ms to 800ms. This provides a more deliberate and polished feel when folder icons animate into their grid positions, enhancing the overall user experience with smoother motion.

style: 调整文件夹图标动画持续时间

修改了文件夹图标缩放和定位的动画持续时间,以创建更平滑的视觉过渡。缩放动
画持续时间从400毫秒增加到600毫秒,而x和y位置动画从400毫秒增加到800毫秒。
这使得文件夹图标在动画进入网格位置时具有更从容和精致的感觉,通过更流畅的
运动提升了整体用户体验。

Summary by Sourcery

Adjust folder icon animation timing for smoother transitions when icons move into grid positions.

Enhancements:

  • Increase folder icon scale animation duration to create a more gradual zoom effect.
  • Lengthen folder icon position animations on the x and y axes for a slower, smoother motion into place.

@sourcery-ai
Copy link

sourcery-ai bot commented Mar 17, 2026

Reviewer's guide (collapsed on small PRs)

Reviewer's Guide

Adjusts the folder icon intro animation timings to use longer durations for scale and position transitions, aiming for smoother, more deliberate motion when icons animate into their grid positions.

File-Level Changes

Change Details Files
Tuned folder icon intro animation durations for scale and x/y position transitions.
  • Increased folder icon scale NumberAnimation duration from 400ms to 600ms while keeping easing and value range intact
  • Increased folder icon x-position NumberAnimation duration from 400ms to 800ms for the intro motion into grid position
  • Increased folder icon y-position NumberAnimation duration from 400ms to 800ms for the intro motion into grid position
qml/IconItemDelegate.qml

Tips and commands

Interacting with Sourcery

  • Trigger a new review: Comment @sourcery-ai review on the pull request.
  • Continue discussions: Reply directly to Sourcery's review comments.
  • Generate a GitHub issue from a review comment: Ask Sourcery to create an
    issue from a review comment by replying to it. You can also reply to a
    review comment with @sourcery-ai issue to create an issue from it.
  • Generate a pull request title: Write @sourcery-ai anywhere in the pull
    request title to generate a title at any time. You can also comment
    @sourcery-ai title on the pull request to (re-)generate the title at any time.
  • Generate a pull request summary: Write @sourcery-ai summary anywhere in
    the pull request body to generate a PR summary at any time exactly where you
    want it. You can also comment @sourcery-ai summary on the pull request to
    (re-)generate the summary at any time.
  • Generate reviewer's guide: Comment @sourcery-ai guide on the pull
    request to (re-)generate the reviewer's guide at any time.
  • Resolve all Sourcery comments: Comment @sourcery-ai resolve on the
    pull request to resolve all Sourcery comments. Useful if you've already
    addressed all the comments and don't want to see them anymore.
  • Dismiss all Sourcery reviews: Comment @sourcery-ai dismiss on the pull
    request to dismiss all existing Sourcery reviews. Especially useful if you
    want to start fresh with a new review - don't forget to comment
    @sourcery-ai review to trigger a new review!

Customizing Your Experience

Access your dashboard to:

  • Enable or disable review features such as the Sourcery-generated pull request
    summary, the reviewer's guide, and others.
  • Change the review language.
  • Add, remove or edit custom review instructions.
  • Adjust other review settings.

Getting Help

Copy link

@sourcery-ai sourcery-ai bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Hey - I've left some high level feedback:

  • Consider extracting the animation durations into shared constants or properties (e.g., on the root or a theme object) so they aren’t hardcoded in multiple NumberAnimation blocks and can be tuned consistently later.
  • If the longer x/y duration compared to scale is intentional for a specific motion feel, it may be worth encoding that relationship (e.g., position duration derived from scale duration) to keep the timing proportions consistent if values change again.
Prompt for AI Agents
Please address the comments from this code review:

## Overall Comments
- Consider extracting the animation durations into shared constants or properties (e.g., on the root or a theme object) so they aren’t hardcoded in multiple NumberAnimation blocks and can be tuned consistently later.
- If the longer x/y duration compared to scale is intentional for a specific motion feel, it may be worth encoding that relationship (e.g., position duration derived from scale duration) to keep the timing proportions consistent if values change again.

Sourcery is free for open source - if you like our reviews please consider sharing them ✨
Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.

@deepin-ci-robot
Copy link

[APPROVALNOTIFIER] This PR is NOT APPROVED

This pull-request has been approved by: mhduiy, wjyrich

The full list of commands accepted by this bot can be found here.

Details Needs approval from an approver in each of these files:

Approvers can indicate their approval by writing /approve in a comment
Approvers can cancel approval by writing /approve cancel in a comment

Changed animation durations for folder icon scaling and positioning
to create smoother visual transitions. The scale animation duration
increased from 400ms to 600ms, while the x and y position animations
increased from 400ms to 800ms. This provides a more deliberate and
polished feel when folder icons animate into their grid positions,
enhancing the overall user experience with smoother motion.

style: 调整文件夹图标动画持续时间

修改了文件夹图标缩放和定位的动画持续时间,以创建更平滑的视觉过渡。缩放动
画持续时间从400毫秒增加到600毫秒,而x和y位置动画从400毫秒增加到800毫秒。
这使得文件夹图标在动画进入网格位置时具有更从容和精致的感觉,通过更流畅的
运动提升了整体用户体验。
@mhduiy
Copy link
Contributor Author

mhduiy commented Mar 18, 2026

/forcemerge

@deepin-bot
Copy link

deepin-bot bot commented Mar 18, 2026

This pr force merged! (status: blocked)

@deepin-bot deepin-bot bot merged commit 113e7e0 into linuxdeepin:master Mar 18, 2026
8 of 11 checks passed
@deepin-ci-robot
Copy link

deepin pr auto review

这段代码修改了 IconItemDelegate.qml 中文件夹图标进入视图时的动画参数,主要是延长了动画的持续时间。以下是对这段代码变更的详细审查和改进建议:

1. 代码逻辑审查

  • 变更内容:修改了三个 NumberAnimationduration 属性。
    • scale 动画:从 400ms 增加到 600ms。
    • xy 位置动画:从 400ms 增加到 800ms。
  • 潜在问题(不同步)
    • scale 动画(600ms)与位置动画(800ms)的时长不一致。这意味着图标在移动到终点后,还会继续缩放 200ms,或者位置先停止,缩放后停止。这可能会导致动画结束时的视觉感觉不够干脆或协调。
    • 如果设计意图是让缩放和位置变化同时开始并同时结束,它们的 duration 应该保持一致。

2. 代码质量

  • 硬编码:动画时长(600, 800)是硬编码的魔法数字。如果项目中其他地方有类似的动画标准(例如统一的“快速”、“慢速”动画常量),建议提取为常量或属性,以便于统一调整风格。
  • 代码重复xy 的动画配置完全一致(除了属性名)。如果动画逻辑变得更复杂,可以考虑使用 ParallelAnimation 组合它们,或者定义一个通用的动画组件,但目前这种写法在 QML 中也是常见的,可读性尚可。

3. 代码性能

  • 动画耗时增加:将动画时长从 400ms 增加到 600-800ms,意味着 UI 线程需要更长时间来处理这些属性更新。
  • 影响:虽然 800ms 本身不长,但如果用户快速连续操作(例如快速打开多个文件夹),较长的动画时长可能会导致视觉上的滞后感,或者造成动画堆叠,增加 CPU/GPU 负担。
  • 建议:确保在动画未结束时处理新的交互逻辑(例如用户再次点击),避免动画冲突或卡顿。

4. 代码安全

  • 此处不涉及内存安全或数据安全风险。
  • 健壮性:如果 iconItem.getItemX(index)getItemY(index) 返回无效值或未定义,动画可能会表现异常。建议确保这些函数的返回值始终有效。

改进建议

建议 1:统一动画时长

如果希望图标的位置和缩放同时完成,建议将 duration 统一。

// 统一为 800ms
NumberAnimation {
    target: folderIcon
    property: "scale"
    from: folderIcon.introScale
    to: (itemWidth / root.maxIconSizeInFolder) * root.iconScaleFactor
    duration: 800  // 修改为与位置动画一致
    easing.type: Easing.OutExpo
}

或者,如果希望缩放快于移动(一种常见的“先到位后微调”的效果),目前的 600ms vs 800ms 是可行的,但需要确认这是预期的视觉效果。

建议 2:提取动画配置

为了提高可维护性,可以在根组件或单例中定义动画时长。

// 在 Control 或根组件中定义
readonly property int folderAnimDuration: 800
readonly property int folderScaleDuration: 600 // 如果确实需要不同

// 在动画中使用
NumberAnimation {
    // ...
    duration: root.folderAnimDuration
    // ...
}

建议 3:使用 ParallelAnimation 明确意图

如果这两个动画是紧密相关的,使用 ParallelAnimation 可以使结构更清晰,虽然对于简单的两个属性来说,直接写在 BehaviorTransition 中也是可以的。

ParallelAnimation {
    NumberAnimation { target: folderIcon; property: "scale"; ...; duration: 800 }
    NumberAnimation { target: folderIcon; property: "x"; ...; duration: 800 }
    NumberAnimation { target: folderIcon; property: "y"; ...; duration: 800 }
}

总结

这段代码的修改主要是为了调整动画的节奏,使其更慢、更平滑。主要的改进点在于确认 scaleposition 动画时长不一致是否符合设计预期。如果不符合,应统一时长以保证动画的协调性。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants