introduction 更多控件用法，请参考 here 和 源码。 本文的代码基于这里 本文将介绍3个控件: slider,progress和circleprogress.具体的用法，请参考源码提供的函数。 本文演示结果：滑动滑块，进度条和环形进度条随着slider的值变化而变化。 样式 xml文 ...
分类：
其他好文 时间：
2020-12-16 12:46:27
阅读次数：
3
环形进度条的问题，网上有很多的demo，也有各种不同的实现方式，很棒的实现也有很多，我这自己做一下一方面是想开阔一下自己的思路，一方面好久没看SVG和Canvas的东西了，基础的拿来熟悉下。 DIV + CSS3 这个是最基本的实现方式，我在想怎样用尽量少的DOM结构来实现，最终还是用了三个div， ...
分类：
其他好文 时间：
2020-05-17 23:08:18
阅读次数：
98
html部分 <view class="qcard" v-for="(item, k) in listData" :key="k"> <view class="ql"> <view class="tu" > <!-- 环形进度条 canvas --> <canvas :canvas-id="'can ...
分类：
微信 时间：
2020-04-09 12:26:14
阅读次数：
551
文章目录万能居中BFC优化盒模型哪两种模式？什么区别？如何设置常用清除浮动的方法，如不清除浮动会怎样？删格化的原理纯css实现三角形高度不定，宽100%，内一p高不确定，如何实现垂直居中？至少两种方式实现自适应搜索设置一段文字的大小为6pxcss菊花图关于em关于vh,vwFlex布局overflow原理实现自适应的正方形:标准模式和怪异模式CSS3实现环形进度条css优先级万能居中1.margi
分类：
Web程序 时间：
2020-04-01 10:32:46
阅读次数：
102
周末好，今天给大家带来一款接地气的环形进度条组件vue-awesome-progress。 ...
分类：
其他好文 时间：
2019-11-09 13:28:13
阅读次数：
102
本次案例主要使用了svg的三个元素，分别为 、`text path`，关于svg的介绍大家可以看MDN上的相关教程， "传送门" 由于svg可以写到HTML中，所以这里我们就可以很方便的做进度条加载动画啦，这次案例以vue来做数据交互 svg的viewBox viewBox属性定义了画布上可以显示的 ...
分类：
其他好文 时间：
2019-05-30 18:01:00
阅读次数：
410
前言 环形进度条，用来展示当前进度，为了满足大屏UI的需要特意定制，以前有个叫圆环进度条，不能满足项目需要，只能重新定做，以前的进度间距不能自适应分辨率，而且当前进度对应的反的进度不能单独设置颜色，即当前进度90%，剩余的10%也需要设置成不同的颜色，还有一个重要的功能是，能够指定多个警戒值，一旦超 ...
分类：
其他好文 时间：
2019-05-02 09:15:18
阅读次数：
138
效果图 原理剖析 1.先完成这样一个半圆（这个很简单吧） 2.overflow: hidden; 3.在中间定位一个白色的圆形做遮挡 4.完成另一半 5.使用animate配合时间完成衔接 源码 ...
分类：
Web程序 时间：
2018-12-19 11:09:31
阅读次数：
190
环形进度条是基于svg实现的。 逻辑的实现： ...
分类：
其他好文 时间：
2018-06-14 11:21:10
阅读次数：
135
css 部分使用 svg 绘制环形 此处的 js 放在 body 标签中 ...
分类：
Web程序 时间：
2018-03-05 14:09:18
阅读次数：
292
