Skip to content

Commit 82c8acb

Browse files
EricCorleoneslackmoehrlexunyi0
authored
翻译3.1材质升级指南 (cocos#1632)
* 翻译3.1材质升级指南 * 细节修改 * Apply suggestions from code review Co-authored-by: Slack-Moehrle <[email protected]> * Apply suggestions from code review * Apply suggestions from code review Co-authored-by: yufang.wu <[email protected]> * Apply suggestions from code review * Apply suggestions from code review Co-authored-by: Slack-Moehrle <[email protected]> Co-authored-by: yufang.wu <[email protected]>
1 parent 4374b68 commit 82c8acb

4 files changed

+224
-59
lines changed

en/SUMMARY.md

+1
Original file line numberDiff line numberDiff line change
@@ -24,6 +24,7 @@
2424
- [Caution!](getting-started/attention/index.md)
2525
- [Upgrade Guide](release-notes/index.md)
2626
- [Cocos Creator 3.0 Upgrade Guide](release-notes/upgrade-guide-v3.0.md)
27+
- [Cocos Creator 3.1 Material Upgrade Guide](material-system/Material-upgrade-documentation-for-v3.0-to-v3.1.md)
2728

2829
## Editor Manual
2930

Original file line numberDiff line numberDiff line change
@@ -0,0 +1,158 @@
1+
# Cocos Creator 3.1 Material Upgrade Guide
2+
3+
> This article will detail the considerations for upgrading Cocos Creator 3.0 materials to v3.1.
4+
5+
## 1. Shader upgrades and changes
6+
7+
### 1.1 Built-in header file changes
8+
9+
The standard shader header `shading-standard` from v3.0 has become `standard-surface-entry` from v3.1, making the effect compatible with both the forward render pipeline and the deferred render pipeline.
10+
11+
The `cc-fog` header file from v3.0 is now `cc-fog-vs/fs` from v3.1, split into vertex shader and fragment shader versions.
12+
13+
### 1.2 Vertex shaders
14+
15+
- `gl_Position`
16+
17+
The main function name of `VS` in v3.1 has been changed from `vert` to `main`, and a new macro `gl_Position` has been added to assign a value to the return value.
18+
19+
```c
20+
CCProgram standard-vs %{
21+
precision highp float;
22+
23+
// Include your headfile
24+
25+
#include <cc-fog-vs> // Note the change in the header file name here
26+
27+
// Fill in your data here
28+
29+
void main () {
30+
31+
// Fill in your data here
32+
33+
gl_Position = fill in your data result;
34+
}
35+
}%
36+
```
37+
38+
### 1.3 Fragment shaders
39+
40+
- `CC_STANDARD_SURFACE_ENTRY()`
41+
42+
Load the standard shader header file `standard-surface-entry` and use the v3.1 standard shader output function `CC_STANDARD_SURFACE_ENTRY()` to replace the original v3.0 shader output function `frag()`.
43+
44+
```c
45+
CCProgram standard-fs %{
46+
47+
// Include your headfile
48+
49+
#include <cc-fog-fs> // Note the change in the header file name here
50+
#include <standard-surface-entry> // Note the change in the name of the standard shader header file here
51+
52+
// Fill in your data here
53+
54+
void surf (out StandardSurface s) {
55+
56+
// Fill in your data here
57+
58+
}
59+
CC_STANDARD_SURFACE_ENTRY() // Standard shader output function
60+
}%
61+
```
62+
63+
## 2. Deferred Rendering Pipeline
64+
65+
### 2.1 Deferred Rendering Pipeline
66+
67+
The biggest difference between v3.1 and v3.0 is that v3.1 supports the deferred render pipeline. The engine comes with a standard `standard-surface-entry` header file that supports both the forward render pipeline and the deferred render pipeline, which is used as follows:
68+
69+
```c
70+
CCEffect %{
71+
techniques:
72+
73+
// Fill in your data here
74+
75+
- &deferred
76+
vert: // your Vertex shader
77+
frag: // your Fragment shader
78+
phase: deferred
79+
propertyIndex: 0
80+
blendState:
81+
targets: // turn off blending
82+
- blend: false
83+
- blend: false
84+
- blend: false
85+
- blend: false
86+
properties: // your properties name
87+
88+
// Fill in your data here
89+
90+
}%
91+
92+
// fill in your data here
93+
94+
CCProgram standard-fs %{
95+
precision highp float;
96+
#include <cc-global>
97+
#include <shared-ubos>
98+
#include <cc-fog-fs> // Note the change in the header file name here.
99+
#include <standard-surface-entry> // Note the change in the name of the standard shader header file here
100+
101+
// Fill in your data here
102+
void surf (out StandardSurface s) {
103+
104+
// Fill in your data here
105+
106+
}
107+
CC_STANDARD_SURFACE_ENTRY() // Standard shader output function
108+
}%
109+
110+
// fill in your data here
111+
112+
```
113+
114+
### 2.2 Render pipeline determination
115+
116+
The header file `standard-surface-entry` determines which render pipeline is selected, and the lighting calculation is in the file `shading-standard-additive`.
117+
118+
If it is a deferred render pipeline, the `deferred-lighting` effect file is called first, followed by the light calculation file `shading-standard-additive`.
119+
120+
```c
121+
#define CC_STANDARD_SURFACE_ENTRY()
122+
#if CC_FORWARD_ADD
123+
#include <shading-standard-additive>
124+
125+
// Fill in your data here
126+
127+
#elif CC_PIPELINE_TYPE == CC_PIPELINE_TYPE_FORWARD // Determine if it is the forward render pipeline
128+
129+
// Fill in your data here
130+
131+
#elif CC_PIPELINE_TYPE == CC_PIPELINE_TYPE_DEFERRED // Determine if it is the deferred render pipeline
132+
133+
// Fill in your data here
134+
135+
#endif
136+
```
137+
138+
## 3. Parameter transfer upgrade
139+
140+
The macro for passing shadow parameters from vertex shaders to fragment shaders was originally `CCPassShadowParams` in v3.0, but was changed to `CC_TRANSFER_SHADOW` in v3.1.
141+
142+
The v3.1 vertex shader transfers `FOG` parameters to the fragment shader, using the `CC_TRANSFER_FOG` macro directly.
143+
144+
Version comparison:
145+
146+
- v3.0
147+
148+
```c
149+
v_fog_factor = CC_TRANSFER_FOG(pos);
150+
CCPassShadowParams(pos);
151+
```
152+
153+
- v3.1
154+
155+
```c
156+
CC_TRANSFER_FOG(pos);
157+
CC_TRANSFER_SHADOW(pos);
158+
```

en/material-system/overview.md

+9
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,14 @@
11
# Material System Overview
22

3+
## Material System Upgrade Guide
4+
5+
Cocos Creator has supported the material system since v2.x. Since then, the design of the material system and the built-in Shader API are continually being improved, there may be some adjustments in the upgrade from v2.x to v3.0 and subsequent upgrades. The Effect asset does not currently support automatic upgrades, so please refer to the following documentation to upgrade:
6+
7+
- [v2.x to v3.0 Material Upgrade Guide](./effect-2.x-to-3.0.md)
8+
- [v3.0 to v3.1 Material Upgrade Guide](./Material-upgrade-documentation-for-v3.0-to-v3.1.md)
9+
10+
## Material System Class Diagram
11+
312
The material system plays an essential role in any game engine infrastructure, it controls the way everything is drawn on screen and much more.
413

514
The general structure of the system is as follows:
Original file line numberDiff line numberDiff line change
@@ -1,19 +1,21 @@
11

2-
# Material upgrade documentation for v3.0 to v3.1
2+
# Cocos Creator 3.1 材质升级指南
3+
4+
> 本文将详细介绍 Cocos Creator 3.0 的材质升级到 v3.1 的注意事项。
35
46
## 1. 着色器升级与变化
57

68
### 1.1 内置头文件变化
79

8-
原来 v3.0 版本的标准着色器头文件 `shading-standard` 变成了 v3.1 版本的 `standard-surface-entry`,可以使 effect 同时兼容 forward 渲染管线,和deferred 渲染管线。
10+
原来 v3.0 的标准着色器头文件 `shading-standard` v3.1 改成了 `standard-surface-entry`,可以使 effect 同时兼容 forward 渲染管线和 deferred 渲染管线。
911

10-
原来 v3.0 版本的 `cc-fog` 头文件变成了 v3.1 版本的 `cc-fog-vs/fs`被拆分成了顶点着色器与片元着色器两个版本
12+
原来 v3.0 `cc-fog` 头文件在 v3.1 改成了 `cc-fog-vs/fs`拆分成了顶点着色器与片元着色器两个部分
1113

1214
### 1.2 顶点着色器
1315

1416
- `gl_Position`
1517

16-
v3.1 版本的 `VS` 主函数名称从 `vert` 改为了 `main` ,并且新增了宏 `gl_Position`用来给返回值赋值
18+
v3.0 的 `VS` 主函数名称 `vert` 在 v3.1 改成了 `main`并且新增了宏 `gl_Position`用于给返回值赋值
1719

1820
```c
1921
CCProgram standard-vs %{
@@ -38,7 +40,7 @@
3840

3941
- `CC_STANDARD_SURFACE_ENTRY()`
4042

41-
加载标准着色器头文件 `standard-surface-entry`,使用 v3.1 版本的标准着色器输出函数 `CC_STANDARD_SURFACE_ENTRY()` 替换原有 v3.0 版本着色器输出函数 `frag ()`
43+
加载标准着色器头文件 `standard-surface-entry`,使用 v3.1 的标准着色器输出函数 `CC_STANDARD_SURFACE_ENTRY()` 替换原有 v3.0 着色器输出的函数 `frag()`
4244

4345
```c
4446
CCProgram standard-fs %{
@@ -63,48 +65,48 @@
6365

6466
### 2.1 Deferred Rendering Pipeline
6567

66-
v3.1 v3.0 版本材质系统最大的区别就是 v3.1 版本支持了 deferred 渲染管线,引擎自带标准的 `standard-surface-entry` 头文件可以同时支持 forward 渲染管线,和 deferred 渲染管线,用法如下:
68+
v3.1 的材质系统与 v3.0 最大的区别在于 v3.1 支持了 deferred 渲染管线,引擎自带标准的 `standard-surface-entry` 头文件,可以同时支持 forward 渲染管线和 deferred 渲染管线,用法如下:
6769

6870
```c
69-
CCEffect %{
70-
techniques:
71+
CCEffect %{
72+
techniques:
7173

72-
// fill in your data here
74+
// fill in your data here
7375

74-
- &deferred
75-
vert: // your Vertex shader
76-
frag: // your Fragment shader
77-
phase: deferred
78-
propertyIndex: 0
79-
blendState:
80-
targets: // 关闭混合
81-
- blend: false
82-
- blend: false
83-
- blend: false
84-
- blend: false
85-
properties: // your properties name
86-
87-
// fill in your data here
88-
89-
}%
76+
- &deferred
77+
vert: // your Vertex shader
78+
frag: // your Fragment shader
79+
phase: deferred
80+
propertyIndex: 0
81+
blendState:
82+
targets: // 关闭混合
83+
- blend: false
84+
- blend: false
85+
- blend: false
86+
- blend: false
87+
properties: // your properties name
9088

9189
// fill in your data here
90+
91+
}%
9292

93-
CCProgram standard-fs %{
94-
precision highp float;
95-
#include <cc-global>
96-
#include <shared-ubos>
97-
#include <cc-fog-fs> // 注意这里头文件名称的变化。
98-
#include <standard-surface-entry> // 注意这里标准着色器头文件的名称变化
93+
// fill in your data here
9994

100-
// fill in your data here
101-
void surf (out StandardSurface s) {
95+
CCProgram standard-fs %{
96+
precision highp float;
97+
#include <cc-global>
98+
#include <shared-ubos>
99+
#include <cc-fog-fs> // 注意这里头文件名称的变化。
100+
#include <standard-surface-entry> // 注意这里标准着色器头文件的名称变化
102101

103-
// fill in your data here
102+
// fill in your data here
103+
void surf (out StandardSurface s) {
104104

105-
}
106-
CC_STANDARD_SURFACE_ENTRY() // 标准着色器输出函数
107-
}%
105+
// fill in your data here
106+
107+
}
108+
CC_STANDARD_SURFACE_ENTRY() // 标准着色器输出函数
109+
}%
108110

109111
// fill in your data here
110112

@@ -117,46 +119,41 @@ v3.1 与 v3.0 版本材质系统最大的区别就是 v3.1 版本支持了 defer
117119
如果判断是 deferred 渲染管线,会先调用 `deferred-lighting` effect 文件,随后调用光照计算文件 `shading-standard-additive`
118120

119121
```c
120-
#define CC_STANDARD_SURFACE_ENTRY()
121-
#if CC_FORWARD_ADD
122-
#include <shading-standard-additive>
122+
#define CC_STANDARD_SURFACE_ENTRY()
123+
#if CC_FORWARD_ADD
124+
#include <shading-standard-additive>
123125

124-
// fill in your data here
126+
// fill in your data here
125127

126-
#elif CC_PIPELINE_TYPE == CC_PIPELINE_TYPE_FORWARD // 判断是否前向渲染管线
128+
#elif CC_PIPELINE_TYPE == CC_PIPELINE_TYPE_FORWARD // 判断是否为前向渲染管线
127129

128-
// fill in your data here
130+
// fill in your data here
129131

130-
#elif CC_PIPELINE_TYPE == CC_PIPELINE_TYPE_DEFERRED // 判断是否后向渲染管线
132+
#elif CC_PIPELINE_TYPE == CC_PIPELINE_TYPE_DEFERRED // 判断是否为延迟渲染管线
131133

132-
// fill in your data here
133-
134-
#endif
134+
// fill in your data here
135135

136+
#endif
136137
```
137138

138139
## 3. 参数传输升级
139140

140-
顶点着色器往片元着色器传递shadow参数的宏,原本 v3.0 `CCPassShadowParams`,v3.1 版本修改为 `CC_TRANSFER_SHADOW`
141+
v3.0 顶点着色器往片元着色器传递 shadow 参数的宏为 `CCPassShadowParams`v3.1 则修改为 `CC_TRANSFER_SHADOW`
141142

142-
v3.1 版本顶点着色器往片元着色器传输 `FOG` 参数,直接使用 `CC_TRANSFER_FOG`
143+
v3.1 顶点着色器往片元着色器传输 `FOG` 参数时,直接使用 `CC_TRANSFER_FOG`
143144

144145
版本对比:
145146

146147
- v3.0
147148

148-
```c
149+
```c
149150
v_fog_factor = CC_TRANSFER_FOG(pos);
150-
CCPassShadowParams(pos);
151-
152-
```
151+
CCPassShadowParams(pos);
152+
```
153153

154154
- v3.1
155155

156-
```c
156+
```c
157157
CC_TRANSFER_FOG(pos);
158-
CC_TRANSFER_SHADOW(pos);
159-
160-
```
161-
162-
[升级指南](../release-notes/index.md)。<br>
158+
CC_TRANSFER_SHADOW(pos);
159+
```

0 commit comments

Comments
 (0)