Combination properties by array

Hi all,

How can I create combination properties by array on Cocos creator, like cc.Button Click Events property.

Thanks in advance.
-Hiroki

This is the code of cc.Button Click Events property:

clickEvents: {
                    default: [],
                    type: cc.Component.EventHandler,
                    tooltip: "i18n:COMPONENT.button.click_events"
}

https://github.com/cocos-creator/creator-docs/blob/master/en/scripting/class.md

2 Likes

Thanks! I have realized it as below.
Also it was great learning for me to knew checking here for programing references.

var DebugMenuItem = cc.Class({
    properties: {
    NAME: '',
    ViewFunc: cc.Component,
    Flag: false,
},
ctor: function () {
    cc.log('DebugMenuItem Constructor');
    this.name = '';
    this.ViewFunc = null;
    this.Flag = false;
},

cc.Class({
    extends: cc.Component,
    properties: {
        DebugItems: {
            default: [],
            type: [DebugMenuItem],
       },
 //

Every time I updated script, the properties link become null, even if I didn’t edit the properties part. It is time wasting since I’m under developing.
20
Is there any way to avoid this? Or is this the thing I cannot do anything?

Thanks.
-Hiroki

You need set name of class.

var DebugMenuItem = cc.Class({
        name: 'DebugMenuItem',
        properties: {
        NAME: '',
        ViewFunc: cc.Component,
        Flag: false,
},
1 Like

Thanks! This solved problem!
-Hiroki

Any idea how to make it works with TypeScript?

const {ccclass, property} = cc._decorator;

@ccclass
export default class DebugMenuItem {
    
    public name:string = "DebugMenuItem";

    @property(cc.Prefab)
    public somePrefab: cc.Prefab = null;

    @property(cc.Float)
    someNumber: number = 10;
}

I have same as above errors with serialization, and I’m getting 5512 error (Can not serialize ‘x.y’ because the specified type is anonymous, please provide a class name or set the ‘serializable’ attribute of ‘x.y’ to ‘false’.)

I have tried many variations of name variable, as a function, or getter, however nothing has worked. Could you please give me some advice how to do it properly in Typescript?

3 Likes

I would also be interested in knowing this for TypeScript. I’m sure I can figure it out, but a good overall documentation about the properties and all it’s possibilities and the notify- functionality that can run a function to show/hide elements depending on selections would be AWESOME to have. Could take a long time to just figure it out yourself… :frowning:

Thank you! :slight_smile:

@slackmoehrle do you have some documentation in English or Chinese about how to create a similar component like the cc.button click events?
18

  • How to get several selections on one row?
  • How to get several option properties within one array

Typescript examples would be amazing, but JavaScript examples would help as well. This would be so useful to know to build clean custom components! :slightly_smiling_face: Thanks!

1 Like

Let me ask the team for thoughts on this @jare

3 Likes

Is there any explanation to make custom components which can update its options/menus in editor.

I need to make a component which looks up the scene and finds some list of nodes and show node names as menu options in the component property panel.

Classes in TypeScript for Cocos Creator are created in different way. You should give class name as parameter in class decorator: :slight_smile:

const {ccclass, property} = cc._decorator;

@ccclass("DebugMenuItem")
export default class DebugMenuItem {
    @property(cc.Prefab)
    public somePrefab: cc.Prefab = null;

    @property(cc.Float)
    someNumber: number = 10;
}
1 Like

Typescript

@property(cc.AudioClip)
showAudio: Array<cc.AudioClip> = [];
@property([cc.Label])
comboLabels: cc.Label[] = [];

@phero_constructs

But what if you have a custom cocos property class with for example one cc.Label and one cc.AudioClip and you want to create an array of that custom cocos property class.

@property([CustomPropertyClass])
comboCustomPropertyClass: CustomPropertyClass[] = [];

or how I usually do it:

@property({ type: CustomPropertyClass[], displayName: 'My Custom Property Class Array'})
comboCustomPropertyClass: CustomPropertyClass[] = [];

This didn’t work in CC 1.x at least, but for example cc.Button uses several different properties in a combination.

This would be very useful to be able to do :slightly_smiling_face:

Actually I didn’t even know you could do that.

haha, yeah. It is pretty useful sometimes. Just wish you could create arrays out of them :slight_smile: