草庐IT

feTurbulence

全部标签

实现一个会动的鸿蒙 LOGO

本文将带大家简单实现一个会动的鸿蒙LOGO。emmm,写本文的动机是之前在掘金看到一篇实现鸿蒙LOGO的文章--产品经理:鸿蒙那个开场动画挺帅的给咱们页面也整一个呗鸿蒙的LOGO本身是这样的:该篇作者最终实现的是一个字母O的动画展开过程:而本文想尝试的,是该LOGO的其他一些细节,核心是倒影部分的水波效果。实现主体首先,我们需要对该结构进行简单的一个拆解,因为上下部分的较大差异,虽然是一个圆,但是很明显需要分成两块处理,这部分比较简单且不是重点,我就略过分享,直接上代码。我们的结构大致如下:@importurl('https://fonts.googleapis.com/css2?family

实现一个会动的鸿蒙 LOGO

本文将带大家简单实现一个会动的鸿蒙LOGO。emmm,写本文的动机是之前在掘金看到一篇实现鸿蒙LOGO的文章--产品经理:鸿蒙那个开场动画挺帅的给咱们页面也整一个呗鸿蒙的LOGO本身是这样的:该篇作者最终实现的是一个字母O的动画展开过程:而本文想尝试的,是该LOGO的其他一些细节,核心是倒影部分的水波效果。实现主体首先,我们需要对该结构进行简单的一个拆解,因为上下部分的较大差异,虽然是一个圆,但是很明显需要分成两块处理,这部分比较简单且不是重点,我就略过分享,直接上代码。我们的结构大致如下:@importurl('https://fonts.googleapis.com/css2?family