• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
1# js标签配置<a name="ZH-CN_TOPIC_0000001164290700"></a>
2
3js标签中包含了实例名称、页面路由和窗口样式信息。
4
5<a name="zh-cn_topic_0000001173324643_t092f7d78cacb46d583b3499e7cf3e7f2"></a>
6<table><thead align="left"><tr id="zh-cn_topic_0000001173324643_r8ff2bb3ff6c84115be187bad81bb8dce"><th class="cellrowborder" valign="top" width="21.89%" id="mcps1.1.6.1.1"><p id="zh-cn_topic_0000001173324643_a16a1bbba39d7414b8e77ae9bcf230b7b"><a name="zh-cn_topic_0000001173324643_a16a1bbba39d7414b8e77ae9bcf230b7b"></a><a name="zh-cn_topic_0000001173324643_a16a1bbba39d7414b8e77ae9bcf230b7b"></a>标签</p>
7</th>
8<th class="cellrowborder" valign="top" width="13.969999999999999%" id="mcps1.1.6.1.2"><p id="zh-cn_topic_0000001173324643_a1fdbf4e9a38840029b6eb94a7f89b29a"><a name="zh-cn_topic_0000001173324643_a1fdbf4e9a38840029b6eb94a7f89b29a"></a><a name="zh-cn_topic_0000001173324643_a1fdbf4e9a38840029b6eb94a7f89b29a"></a>类型</p>
9</th>
10<th class="cellrowborder" valign="top" width="13.139999999999999%" id="mcps1.1.6.1.3"><p id="zh-cn_topic_0000001173324643_a07bcb8a8bbea4e8d9c60b8a4b1031970"><a name="zh-cn_topic_0000001173324643_a07bcb8a8bbea4e8d9c60b8a4b1031970"></a><a name="zh-cn_topic_0000001173324643_a07bcb8a8bbea4e8d9c60b8a4b1031970"></a>默认值</p>
11</th>
12<th class="cellrowborder" valign="top" width="9%" id="mcps1.1.6.1.4"><p id="zh-cn_topic_0000001173324643_a39b2ea2535e04e37a418e8374f3271e4"><a name="zh-cn_topic_0000001173324643_a39b2ea2535e04e37a418e8374f3271e4"></a><a name="zh-cn_topic_0000001173324643_a39b2ea2535e04e37a418e8374f3271e4"></a>必填</p>
13</th>
14<th class="cellrowborder" valign="top" width="42%" id="mcps1.1.6.1.5"><p id="zh-cn_topic_0000001173324643_ae9e9127cfa374d18a3741f4247791acf"><a name="zh-cn_topic_0000001173324643_ae9e9127cfa374d18a3741f4247791acf"></a><a name="zh-cn_topic_0000001173324643_ae9e9127cfa374d18a3741f4247791acf"></a>描述</p>
15</th>
16</tr>
17</thead>
18<tbody><tr id="zh-cn_topic_0000001173324643_row19493102613510"><td class="cellrowborder" valign="top" width="21.89%" headers="mcps1.1.6.1.1 "><p id="zh-cn_topic_0000001173324643_p6494172618357"><a name="zh-cn_topic_0000001173324643_p6494172618357"></a><a name="zh-cn_topic_0000001173324643_p6494172618357"></a>name</p>
19</td>
20<td class="cellrowborder" valign="top" width="13.969999999999999%" headers="mcps1.1.6.1.2 "><p id="zh-cn_topic_0000001173324643_p1449472643513"><a name="zh-cn_topic_0000001173324643_p1449472643513"></a><a name="zh-cn_topic_0000001173324643_p1449472643513"></a>string</p>
21</td>
22<td class="cellrowborder" valign="top" width="13.139999999999999%" headers="mcps1.1.6.1.3 "><p id="zh-cn_topic_0000001173324643_p1749412619355"><a name="zh-cn_topic_0000001173324643_p1749412619355"></a><a name="zh-cn_topic_0000001173324643_p1749412619355"></a>default</p>
23</td>
24<td class="cellrowborder" valign="top" width="9%" headers="mcps1.1.6.1.4 "><p id="zh-cn_topic_0000001173324643_p64947262359"><a name="zh-cn_topic_0000001173324643_p64947262359"></a><a name="zh-cn_topic_0000001173324643_p64947262359"></a>是</p>
25</td>
26<td class="cellrowborder" valign="top" width="42%" headers="mcps1.1.6.1.5 "><p id="zh-cn_topic_0000001173324643_p8494122612352"><a name="zh-cn_topic_0000001173324643_p8494122612352"></a><a name="zh-cn_topic_0000001173324643_p8494122612352"></a>标识JS实例的名字。</p>
27</td>
28</tr>
29<tr id="zh-cn_topic_0000001173324643_r3d05cd5e24f14308a71d21d2d01adb81"><td class="cellrowborder" valign="top" width="21.89%" headers="mcps1.1.6.1.1 "><p id="zh-cn_topic_0000001173324643_a5a33cd31feb7416ab1ee44a6b863e57d"><a name="zh-cn_topic_0000001173324643_a5a33cd31feb7416ab1ee44a6b863e57d"></a><a name="zh-cn_topic_0000001173324643_a5a33cd31feb7416ab1ee44a6b863e57d"></a>pages</p>
30</td>
31<td class="cellrowborder" valign="top" width="13.969999999999999%" headers="mcps1.1.6.1.2 "><p id="zh-cn_topic_0000001173324643_a90233739ef8a4977ba0a9a48282d324d"><a name="zh-cn_topic_0000001173324643_a90233739ef8a4977ba0a9a48282d324d"></a><a name="zh-cn_topic_0000001173324643_a90233739ef8a4977ba0a9a48282d324d"></a>Array</p>
32</td>
33<td class="cellrowborder" valign="top" width="13.139999999999999%" headers="mcps1.1.6.1.3 "><p id="zh-cn_topic_0000001173324643_aaa1317b02aef4aee98e42227902ac7e5"><a name="zh-cn_topic_0000001173324643_aaa1317b02aef4aee98e42227902ac7e5"></a><a name="zh-cn_topic_0000001173324643_aaa1317b02aef4aee98e42227902ac7e5"></a>-</p>
34</td>
35<td class="cellrowborder" valign="top" width="9%" headers="mcps1.1.6.1.4 "><p id="zh-cn_topic_0000001173324643_a225959a4c42f44f4ad25fac5f48f34f5"><a name="zh-cn_topic_0000001173324643_a225959a4c42f44f4ad25fac5f48f34f5"></a><a name="zh-cn_topic_0000001173324643_a225959a4c42f44f4ad25fac5f48f34f5"></a>是</p>
36</td>
37<td class="cellrowborder" valign="top" width="42%" headers="mcps1.1.6.1.5 "><p id="zh-cn_topic_0000001173324643_a5f03a4f4a1fd461b9e4bc025569fcb2d"><a name="zh-cn_topic_0000001173324643_a5f03a4f4a1fd461b9e4bc025569fcb2d"></a><a name="zh-cn_topic_0000001173324643_a5f03a4f4a1fd461b9e4bc025569fcb2d"></a>路由信息,详见“<strong id="zh-cn_topic_0000001173324643_a4e250b60d2f84a32841a9b3a90941d81"><a name="zh-cn_topic_0000001173324643_a4e250b60d2f84a32841a9b3a90941d81"></a><a name="zh-cn_topic_0000001173324643_a4e250b60d2f84a32841a9b3a90941d81"></a><a href="#zh-cn_topic_0000001173324643_section3239252133513">pages</a></strong>”。</p>
38</td>
39</tr>
40<tr id="zh-cn_topic_0000001173324643_row12517192619239"><td class="cellrowborder" valign="top" width="21.89%" headers="mcps1.1.6.1.1 "><p id="zh-cn_topic_0000001173324643_p18517172622317"><a name="zh-cn_topic_0000001173324643_p18517172622317"></a><a name="zh-cn_topic_0000001173324643_p18517172622317"></a>window</p>
41</td>
42<td class="cellrowborder" valign="top" width="13.969999999999999%" headers="mcps1.1.6.1.2 "><p id="zh-cn_topic_0000001173324643_p15517626112313"><a name="zh-cn_topic_0000001173324643_p15517626112313"></a><a name="zh-cn_topic_0000001173324643_p15517626112313"></a>Object</p>
43</td>
44<td class="cellrowborder" valign="top" width="13.139999999999999%" headers="mcps1.1.6.1.3 "><p id="zh-cn_topic_0000001173324643_p3517112615234"><a name="zh-cn_topic_0000001173324643_p3517112615234"></a><a name="zh-cn_topic_0000001173324643_p3517112615234"></a>-</p>
45</td>
46<td class="cellrowborder" valign="top" width="9%" headers="mcps1.1.6.1.4 "><p id="zh-cn_topic_0000001173324643_p1451782692314"><a name="zh-cn_topic_0000001173324643_p1451782692314"></a><a name="zh-cn_topic_0000001173324643_p1451782692314"></a>否</p>
47</td>
48<td class="cellrowborder" valign="top" width="42%" headers="mcps1.1.6.1.5 "><p id="zh-cn_topic_0000001173324643_p1517326152317"><a name="zh-cn_topic_0000001173324643_p1517326152317"></a><a name="zh-cn_topic_0000001173324643_p1517326152317"></a>窗口信息,详见“<strong id="zh-cn_topic_0000001173324643_b10874923141111"><a name="zh-cn_topic_0000001173324643_b10874923141111"></a><a name="zh-cn_topic_0000001173324643_b10874923141111"></a><a href="#zh-cn_topic_0000001173324643_section728811177376">window</a></strong>”。</p>
49</td>
50</tr>
51</tbody>
52</table>
53
54>![](../public_sys-resources/icon-note.gif) **说明:**
55>name、pages和window等标签配置需在配置文件(config.json)中的“js”标签中完成设置。
56
57## pages<a name="zh-cn_topic_0000001173324643_section3239252133513"></a>
58
59定义每个页面的路由信息,每个页面由页面路径和页面名组成,页面的文件名就是页面名。比如:
60
61```
62{
63    ...
64    "pages": [
65        "pages/index/index",
66        "pages/detail/detail"
67    ]
68    ...
69}
70```
71
72>![](../public_sys-resources/icon-note.gif) **说明:**
73>-   pages列表中第一个页面是应用的首页,即entry入口。
74>-   页面文件名不能使用组件名称,比如:text.hmlbutton.hml等。
75
76## window<a name="zh-cn_topic_0000001173324643_section728811177376"></a>
77
78window用于定义与显示窗口相关的配置。对于屏幕适配问题,有2种配置方法:
79
80-   指定designWidth(屏幕逻辑宽度),所有与大小相关的样式(例如width、font-size)均以designWidth和实际屏幕宽度的比例进行缩放,例如在designWidth为720时,如果设置width为100px时,在实际宽度为1440物理像素的屏幕上,width实际渲染像素为200物理像素。
81-   设置autoDesignWidth为true,此时designWidth字段将会被忽略,渲染组件和布局时按屏幕密度进行缩放。屏幕逻辑宽度由设备宽度和屏幕密度自动计算得出,在不同设备上可能不同,请使用相对布局来适配多种设备。例如:在466\*466分辨率,320dpi的设备上,屏幕密度为2(以160dpi为基准),1px等于渲染出的2物理像素。
82
83    >![](../public_sys-resources/icon-note.gif) **说明:**
84    >1. 组件样式中<length\>类型的默认值,按屏幕密度进行计算和绘制,如:在屏幕密度为2(以160dpi为基准)的设备上,默认<length\>为1px时,设备上实际渲染出2物理像素。
85    >2. autoDesignWidth、designWidth的设置不影响默认值计算方式和绘制结果。
86
87
88<a name="zh-cn_topic_0000001173324643_table4231104116370"></a>
89<table><thead align="left"><tr id="zh-cn_topic_0000001173324643_row17231541183714"><th class="cellrowborder" valign="top" width="19.558044195580443%" id="mcps1.1.6.1.1"><p id="zh-cn_topic_0000001173324643_p1723112411376"><a name="zh-cn_topic_0000001173324643_p1723112411376"></a><a name="zh-cn_topic_0000001173324643_p1723112411376"></a>属性</p>
90</th>
91<th class="cellrowborder" valign="top" width="12.218778122187782%" id="mcps1.1.6.1.2"><p id="zh-cn_topic_0000001173324643_p12313414371"><a name="zh-cn_topic_0000001173324643_p12313414371"></a><a name="zh-cn_topic_0000001173324643_p12313414371"></a>类型</p>
92</th>
93<th class="cellrowborder" valign="top" width="8.37916208379162%" id="mcps1.1.6.1.3"><p id="zh-cn_topic_0000001173324643_p1323118413374"><a name="zh-cn_topic_0000001173324643_p1323118413374"></a><a name="zh-cn_topic_0000001173324643_p1323118413374"></a>必填</p>
94</th>
95<th class="cellrowborder" valign="top" width="19.748025197480253%" id="mcps1.1.6.1.4"><p id="zh-cn_topic_0000001173324643_p2423537113218"><a name="zh-cn_topic_0000001173324643_p2423537113218"></a><a name="zh-cn_topic_0000001173324643_p2423537113218"></a>缺省值</p>
96</th>
97<th class="cellrowborder" valign="top" width="40.095990400959906%" id="mcps1.1.6.1.5"><p id="zh-cn_topic_0000001173324643_p17231124163710"><a name="zh-cn_topic_0000001173324643_p17231124163710"></a><a name="zh-cn_topic_0000001173324643_p17231124163710"></a>描述</p>
98</th>
99</tr>
100</thead>
101<tbody><tr id="zh-cn_topic_0000001173324643_row1423174133715"><td class="cellrowborder" valign="top" width="19.558044195580443%" headers="mcps1.1.6.1.1 "><p id="zh-cn_topic_0000001173324643_p1923284111373"><a name="zh-cn_topic_0000001173324643_p1923284111373"></a><a name="zh-cn_topic_0000001173324643_p1923284111373"></a>designWidth</p>
102</td>
103<td class="cellrowborder" valign="top" width="12.218778122187782%" headers="mcps1.1.6.1.2 "><p id="zh-cn_topic_0000001173324643_p1023219418372"><a name="zh-cn_topic_0000001173324643_p1023219418372"></a><a name="zh-cn_topic_0000001173324643_p1023219418372"></a>number</p>
104</td>
105<td class="cellrowborder" valign="top" width="8.37916208379162%" headers="mcps1.1.6.1.3 "><p id="zh-cn_topic_0000001173324643_p023217410379"><a name="zh-cn_topic_0000001173324643_p023217410379"></a><a name="zh-cn_topic_0000001173324643_p023217410379"></a>否</p>
106</td>
107<td class="cellrowborder" valign="top" width="19.748025197480253%" headers="mcps1.1.6.1.4 "><p id="zh-cn_topic_0000001173324643_p15424137103212"><a name="zh-cn_topic_0000001173324643_p15424137103212"></a><a name="zh-cn_topic_0000001173324643_p15424137103212"></a>720</p>
108</td>
109<td class="cellrowborder" valign="top" width="40.095990400959906%" headers="mcps1.1.6.1.5 "><p id="zh-cn_topic_0000001173324643_p1232174173717"><a name="zh-cn_topic_0000001173324643_p1232174173717"></a><a name="zh-cn_topic_0000001173324643_p1232174173717"></a>页面显示设计时的参考值,实际显示效果基于设备宽度与参考值之间的比例进行缩放。</p>
110</td>
111</tr>
112<tr id="zh-cn_topic_0000001173324643_row78924466220"><td class="cellrowborder" valign="top" width="19.558044195580443%" headers="mcps1.1.6.1.1 "><p id="zh-cn_topic_0000001173324643_p1289216461925"><a name="zh-cn_topic_0000001173324643_p1289216461925"></a><a name="zh-cn_topic_0000001173324643_p1289216461925"></a>autoDesignWidth</p>
113</td>
114<td class="cellrowborder" valign="top" width="12.218778122187782%" headers="mcps1.1.6.1.2 "><p id="zh-cn_topic_0000001173324643_p1489220466214"><a name="zh-cn_topic_0000001173324643_p1489220466214"></a><a name="zh-cn_topic_0000001173324643_p1489220466214"></a>boolean</p>
115</td>
116<td class="cellrowborder" valign="top" width="8.37916208379162%" headers="mcps1.1.6.1.3 "><p id="zh-cn_topic_0000001173324643_p10892184612218"><a name="zh-cn_topic_0000001173324643_p10892184612218"></a><a name="zh-cn_topic_0000001173324643_p10892184612218"></a>否</p>
117</td>
118<td class="cellrowborder" valign="top" width="19.748025197480253%" headers="mcps1.1.6.1.4 "><p id="zh-cn_topic_0000001173324643_p10424237183218"><a name="zh-cn_topic_0000001173324643_p10424237183218"></a><a name="zh-cn_topic_0000001173324643_p10424237183218"></a>false</p>
119</td>
120<td class="cellrowborder" valign="top" width="40.095990400959906%" headers="mcps1.1.6.1.5 "><p id="zh-cn_topic_0000001173324643_p198921746524"><a name="zh-cn_topic_0000001173324643_p198921746524"></a><a name="zh-cn_topic_0000001173324643_p198921746524"></a>页面设计基准宽度是否自动计算,当设为true时,designWidth将会被忽略,设计基准宽度由设备宽度与屏幕密度计算得出。</p>
121</td>
122</tr>
123</tbody>
124</table>
125
126示例如下:
127
128```
129{
130    ...
131    "window": {
132        "designWidth": 720,
133        "autoDesignWidth": false
134    }
135    ...
136}
137```
138
139## 示例<a name="zh-cn_topic_0000001173324643_section19421142983812"></a>
140
141```
142{
143  "app": {
144    "bundleName": "com.example.player",
145    "version": {
146        "code": 1,
147        "name": "1.0"
148    },
149    "vendor": "example"
150  }
151  "module": {
152      ...
153      "js": [
154      {
155          "name": "default",
156          "pages": [
157              "pages/index/index",
158              "pages/detail/detail"
159          ],
160          "window": {
161              "designWidth": 720,
162              "autoDesignWidth": false
163          }
164      }
165      ],
166      "abilities": [
167      {
168          ...
169      }
170    ]
171  }
172}
173```
174
175