刷新
记录--怎么实现一个3d翻书效果

博主头像 这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 本篇主要讨论以下两种翻书动画的实现: 第一种是整页翻转的效果: 这种整页翻转的效果主要是做rotateY的动画,并结合一些CSS的3d属性实现。 第二种折线翻转的效果,如下图所示: 主要是通过计算页面翻折过来的位置。 这两种原理上都不是很 ...

百亿补贴通用H5导航栏方案

博主头像 在移动端页面中,由于屏幕空间有限,导航条扮演着非常重要的角色,提供了快速导航到不同页面或功能的方式。用户也通常会在导航条中寻找他们感兴趣的内容,因此导航条的曝光率较高。在这样的背景下,提供一个动态灵活的导航条,为产品赋能,变得尤其重要。 ...

记录--一个炫酷的css动画

博主头像 这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 最近有一个需求,要我实现一个动画效果,效果如下 简单分析了一下效果,是一个3d的效果,首先是一个圆,接着是两段圆环,第三层是一堆小圆环,最里面是一些线上运动,有着渐变色的矩形。 第一层的圆环很简单。 第二层的圆环其实也挺简单的,只要在设置 ...

Flutter系列文章-Flutter应用优化

博主头像 当涉及到优化 Flutter 应用时,考虑性能、UI 渲染和内存管理是至关重要的。在本篇文章中,我们将通过实例深入讨论这些主题,展示如何通过优化技巧改进你的 Flutter 应用。 ...

Flutter系列文章-Flutter 插件开发

博主头像 在本篇文章中,我们将学习如何开发 Flutter 插件,实现 Flutter 与原生平台的交互。我们将详细介绍插件的开发过程,包括如何创建插件项目、实现方法通信、处理异步任务等。最后,我们还将演示如何将插件打包并发布到 Flutter 社区。 ...

记录--如何用canvas画出验证码

博主头像 这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 相信在平时的工作中,canvas肯定是我们不可或缺的伙伴,有很多业务场景都需要他来完成,闲来无事,今天我们就先说一下canvas如何画出验证码 首先,我们应该有一个canvas标签(注意:可以标签里面设置宽高,也可以在js里面设置,但是不 ...

Pixi.js的使用整理

最近在做的一个前端项目中,有一些图像的处理操作(3D图,2D图都有),其中3D图也是通过获取后端服务的图像2D数据进行绘制展示,通过鼠标各种操作调用后端服务来进行重新获取新图数据。这里前端设计到图像的操作使用了PIXIJS,这里将使用的方式做一个说明,以作参考。 首先pixijs的官网:https: ...

记录--用css画扇形菜单

博主头像 这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 1、效果图 用手机录屏再用小程序转换的gif,可能精度上有点欠缺。 2、实现过程 1、观察及思考 开始编码前我们首先观察展开后的结构:两个四分之一的圆加三个圆形菜单项。 文章名为用css画扇形,如上图所示没有任何Javascript辅助却 ...

Flutter系列文章-Flutter UI进阶

博主头像 在本篇文章中,我们将深入学习 Flutter UI 的进阶技巧,涵盖了布局原理、动画实现、自定义绘图和效果、以及 Material 和 Cupertino 组件库的使用。通过实例演示,你将更加了解如何创建复杂、令人印象深刻的用户界面。 ...

记录--使用 JS 实现基本的截图功能

博主头像 这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 思路分析 在开始动手之前,分析一下整个功能的实现过程: 根据图片大小创建 canvas1 画布,并将原图片直接定位在 canvas1 上; 在画布上添加一个蒙层,以区分当前 canvas 图像是被裁剪的原图像; 在蒙层上方,对裁剪区域(鼠 ...

h5(html5)+css3前端笔记二

博主头像 ###HTML标签 ####一、表格标签 表格的主要作用: 表格主要用于**显示、展示数据**,因为它可以让数据显示的非常的规整,可读性非常好。特别是后台展示数据的时候,能够熟练运用表格就显得很重要。一个清爽简约的表格能够把繁杂的数据表现得很有条理。 1.``用来定义表格的标签。 2.``用来定义行 ...

记录--canvas 复刻锤子时钟

博主头像 这里给大家分享我在网上总结出来的一些知识,希望对大家有所帮助 介绍 canvas:使用脚本 (通常为 JavaScript) 来绘制图形的 HTML 元素。 本人遍历了以下两份文档,学习完就相当于有了笔和纸,至于最后能画出什么,则需要在 canvas 应用方面进一步学习。 MDN 的 Canvas ...

Flutter系列文章-Flutter进阶2

博主头像 在本篇文章中,我们详细介绍了 Flutter 进阶的主题,包括导航和路由、状态管理、异步处理、HTTP请求和Rest API,以及数据持久化。这些主题在实际应用中都非常重要,帮助你构建更复杂、功能更强大的 Flutter 应用。 ...

长连接:chatgpt流式响应背后的逻辑

博主头像 提起长连接,我们并不陌生,最常见的长连接非websocket莫属了。即使没有在项目中实际用过,至少也应该有所接触。长连接指在一次网络通信中,客户端与服务器之间建立一条持久的连接,可以在多次请求和响应中重复使用该连接。 ...

Flutter系列文章-Flutter进阶

博主头像 通过本文的学习,你已经了解了Flutter的高级主题,包括处理用户交互、创建动画以及访问网络数据等。这些知识将帮助你更深入地掌握Flutter的开发能力,为你的应用添加更多功能和交互体验。希望本文对你的Flutter学习之旅有所帮助,祝你在Flutter的世界中取得更多成功! ...

Flutter系列文章-Flutter基础

博主头像 Flutter是Google推出的一种新的移动应用开发框架,允许开发者使用一套代码库同时开发Android和iOS应用。它的设计理念、框架结构、以及对Widget的使用,都让开发者能更有效率地创建高质量的应用。 ...

Html利用Canvas绘制图形

博主头像 今天接到粉丝私信,询问是否可以通过Canvas绘制一些图形,然后根据粉丝提供的模板图,通过Canvas进行模拟绘制,通过分析发现,图形虽然相对简单,但是如果不借助相应的软件,纯代码绘制还是稍微费些时间。今天将绘制图形源码分享出来,仅供学习分享之用,如有不足之处,还请指正。 ...

H5 WebGL实现水波特效

# 前言 零几年刚开始玩电脑的时候,经常在安装程序上看到一种水波特效,鼠标划过去的时候,就像用手在水面划过一样,感觉特别有意思。但是后来,就慢慢很少见过这种特效了。最近突然又想起了这种特效,于是开始折磨怎么实现这种效果。 # 思路 我们知道,水波的运动轨迹可以看成随时间变化的三角函数,那么我们可以记 ...