马黑黑 发表于 2024-3-30 20:07
嗯，它是内窗往外扩展了
好哒，老师支持我这样的想法呀。。{:4_173:}
马黑黑 发表于 2024-3-30 20:08
是，没问题的。渐变的设置，需要里面的图像去呈现。有空我会讲一讲画布的渐变，一通百通，通则不痛，不通 ...
这个渐变里面太多数据。。。
老师要开课那真是太好了。。
噼里啪啦。。。
{:4_199:}
马黑黑 发表于 2024-3-30 20:19
设计这个，可以放开思维吧。
径向渐变，它是由一个点往外发射。以 400 * 400 的画布为例，假如我们希 ...
gradient.addColorStop(0, 'red');
gradient.addColorStop(0.3, 'blue');
gradient.addColorStop(0.9, 'green');
上面，给 gradient 渐变添加了三种颜色，第一种红色，从 0 开始，到 0.3（30%）止，其他依此方式理解。add 是添加的意思， Color 颜色，Stop 停止，大概意思就是添加一个颜色到它终止的的地方（比如 0.3)。
原来第二行的0.3是上一行红色终止的位置。。。
每一行都是如此，那我就明白你一楼的那么多颜色是什么宽度了。。
马黑黑 发表于 2024-3-30 20:19
设计这个，可以放开思维吧。
径向渐变，它是由一个点往外发射。以 400 * 400 的画布为例，假如我们希 ...
gradient.addColorStop(0, 'red');
gradient.addColorStop(.15, 'orange');
gradient.addColorStop(.3, 'yellow');
gradient.addColorStop(.45, 'green');
gradient.addColorStop(.51,'cyan');
gradient.addColorStop(.85,'blue');
gradient.addColorStop(1,'purple');
我把圆调得大大的，看后面的渐变背景。。
这样就理解每种颜色的宽度了。。
大家都是.15的宽度。。
只有cyan只有.06宽，blue最宽有.26，从图上可以明显看出来{:4_170:}
我的笨法子还是有用滴
马黑黑 发表于 2024-3-30 20:22
可是设置突破画布宽高的渐变
刚明白小数是上一行终止的位置。
(190, 200, 15,200, 200, 280);
突破画布，就是280可以为300的意思么。。
不过显示不出来就变成宽度减少了。。
马黑黑 发表于 2024-3-30 20:23
世界辣么大，俺想去外面挖呀挖
无条件支持哈。
窗外的世界很精彩。。
有彩色渐变还会旋转。。{:4_170:}
不过这个旋转代码可不是之前那么容易看到。。看得烧脑。。歇会儿。。
马黑黑 发表于 2024-3-30 16:29
渐变是整个画布的渐变，在不同区域呈现的图像，只要使用 gradient 填充或描边，色彩都不一样
嗯嗯，而圆在画布上移动，就被填充了不同的色彩。
红影 发表于 2024-3-30 22:36
嗯嗯，而圆在画布上移动，就被填充了不同的色彩。
是这样的
马黑黑 发表于 2024-3-30 16:29
好玩吧
很有趣，我玩了半天呢{:4_173:}
红影 发表于 2024-3-30 22:39
很有趣，我玩了半天呢
贪玩
南无月 发表于 2024-3-30 22:03
无条件支持哈。
窗外的世界很精彩。。
有彩色渐变还会旋转。。
不急的
马黑黑 发表于 2024-3-30 16:30
对，有无限可能
这个真的去琢磨，肯定能得到想不到的效果。
马黑黑 发表于 2024-3-30 16:31
其实在做时钟过程中类似的也有，只是时钟的需求与别的不同，不变展示更多的东东
还真没注意，光顾着看时钟的设置了{:4_173:}
红影 发表于 2024-3-30 22:40
这个真的去琢磨，肯定能得到想不到的效果。
会的
红影 发表于 2024-3-30 22:40
还真没注意，光顾着看时钟的设置了
它里面动的方面有指针的旋转
南无月 发表于 2024-3-30 21:50
刚明白小数是上一行终止的位置。
(190, 200, 15,200, 200, 280);
有时候为了需要。比方讲，让整个画布都充满颜色，不留空白
南无月 发表于 2024-3-30 21:46
gradient.addColorStop(0, 'red');
gradient.addColorStop(.15, 'orange');
gradient.addColor ...
颜色的占比分配因为有颜色的交接，彼此间的影响是有的，强烈的颜色会霸道一些
南无月 发表于 2024-3-30 21:43
gradient.addColorStop(0, 'red');
gradient.addColorStop(0.3, 'blue');
gradient.addColorStop(0.9,...
这个需要慢慢领悟
南无月 发表于 2024-3-30 21:31
这个渐变里面太多数据。。。
老师要开课那真是太好了。。
噼里啪啦。。。
但是这个我估计也讲的不好
南无月 发表于 2024-3-30 21:30
好哒，老师支持我这样的想法呀。。
都可以尝试的