V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
0gre2019
V2EX  ›  Electron

很奇怪有些软件是怎么实现 Win10 那个小点点 Loading 动画的

  •  
  •   0gre2019 ·
    Fijiisland · 2019-12-29 20:16:22 +08:00 · 4756 次点击
    这是一个创建于 1773 天前的主题,其中的信息可能已经有所发展或是发生改变。

    就是这个点构成的圈圈 image

    的横向版本(在 Win10 设置-游戏-Xbox 网络里有直观的效果)

    比如说杀毒软件 ESET NOD32,我知道它最新版本界面是 Electron 写的,但它也有这种横向小点 Loading 加速度动画,这是调用了 Windows 的啥 Api 还是 ESET 自己用 AE 画的帧序列= =

    愣是没找着例子 (哭)

    9 条回复    2020-01-01 17:09:20 +08:00
    summerwar
        1
    summerwar  
       2019-12-29 20:19:37 +08:00
    这就是个 gif 图片,放到 loading 页面上就可以了
    geelaw
        2
    geelaw  
       2019-12-29 20:20:31 +08:00
    楼主贴的图和 Windows 的实现不同。Windows 的实现是从底部出现,转两圈后在底部消失。

    有很多 CSS 模拟实现,想要精确找到 Windows 实现的缓动函数也不是很困难。
    xxpandxxp
        3
    xxpandxxp  
       2019-12-29 20:21:08 +08:00 via Android
    @summerwar #1 不是 gif 吧,有时候看到这几个点会卡,会重合
    0gre2019
        4
    0gre2019  
    OP
       2019-12-29 20:25:31 +08:00
    ESET 那个效果卡卡的,可能是 gif ;但另一款叫 MacDrive 的实现的效果感觉就像原生的 Win10 动画,流畅至死
    yzwduck
        5
    yzwduck  
       2019-12-29 20:28:43 +08:00   ❤️ 1
    Windows 的安装程序里,它把每一帧动画都做成字体的一个字符。
    0gre2019
        6
    0gre2019  
    OP
       2019-12-29 20:30:00 +08:00
    @yzwduck 惊了
    miyuki
        7
    miyuki  
       2019-12-30 00:05:30 +08:00 via Android
    efaun
        8
    efaun  
       2019-12-30 00:20:32 +08:00 via Android
    @geelaw 从底部消失是 feature 吗😂,我一直以为是我电脑太卡了,显示不出来
    0gre2019
        9
    0gre2019  
    OP
       2020-01-01 17:09:20 +08:00
    找到一个第三方库,基于.net 的,叫 MahApp.Metro

    https://github.com/MahApps/MahApps.Metro

    里面的 MetroProgressBar.xmal 和 ProgressRing.xmal 都实现了原生 Win10 的 Loading 动效,几乎一模一样,是纯代码绘制的。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   1237 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 32ms · UTC 23:24 · PVG 07:24 · LAX 15:24 · JFK 18:24
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.