绘制扇形和弧
This commit is contained in:
ckcz123
parent
d1a1f223f1
commit
1feccfc185
@ -432,6 +432,8 @@ action
|
||||
| strokePolygon_s
|
||||
| fillEllipse_s
|
||||
| strokeEllipse_s
|
||||
| fillArc_s
|
||||
| strokeArc_s
|
||||
| drawImage_s
|
||||
| drawImage_1_s
|
||||
| drawIcon_s
|
||||
@ -2368,6 +2370,35 @@ var code = '{"type": "strokeEllipse", "x": '+PosString_0+', "y": '+PosString_1+'
|
||||
return code;
|
||||
*/;
|
||||
|
||||
fillArc_s
|
||||
: '绘制扇形' '中心' 'x' PosString 'y' PosString '半径' PosString '起点角度' PosString '终点角度' PosString '颜色' ColorString? Colour Newline
|
||||
|
||||
/* fillArc_s
|
||||
tooltip : fillArc：绘制扇形
|
||||
helpUrl : https://h5mota.com/games/template/_docs/#/event?id=fillEllipse%ef%bc%9a%e7%bb%98%e5%88%b6%e5%9c%86
|
||||
colour : this.subColor
|
||||
default : ["0","0","100","0","90","",null,""]
|
||||
ColorString_0 = ColorString_0 ? (', "style": ['+ColorString_0+']') : '';
|
||||
var code = '{"type": "fillArc", "x": '+PosString_0+', "y": '+PosString_1+', "r": '+PosString_2+', "start": '+PosString_3+', "end": '+PosString_4+ColorString_0+'},\n';
|
||||
return code;
|
||||
*/;
|
||||
|
||||
|
||||
strokeArc_s
|
||||
: '绘制弧' '中心' 'x' PosString 'y' PosString '半径' PosString '起点角度' PosString '终点角度' PosString '颜色' ColorString? Colour '线宽' IntString? Newline
|
||||
|
||||
/* strokeArc_s
|
||||
tooltip : strokeArc：绘制弧
|
||||
helpUrl : https://h5mota.com/games/template/_docs/#/event?id=fillEllipse%ef%bc%9a%e7%bb%98%e5%88%b6%e5%9c%86
|
||||
colour : this.subColor
|
||||
default : ["0","0","100","0","90","",null,""]
|
||||
ColorString_0 = ColorString_0 ? (', "style": ['+ColorString_0+']') : '';
|
||||
IntString_0 = IntString_0 ? (', "lineWidth": '+IntString_0) : '';
|
||||
var code = '{"type": "strokeArc", "x": '+PosString_0+', "y": '+PosString_1+', "r": '+PosString_2+', "start": '+PosString_3+', "end": '+PosString_4+ColorString_0+IntString_0+'},\n';
|
||||
return code;
|
||||
*/;
|
||||
|
||||
|
||||
|
||||
drawImage_s
|
||||
: '绘制图片' EvalString '起点像素' 'x' PosString 'y' PosString '宽' PosString? '高' PosString? Newline
|
||||
@ -3702,6 +3733,18 @@ ActionParser.prototype.parseAction = function() {
|
||||
data.x, data.y, data.a, data.b, data.angle, data.style, 'rgba('+data.style+')', data.lineWidth, this.next
|
||||
]);
|
||||
break;
|
||||
case "fillArc": // 绘制弧
|
||||
data.style = this.Colour(data.style);
|
||||
this.next = MotaActionBlocks['fillArc_s'].xmlText([
|
||||
data.x, data.y, data.r, data.start, data.end, data.style, 'rgba('+data.style+')', this.next
|
||||
]);
|
||||
break;
|
||||
case "strokeArc": // 绘制弧
|
||||
data.style = this.Colour(data.style);
|
||||
this.next = MotaActionBlocks['strokeArc_s'].xmlText([
|
||||
data.x, data.y, data.r, data.start, data.end, data.style, 'rgba('+data.style+')', data.lineWidth, this.next
|
||||
]);
|
||||
break;
|
||||
case "drawImage": // 绘制图片
|
||||
if (data.x1 != null && data.y1 != null && data.w1 != null && data.h1 != null) {
|
||||
this.next = MotaActionBlocks['drawImage_1_s'].xmlText([
|
||||
|
||||
@ -204,6 +204,8 @@ editor_blockly = function () {
|
||||
MotaActionBlocks['strokePolygon_s'].xmlText(),
|
||||
MotaActionBlocks['fillEllipse_s'].xmlText(),
|
||||
MotaActionBlocks['strokeEllipse_s'].xmlText(),
|
||||
MotaActionBlocks['fillArc_s'].xmlText(),
|
||||
MotaActionBlocks['strokeArc_s'].xmlText(),
|
||||
MotaActionBlocks['drawImage_s'].xmlText(),
|
||||
MotaActionBlocks['drawImage_1_s'].xmlText(),
|
||||
MotaActionBlocks['drawIcon_s'].xmlText(),
|
||||
@ -706,7 +708,7 @@ function omitedcheckUpdateFunction(event) {
|
||||
var types = [
|
||||
"previewUI_s", "clearMap_s", "clearMap_1_s", "setAttribute_s", "fillText_s",
|
||||
"fillBoldText_s", "fillRect_s", "strokeRect_s", "drawLine_s",
|
||||
"drawArrow_s", "fillPolygon_s", "strokePolygon_s", "fillEllipse_s", "strokeEllipse_s",
|
||||
"drawArrow_s", "fillPolygon_s", "strokePolygon_s", "fillEllipse_s", "strokeEllipse_s", "fillArc_s", "strokeArc_s",
|
||||
"drawImage_s", "drawImage_1_s", "drawIcon_s", "drawBackground_s", "drawSelector_s", "drawSelector_1_s",
|
||||
"waitContext_2"
|
||||
];
|
||||
|
||||
@ -1123,11 +1123,13 @@ events.prototype.__precompile_getArray = function () {
|
||||
];
|
||||
var uievents = [
|
||||
"clearMap", "fillText", "fillBoldText", "fillRect", "strokeRect", "fillEllipse", "strokeEllipse",
|
||||
"drawIcon", "drawSelector", "drawBackground",
|
||||
"fillArc", "strokeArc", "drawIcon", "drawSelector", "drawBackground",
|
||||
];
|
||||
var others = {
|
||||
"fillEllipse": ["a", "b"],
|
||||
"strokeEllipse": ["a", "b"],
|
||||
"fillArc": ["r", "start", "end"],
|
||||
"strokeArc": ["r", "start", "end"],
|
||||
"drawLine": ["x1", "y1", "x2", "y2"],
|
||||
"drawArrow": ["x1", "y1", "x2", "y2"],
|
||||
"drawImage": ["x", "y", "w", "h", "x1", "y1", "w1", "h1"],
|
||||
@ -2222,6 +2224,14 @@ events.prototype._action_strokeEllipse = function (data, x, y, prefix) {
|
||||
this.__action_doUIEvent(data);
|
||||
}
|
||||
|
||||
events.prototype._action_fillArc = function (data, x, y, prefix) {
|
||||
this.__action_doUIEvent(data);
|
||||
}
|
||||
|
||||
events.prototype._action_strokeArc = function (data, x, y, prefix) {
|
||||
this.__action_doUIEvent(data);
|
||||
}
|
||||
|
||||
events.prototype._action_drawLine = function (data, x, y, prefix) {
|
||||
this.__action_doUIEvent(data);
|
||||
}
|
||||
|
||||
33
libs/ui.js
33
libs/ui.js
@ -279,6 +279,39 @@ ui.prototype._uievent_strokeEllipse = function (data) {
|
||||
core.calValue(data.b), (core.calValue(data.angle) || 0) * Math.PI / 180, data.style, data.lineWidth);
|
||||
}
|
||||
|
||||
ui.prototype.fillArc = function (name, x, y, r, start, end, style) {
|
||||
if (style) core.setFillStyle(name, style);
|
||||
var ctx = this.getContextByName(name);
|
||||
if (!ctx) return;
|
||||
ctx.beginPath();
|
||||
ctx.moveTo(x, y);
|
||||
ctx.arc(x, y, r, start, end);
|
||||
ctx.closePath();
|
||||
ctx.fill();
|
||||
}
|
||||
|
||||
ui.prototype._uievent_fillArc = function (data) {
|
||||
this._createUIEvent();
|
||||
this.fillArc('uievent', core.calValue(data.x), core.calValue(data.y), core.calValue(data.r),
|
||||
(core.calValue(data.start) || 0) * Math.PI / 180, (core.calValue(data.end) || 0) * Math.PI / 180, data.style);
|
||||
}
|
||||
|
||||
ui.prototype.strokeArc = function (name, x, y, r, start, end, style, lineWidth) {
|
||||
if (style) core.setStrokeStyle(name, style);
|
||||
if (lineWidth) core.setLineWidth(name, lineWidth);
|
||||
var ctx = this.getContextByName(name);
|
||||
if (!ctx) return;
|
||||
ctx.beginPath();
|
||||
ctx.arc(x, y, r, start, end);
|
||||
ctx.stroke();
|
||||
}
|
||||
|
||||
ui.prototype._uievent_strokeArc = function (data) {
|
||||
this._createUIEvent();
|
||||
this.strokeArc('uievent', core.calValue(data.x), core.calValue(data.y), core.calValue(data.r),
|
||||
(core.calValue(data.start) || 0) * Math.PI / 180, (core.calValue(data.end) || 0) * Math.PI / 180, data.style, data.lineWidth);
|
||||
}
|
||||
|
||||
////// 在某个canvas上绘制一条线 //////
|
||||
ui.prototype.drawLine = function (name, x1, y1, x2, y2, style, lineWidth) {
|
||||
if (style) core.setStrokeStyle(name, style);
|
||||
|
||||
@ -134,7 +134,7 @@
|
||||
70. “显隐勇士”事件指令希望加个淡入淡出时间参数
|
||||
（不处理，请用等待事件） 1. 希望给core.drawTip()和core.playSound()出个同步版本，目前只有异步版本，后者如果要模拟同步就得绑在一个透明动画上
|
||||
（已完成！） 72. “绘制描边文本”事件希望加一个“描边颜色”参数，目前只能描黑边
|
||||
73. 画弧既然有现成的API，那建议也作为UI绘制事件提供。甚至希望提供画椭圆功能（长短轴水平或铅直的那种）参数为中心坐标和长短轴长度
|
||||
（已完成！） 73. 画弧既然有现成的API，那建议也作为UI绘制事件提供。甚至希望提供画椭圆功能（长短轴水平或铅直的那种）参数为中心坐标和长短轴长度
|
||||
（已完成！） 74. “设置画布属性”的基准线建议增加'hanging'和'ideographic'这两种模式
|
||||
（已完成！） 75. 建议修复“绘制多行文本”时行距比字号大不太多会导致各行下缘丢失的bug（加大行距又会导致第一行的纵坐标难以估计），此bug在道具商店和1.3倍行距英文看的很明显
|
||||
（已完成！） 76. （来自群友）建议给第一代全局商店像“显示选择项”一样提供图标、颜色和出现条件
|
||||
|
||||
Loading…
Reference in New Issue
Block a user