Project Settings

The Project Settings panel can be opened by clicking on Project -> Project Settings in the editor’s main menu bar and is mainly used to set project-specific configuration items. These settings are stored in the project’s settings/packages folder. To synchronize project settings between developers, please add the settings directory to version control.

Project Settings consists of several different sub-pages, including Project Data, Layers, Physics, Scripting, Macro Config, Feature Cropping and Texture Compression. The Project Settings panel will automatically save the changes after modifying the settings.

Project Data

The Project Data tab is mainly used to set the default Canvas, render pipeline, etc. and only works for the current project.

project-data

Default Canvas Settings

The default Canvas settings include Design Resolution and Fit Screen Width/Height, which specify the default design resolution values in Canvas when a new scene or Canvas component is created, as well as Fit Height and Fit Width. For more details, please refer to the Multi-Resolution Adaptation Solution documentation.

Render Pipeline

The render pipeline is used to control the rendering process of the scene, currently supports builtin-forward (Forward Render Pipeline) and builtin-deferred (Deferred Render Pipeline), developers can also customize the render pipeline. Please refer to the Render Pipeline Overview documentations for details.

Layers

Layers

  • Layers allow the camera to render parts of the scene and lights to illuminate parts of the scene.
  • Layers can be customized from 0 to 19, and clearing the input box removes the original settings.
  • The last 12 Layers are built-in to the engine and cannot be modified.

  • The locations where Layers are currently used include:

    1. The Layer property of the node Node in the Inspector panel, For more details, please refer to the Node Component documentation.

      Layers-node

    2. The Visibility property of the Camera node in the Inspector panel, the Layer property of the node matches the Visibility property of the Camera. A node can only be seen by the Camera if the Layer property set by the node is checked in the Visibility of the Camera. For more details, please refer to the Camera Component documentation.

      Layers-camera

Physics

physics

Used to configure various parameters of physics, please refer to the Physics Config documentation for details.

Scripting

scripting

  • Conforming class fields: if enabled, class fields are implemented using Define semantics; otherwise, class fields are implemented using Set semantics.

  • Allows declaration of class fields: if enabled, the declare keyword may be used to declare class fields in TypeScript scripts. In such case, class fields without explicit initializer would be initialized to undefined, according to the specification.

  • Enable loose mode: if enabled, the script will be compiled in non-strict mode.

  • Import Map: used to control the import behavior of TypeScript/JavaScript, see the Import Map documentation for details.

  • Browser list used for preview: sets the browser list config file for TypeScript/JavaScript compilation at preview time.

  • Exports Conditions: specify the parsing conditions for conditionalized export modules, see Conditional exports for details.

Macro Config

Macro Config provides a shortcut to modify the macro configuration. The configured macros will take effect on preview and build, and will also follow the custom engine configuration to update the default values of the current macro configuration.

macro

  • ENABLE_TILEDMAP_CULLING: whether or not to enable TiledMap auto-culling. It’s enabled by default. Note that if skew and rotation are set in the TiledMap, it’s necessary to turn it off manually, otherwise it will cause rendering errors.

  • TOUCH_TIMEOUT: the duration of the delay used to screen a contact object to see if it has failed and can be removed. This value can be modified to get the desired effect, the default value is 5000 ms. Please refer to the API TOUCH_TIMEOUT for details.

  • ENABLE_TRANSPARENT_CANVAS: used to set whether the Canvas background supports alpha channels.

    • If enabled, the Canvas background will be transparent and show the other DOM elements behind it.
    • If disabled, it will result in higher performance.

  • ENABLE_WEBGL_ANTIALIAS: whether to activate WebGL antialias setting in the engine, it’s enabled by default. This setting only affects WebGL graphics back-end, it indicates whether to turn on the anti-aliasing option when creating WebGL Context (for forward pipeline only).

  • ENABLE_ANTIALIAS_FXAA: used to enable FXAA anti-aliasing (for deferred pipeline only).

  • ENABLE_BLOOM: used to enable the BLOOM post-processing.

  • CLEANUP_IMAGE_CACHE: whether to clear the image cache after uploading a texture to GPU. If the cache is cleared, Dynamic Atlas will not be supported. It’s disabled by default.

  • ENABLE_MULTI_TOUCH: whether to enable multi-touch.

  • MAX_LABEL_CANVAS_POOL_SIZE: set the maximum number of Canvas object pools used by the Label, and adjust it according to the number of Labels in the same scene of the project.

  • ENABLE_WEBGL_HIGHP_STRUCT_VALUES (new in v3.4.1): on the Android platform with WebGL backend, the internal variables of the structures defined in the fragment shader use mediump precision, which may lead to incorrect results for some data that requires high precision (such as position information). To avoid this problem, check this option and enable WebGL to calculate variables with highp precision.

    • If this option is enabled, use the HIGHP_VALUE_STRUCT_DEFINE macro in the fragment shader code to define structural variables, and use HIGHP_VALUE_TO_STRUCT_DEFINED and HIGHP_VALUE_FROM_STRUCT_DEFINED to assign values between structural and non-structural variables.

    • For specific information and code on the above macro calls, please refer to packing.chunk for details.

  • BATCHER2D_MEM_INCREMENT (new in v3.4.1): this option affects the maximum number of vertices in each MeshBuffer, the default value is 144KB, please refer to the MeshBuffer Batch Description documentation for the conversion relationship between the number and the value.

  • Custom Macro: used to customize macro configurations, providing a macro tagging feature for current project scripts for easy visual configuration. Click the + button below to add a new macro configuration, hover over the added macro configuration and the Delete and Modify buttons will be displayed on the left side for deleting/renaming the current macro configuration respectively.

    macro

