最终效果:
cc.Graphics绘制的规律是把其父级控件的左下角设置为(0,0)开始绘制,所以适当调整自己的位置
实现代码:
import {
texBgInter } from "./textBgInter";
const {
ccclass, property } = cc._decorator;
@ccclass
export default class TextBg extends cc.Component implements texBgInter {
@property(cc.Node)
text: cc.Node = null;
@property(cc.Node)
down: cc.Node = null;
@property(cc.Node)
up: cc.Node = null;
private downGraphics: cc.Graphics = null;
private upGraphics: cc.Graphics = null;
private textLabel: cc.Label = null;
private lineWidth = 1; //线条宽度
onLoad