mirror of
https://github.com/smallmain/cocos-enhance-kit.git
synced 2025-10-09 20:15:23 +00:00
完善 docs
This commit is contained in:
SmallMain
129
extension/v1.0.0/service-pack-support/inspectors/comps/label.js
Normal file
129
extension/v1.0.0/service-pack-support/inspectors/comps/label.js
Normal file
@@ -0,0 +1,129 @@
|
||||
"use strict";
|
||||
Vue.component("cc-label", {
|
||||
dependencies: ["packages://inspector/share/blend.js"],
|
||||
template: `
|
||||
<ui-prop
|
||||
v-prop="target.string"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop
|
||||
v-prop="target.horizontalAlign"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop
|
||||
v-prop="target.verticalAlign"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
|
||||
<ui-prop
|
||||
v-prop="target.actualFontSize"
|
||||
v-show="!_hiddenActualFontSize()"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop type="number"
|
||||
v-prop="target.fontSize">
|
||||
:multi-values="multi"
|
||||
</ui-prop>
|
||||
<ui-prop
|
||||
v-prop="target._bmFontOriginalSize"
|
||||
v-show="_isBMFont()"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
|
||||
<ui-prop
|
||||
v-prop="target.lineHeight"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop
|
||||
v-prop="target.spacingX"
|
||||
v-show="_isBMFont()"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop
|
||||
v-prop="target.overflow"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop
|
||||
v-prop="target.enableWrapText"
|
||||
v-show="!_hiddenWrapText()"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop
|
||||
v-prop="target.font"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop
|
||||
v-prop="target.fontFamily"
|
||||
v-show="_isSystemFont()"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop
|
||||
v-prop="target.enableBold"
|
||||
v-show="!_isBMFont()"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop
|
||||
v-prop="target.enableItalic"
|
||||
v-show="!_isBMFont()"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop
|
||||
v-prop="target.enableUnderline"
|
||||
v-show="!_isBMFont()"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop
|
||||
v-prop="target.underlineHeight"
|
||||
v-show="!_isBMFont() && target.enableUnderline.value === true"
|
||||
:indent="1"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop
|
||||
v-prop="target.cacheMode"
|
||||
v-show="!_isBMFont()"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop
|
||||
v-prop="target.useSystemFont"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
|
||||
<cc-blend-section :target.sync="target"></cc-blend-section>
|
||||
<cc-array-prop
|
||||
v-show="!_isCharCacheMode()"
|
||||
:target.sync="target.materials"
|
||||
></cc-array-prop>
|
||||
|
||||
<ui-prop v-prop="target.autoSwitchMaterial"></ui-prop>
|
||||
<ui-prop v-prop="target.allowDynamicAtlas"></ui-prop>
|
||||
<ui-prop v-prop="target.enableRetina"></ui-prop>
|
||||
`,
|
||||
props: {
|
||||
target: {
|
||||
twoWay: !0,
|
||||
type: Object
|
||||
},
|
||||
multi: {
|
||||
type: Boolean
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
T: Editor.T,
|
||||
_isBMFont() {
|
||||
return this.target._bmFontOriginalSize.value > 0
|
||||
},
|
||||
_isSystemFont() {
|
||||
return this.target.useSystemFont.value
|
||||
},
|
||||
_hiddenWrapText() {
|
||||
let t = this.target.overflow.value;
|
||||
return 0 === t || 3 === t
|
||||
},
|
||||
_hiddenActualFontSize() {
|
||||
return 2 !== this.target.overflow.value
|
||||
},
|
||||
_isCharCacheMode() {
|
||||
return 2 === this.target.cacheMode.value
|
||||
},
|
||||
}
|
||||
});
|
||||
@@ -0,0 +1,73 @@
|
||||
"use strict";
|
||||
Vue.component("cc-richtext", {
|
||||
template: `
|
||||
<ui-prop
|
||||
v-prop="target.string"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop
|
||||
v-prop="target.horizontalAlign"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop
|
||||
v-prop="target.fontSize">
|
||||
:multi-values="multi"
|
||||
</ui-prop>
|
||||
<ui-prop
|
||||
v-prop="target.font"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop
|
||||
v-prop="target.fontFamily"
|
||||
v-show="_isSystemFont()"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop
|
||||
v-prop="target.useSystemFont"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop
|
||||
v-prop="target.cacheMode"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop
|
||||
v-prop="target.maxWidth"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop
|
||||
v-prop="target.lineHeight"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop
|
||||
v-prop="target.imageAtlas"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop
|
||||
v-prop="target.handleTouchEvent"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
|
||||
<ui-prop v-show="!_isCharCacheMode()" v-prop="target.customMaterial"></ui-prop>
|
||||
<ui-prop v-prop="target.autoSwitchMaterial"></ui-prop>
|
||||
<ui-prop v-prop="target.allowDynamicAtlas"></ui-prop>
|
||||
<ui-prop v-prop="target.enableRetina"></ui-prop>
|
||||
`,
|
||||
props: {
|
||||
target: {
|
||||
twoWay: !0,
|
||||
type: Object
|
||||
},
|
||||
multi: {
|
||||
type: Boolean
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
T: Editor.T,
|
||||
_isSystemFont() {
|
||||
return this.target.useSystemFont.value
|
||||
},
|
||||
_isCharCacheMode() {
|
||||
return 2 === this.target.cacheMode.value
|
||||
},
|
||||
}
|
||||
});
|
||||
155
extension/v1.0.0/service-pack-support/inspectors/comps/sprite.js
Normal file
155
extension/v1.0.0/service-pack-support/inspectors/comps/sprite.js
Normal file
@@ -0,0 +1,155 @@
|
||||
"use strict";
|
||||
Vue.component("cc-sprite", {
|
||||
dependencies: ["packages://inspector/share/blend.js"],
|
||||
template: `
|
||||
<ui-prop
|
||||
style="padding-top: 8px"
|
||||
name="Atlas"
|
||||
tooltip="{{T('COMPONENT.sprite.atlas')}}"
|
||||
>
|
||||
<ui-asset class="flex-1"
|
||||
type="sprite-atlas"
|
||||
v-value="target._atlas.value.uuid"
|
||||
v-values="atlasUuids"
|
||||
:multi-values="atlasMulti"
|
||||
></ui-asset>
|
||||
<ui-button
|
||||
class="blue tiny"
|
||||
tooltip="{{T('COMPONENT.sprite.select_tooltip')}}"
|
||||
@confirm="selectAtlas"
|
||||
>
|
||||
{{T('COMPONENT.sprite.select_button')}}
|
||||
</ui-button>
|
||||
</ui-prop>
|
||||
|
||||
<ui-prop
|
||||
style="padding-top: 8px"
|
||||
name="Sprite Frame"
|
||||
tooltip="{{T('COMPONENT.sprite.sprite_frame')}}"
|
||||
>
|
||||
<ui-asset class="flex-1"
|
||||
type="sprite-frame"
|
||||
v-value="target.spriteFrame.value.uuid"
|
||||
v-values="spriteUuids"
|
||||
:multi-values="spriteMulti"
|
||||
></ui-asset>
|
||||
<ui-button
|
||||
class="blue tiny"
|
||||
tooltip="{{T('COMPONENT.sprite.edit_tooltip')}}"
|
||||
@confirm="editSprite"
|
||||
>
|
||||
{{T('COMPONENT.sprite.edit_button')}}
|
||||
</ui-button>
|
||||
</ui-prop>
|
||||
|
||||
<ui-prop
|
||||
v-prop="target.type"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
|
||||
<div v-if="isFilledType()">
|
||||
<ui-prop indent=1
|
||||
v-prop="target.fillType"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop indent=1
|
||||
v-prop="target.fillCenter"
|
||||
v-disabled="!isRadialFilled()"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop indent=1
|
||||
v-prop="target.fillStart"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop indent=1
|
||||
v-prop="target.fillRange"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
</div>
|
||||
|
||||
<ui-prop
|
||||
v-prop="target.sizeMode"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
<ui-prop v-if="allowTrim()"
|
||||
v-prop="target.trim"
|
||||
:multi-values="multi"
|
||||
></ui-prop>
|
||||
|
||||
<cc-blend-section :target.sync="target"></cc-blend-section>
|
||||
<cc-array-prop :target.sync="target.materials"></cc-array-prop>
|
||||
|
||||
<ui-prop v-prop="target.autoSwitchMaterial"></ui-prop>
|
||||
<ui-prop v-prop="target.allowDynamicAtlas"></ui-prop>
|
||||
`,
|
||||
props: {
|
||||
target: {
|
||||
twoWay: !0,
|
||||
type: Object
|
||||
},
|
||||
multi: {
|
||||
twoWay: !0,
|
||||
type: Boolean
|
||||
}
|
||||
},
|
||||
data: ()=>({
|
||||
atlasUuid: "",
|
||||
atlasUuids: "",
|
||||
atlasMulti: !1,
|
||||
spriteUuid: "",
|
||||
spriteUuids: "",
|
||||
spriteMulti: !1
|
||||
}),
|
||||
created() {
|
||||
this.target && (this._updateAtlas(),
|
||||
this._updateSprite())
|
||||
},
|
||||
watch: {
|
||||
target() {
|
||||
this._updateAtlas(),
|
||||
this._updateSprite()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
T: Editor.T,
|
||||
selectAtlas() {
|
||||
Editor.Ipc.sendToPanel("assets", "change-filter", "t:sprite-atlas")
|
||||
},
|
||||
editSprite() {
|
||||
Editor.Panel.open("sprite-editor", {
|
||||
uuid: this.target.spriteFrame.value.uuid
|
||||
})
|
||||
},
|
||||
allowTrim() {
|
||||
return this.target.type.value === cc.Sprite.Type.SIMPLE
|
||||
},
|
||||
isFilledType() {
|
||||
return this.target.type.value === cc.Sprite.Type.FILLED
|
||||
},
|
||||
isRadialFilled() {
|
||||
return this.target.fillType.value === cc.Sprite.FillType.RADIAL
|
||||
},
|
||||
_updateAtlas() {
|
||||
if (!this.target)
|
||||
return this.atlasUuid = "",
|
||||
this.atlasUuids = "",
|
||||
this.atlasMulti = !1,
|
||||
void 0;
|
||||
this.atlasUuid = this.target._atlas.value.uuid,
|
||||
this.atlasUuids = this.target._atlas.values.map(t=>t.uuid);
|
||||
var t = this.atlasUuids[0];
|
||||
this.atlasMulti = !this.atlasUuids.every((i,e)=>0 === e || i === t)
|
||||
},
|
||||
_updateSprite() {
|
||||
if (!this.target)
|
||||
return this.spriteUuid = "",
|
||||
this.spriteUuids = "",
|
||||
this.spriteMulti = !1,
|
||||
void 0;
|
||||
this.spriteUuid = this.target.spriteFrame.value.uuid,
|
||||
this.spriteUuids = this.target.spriteFrame.values.map(t=>t.uuid);
|
||||
var t = this.spriteUuids[0];
|
||||
this.spriteMulti = !this.spriteUuids.every((i,e)=>0 === e || i === t)
|
||||
}
|
||||
}
|
||||
});
|
||||
Reference in New Issue
Block a user