For more specific information and code about the engine macro module, please refer to the Engine Macro source.

Feature Cropping

The Feature Cropping tab is mainly for modules used in the engine when releasing the game, to achieve the effect of reducing the package size of the released version of the engine. The unchecked modules in the list will be cropped out when packaging and previewing. It is recommended to do a complete test after packaging to avoid scenes and scripts that use modules that have been cropped out.

feature-core

Texture Compression

The preset configuration of texture compression is moved to Project Settings, and developers can select how the image asset is preset in the Inspector panel. The editor will automatically scan all the texture compression configurations in the project and sort out a few presets. Since it is automatically scanned, the preset names may not match the project and can be modified here by developers.

compress-texture

This panel is mainly used to add presets for texture compression. Each texture compression configuration allows to tailor the configuration for different platforms. Once added, developers can quickly add a texture compression preset in the Inspector panel by selecting the image asset in the Hierarchy panel. It is also possible to modify the preset directly in this panel to achieve the need to update the compression texture configuration in bulk.

The following platforms are currently supported for configuring texture compressions:

  1. Web: both Web-Mobile and Web-Desktop platforms
  2. iOS
  3. Mini Game: including all mini game platforms currently supported by Creator, such as WeChat Mini Game, Huawei Quick Game, etc.
  4. Android

Please refer to the Texture Compression documentation for details of texture compression on each platform.

Adding/Removing Texture Compression Presets

Enter a texture compression preset name in the upper input box and click Enter or the “+” button on the right to add a preset. The other two buttons are for importing/exporting texture compression presets, please refer to the description below for details.

add

After adding a compressed texture, it can be deleted by hovering over the preset name and clicking the delete button on the right.

delete

Note: the two presets default and transparent built into the panel cannot be modified/deleted.

Adding/Deleting Texture Compression Format

Select the platform, then click the Add Format button, select the desired texture format, and then configure the corresponding quality level. Currently the same type of image format can only be added once.

add-format

To delete, move the mouse over the texture format and click the red delete button on the right.

delete-format

Modifying the Texture Compression Preset Name

The name of the texture compression preset is for display purposes only. When a texture compression preset is added, a random UUID is generated as the ID of the preset, so changing the preset name directly does not affect the reference to the preset at the image asset.

edit

Exporting/Importing Texture Compression Presets

The texture compression configuration page allows importing/exporting texture compression presets for better cross-project reuse of the configuration, or edit the texture compression presets externally and import them to the editor.

To write a custom texture compression configuration, please refer to the following interface definitions and examples:

The interface is defined as follows:

  1. type IConfigGroups = Record<ITextureCompressPlatform, IConfigGroupsInfo>;
  2. type ITextureCompressPlatform = 'miniGame' | 'web' | 'ios' | 'android' | 'pc';
  3. type ITextureCompressType =
  4.     | 'jpg'
  5.     | 'png'
  6.     | 'webp'
  7.     | 'pvrtc_4bits_rgb'
  8.     | 'pvrtc_4bits_rgba'
  9.     | 'pvrtc_4bits_rgb_a'
  10.     | 'pvrtc_2bits_rgb'
  11.     | 'pvrtc_2bits_rgba'
  12.     | 'pvrtc_2bits_rgb_a'
  13.     | 'etc1_rgb'
  14.     | 'etc1_rgb_a'
  15.     | 'etc2_rgb'
  16.     | 'etc2_rgba'
  17.     | 'astc_4x4'
  18.     | 'astc_5x5'
  19.     | 'astc_6x6'
  20.     | 'astc_8x8'
  21.     | 'astc_10x5'
  22.     | 'astc_10x10'
  23.     | 'astc_12x12';
  24. type IConfigGroupsInfo = Record<ITextureCompressType, IQuality>
  25. interface ICompressPresetItem {
  26.     name: string;
  27.     options: IConfigGroups;
  28. }

Examples:

  1. {
  2.     "default": {
  3.         "name": "default",
  4.         "options": {
  5.             "miniGame": {
  6.                 "etc1_rgb": "fast",
  7.                 "pvrtc_4bits_rgb": "fast"
  8.             },
  9.             "android": {
  10.                 "astc_8x8": "-medium",
  11.                 "etc1_rgb": "fast"
  12.             },
  13.             "ios": {
  14.                 "astc_8x8": "-medium",
  15.                 "pvrtc_4bits_rgb": "fast"
  16.             },
  17.             "web": {
  18.                 "astc_8x8": "-medium",
  19.                 "etc1_rgb": "fast",
  20.                 "pvrtc_4bits_rgb": "fast"
  21.             },
  22.         }
  23.     },
  24.     "transparent": {
  25.         "name": "transparent",
  26.         "options": {
  27.             "miniGame": {
  28.                 "etc1_rgb_a": "fast",
  29.                 "pvrtc_4bits_rgb_a": "fast"
  30.             },
  31.             "android": {
  32.                 "astc_8x8": "-medium",
  33.                 "etc1_rgb_a": "fast"
  34.             },
  35.             "ios": {
  36.                 "astc_8x8": "-medium",
  37.                 "pvrtc_4bits_rgb_a": "fast"
  38.             },
  39.             "web": {
  40.                 "astc_8x8": "-medium",
  41.                 "etc1_rgb_a": "fast",
  42.                 "pvrtc_4bits_rgb_a": "fast"
  43.             },
  44.         }
  45.     }
  46. }

Extending the Project Settings Panel

Creator supports adding custom feature pages on the right side of Project Settings, please refer to the Extending the Project Settings Panel documentation.