You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@weex.apache.org by ky...@apache.org on 2019/09/19 07:08:02 UTC
[incubator-weex-site] branch revert-491-update-about-wx created
(now da27d8c)
This is an automated email from the ASF dual-hosted git repository.
kyork pushed a change to branch revert-491-update-about-wx
in repository https://gitbox.apache.org/repos/asf/incubator-weex-site.git.
at da27d8c Revert "[Doc] Update about wx (#491)"
This branch includes the following new commits:
new da27d8c Revert "[Doc] Update about wx (#491)"
The 1 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails. The revisions
listed as "add" were already present in the repository and have only
been added to this reference.
[incubator-weex-site] 01/01: Revert "[Doc] Update about wx (#491)"
Posted by ky...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
kyork pushed a commit to branch revert-491-update-about-wx
in repository https://gitbox.apache.org/repos/asf/incubator-weex-site.git
commit da27d8cc4a2594310f02a71bec7bcf7ef4a4cf0f
Author: YorkShen <sh...@gmail.com>
AuthorDate: Thu Sep 19 15:07:57 2019 +0800
Revert "[Doc] Update about wx (#491)"
This reverts commit d1e6b6950030a1af9029e23148ce8153b0218441.
---
docs/docs/components/text.md | 4 ----
docs/docs/modules/animation.md | 6 +++---
docs/docs/styles/common-styles.md | 2 +-
docs/docs/styles/css-units.md | 17 +----------------
docs/zh/docs/components/text.md | 3 ---
docs/zh/docs/modules/animation.md | 8 ++++----
docs/zh/docs/styles/common-styles.md | 2 +-
docs/zh/docs/styles/css-units.md | 16 +---------------
8 files changed, 11 insertions(+), 47 deletions(-)
diff --git a/docs/docs/components/text.md b/docs/docs/components/text.md
index 9e38f6a..d4ec54a 100644
--- a/docs/docs/components/text.md
+++ b/docs/docs/components/text.md
@@ -43,10 +43,6 @@ One can use the following code snippet to bind the content of text to a variable
* Support [common events](../events/common-events.html)
## Other
-
-### `wx` unit
-`font-size` and `line-height` support `wx` . For styles that should not be affected by screen width and viewPortWidth, please use `wx` as unit.
-
### Text height
The rules for computed height of text component is complicated, basically but not always, text in Weex obey the following rules in order:
1. The CSS style of `max-height`/`min-height` on your text
diff --git a/docs/docs/modules/animation.md b/docs/docs/modules/animation.md
index d8fe4ba..76527c0 100644
--- a/docs/docs/modules/animation.md
+++ b/docs/docs/modules/animation.md
@@ -70,13 +70,13 @@ Ref [transition](../styles/common-styles.html#property) or [transform](../styles
:::
#### Animated properties in styles
-* **`width`**, the `width` applied to the component after the animation finished. Set `needLayout` to true if you want the change to be persistence. The default value is `computed width`.support `wx` as unit.
-* **`height`**, the `height` applied to the component after the animation finished. Set `needLayout` to true if you want the change to be persistence. The default value is `computed height`.support `wx` as unit.
+* **`width`**, the `width` applied to the component after the animation finished. Set `needLayout` to true if you want the change to be persistence. The default value is `computed width`.
+* **`height`**, the `height` applied to the component after the animation finished. Set `needLayout` to true if you want the change to be persistence. The default value is `computed height`.
* **`backgroundColor`**, the `backgroundColor` applied to the component after the animation finished. The default value is `computed backgroundColor`.
* **`opacity`**, the `opacity` applied to the component after the animation finished. The default value is `computed opacity`.
* **`transformOrigin`**, the `transformOrigin` indicate the pivot of the element being animated. The possible values for `x-axis` are `left`/`center`/`right`/length or percent, and possible values of `y-axis` are `top`/`center`/`bottom`/ length or percent. The default value is `center center`.
* **`transform`**, transform object, which may include `rotate`, `translate`, `scale` and etc. The detail of transform is illustrated below.
- * `translate/translateX/translateY`: Specify the location which the element will be translated to.The unit is number or percent and the default value is 0.support `wx` as unit.
+ * `translate/translateX/translateY`: Specify the location which the element will be translated to.The unit is number or percent and the default value is 0.
* `rotate/rotateX/rotateY`**v0.14+**: Specify the angle of which the element will be rotated. The unit is **degree** and the default value is 0.
* `perspective`**v0.16+**: The distance between the z=0 plane and the user. Supported for **Android 4.1** and above. The unit is number and the default value is positive infinity.
* `scale/scaleX/scaleY`: Stretch or shrink the element. The unit is number and the default value is 1.
diff --git a/docs/docs/styles/common-styles.md b/docs/docs/styles/common-styles.md
index 8c3680c..3d38b2e 100644
--- a/docs/docs/styles/common-styles.md
+++ b/docs/docs/styles/common-styles.md
@@ -7,7 +7,7 @@ The supported styles is listed below, and some component may support custom styl
:::
::: warning
-All Styles support `px` as length unit,part of them support `wx`. `%`, `rem`, `em` are not supported.Learn more at [CSS Units](https://weex.apache.org/docs/styles/css-units.html)
+Weex supports `px`and `wx`(not affected by screen width and viewPortWidth) as length unit, `%`, `rem`, `em` are not supported.
:::
## Box Model
diff --git a/docs/docs/styles/css-units.md b/docs/docs/styles/css-units.md
index 8d565fa..69f4755 100644
--- a/docs/docs/styles/css-units.md
+++ b/docs/docs/styles/css-units.md
@@ -2,8 +2,7 @@
## CSS `length` unit
-All Styles support `px` as length unit,part of them support `wx`.
-
+`px` 、`wx` are supported as length units. For styles that should not be affected by screen width and viewPortWidth, please use `wx` as unit.
::: danger
Ignoring `px` or `wx` will cause render error on Webview.
@@ -13,20 +12,6 @@ Ignoring `px` or `wx` will cause render error on Webview.
`em`、`rem`、`pt`, `%`, etc. are not supported.
:::
-### `wx` unit
-Please use `wx` as unit for styles that should not be affected by screen width and viewPortWidth.The following are the styles that support `wx` unit.
-* Box Model
- * `width {length}`
- * `height {length}`
- * `padding {length}`
- * `margin {length}`
- * `border-width {length}`
-* Transform：
- * `translate {length}`
-* Text Styles:
- * `font-size {number}`
- * `line-height {length}`
-
## CSS `number` units
CSS `number` unit is a pure number without `px`, styles like `opacity`，`lines`，`flex` only accept `number` unit, you can find detail in [common-style](./common-styles.html).
diff --git a/docs/zh/docs/components/text.md b/docs/zh/docs/components/text.md
index c587601..55503d3 100644
--- a/docs/zh/docs/components/text.md
+++ b/docs/zh/docs/components/text.md
@@ -45,9 +45,6 @@
* 支持 [通用事件](../events/common-events.html)。
## 其他
-### wx单位
-`font-size`和`line-height`支持`wx`单位，可设置使样式不受屏幕宽度和viewportwidth影响。
-
### 文字高度
文字高度的计算规则比较复杂，但大致上遵循以下优先级进行计算，排在前面的优先级最高。
1. 文字节点的`max-height`/`min-height`样式。
diff --git a/docs/zh/docs/modules/animation.md b/docs/zh/docs/modules/animation.md
index 895326e..47c272f 100644
--- a/docs/zh/docs/modules/animation.md
+++ b/docs/zh/docs/modules/animation.md
@@ -68,13 +68,13 @@ animation.transition(ref1, {
:::
#### styles中支持动画的属性
-* **`width`**，`width`表示动画执行后应用到组件上的宽度值。如果你需要影响布局，设置`needLayout`为`true`。默认值为`computed width`。支持`wx`单位。
-* **`height`**，`height`表示动画执行后应用到组件上的高度值。如果你需要影响布局，设置设置为 `needLayout`为`true`。默认值为`computed width`。支持`wx`单位。
+* **`width`**，`width`表示动画执行后应用到组件上的宽度值。如果你需要影响布局，设置`needLayout`为`true`。默认值为`computed width`。
+* **`height`**，`height`表示动画执行后应用到组件上的高度值。如果你需要影响布局，设置设置为 `needLayout`为`true`。默认值为`computed width`。
* **`backgroundColor`**，`backgroundColor`动画执行后应用到组件上的背景颜色，默认值为computed backgroundColor。
* **`opacity`**，`opacity`表示动画执行后应用到组件上的不透明度值，默认值为computed opacity。
* **`transformOrigin`**，`transformOrigin`定义变化过程的中心点，如`transformOrigin: x-axis y-axis` 参数 `x-axis` 可能的值为 `left`、`center`、`right`、长度值或百分比值，参数 `y-axis` 可能的值为 `top`、`center`、`bottom`、长度值或百分比。默认值为`center center`。
-* **`transform`**，`transform`变换类型，可能包含rotate`，`translate`，`scale`及其他属性。默认值为空。支持
- * `translate`/`translateX`/`translateY`指定元素要移动到的位置。单位是长度或百分比，默认值是0。支持`wx`单位。
+* **`transform`**，`transform`变换类型，可能包含rotate`，`translate`，`scale`及其他属性。默认值为空。
+ * `translate`/`translateX`/`translateY`指定元素要移动到的位置。单位是长度或百分比，默认值是0.
* `rotate`/`rotateX`/`rotateY`**v0.16+** 指定元素将被旋转的角度。单位是度 *角度度*，默认值是0
* `scale`/`scaleX`/`scaleY`按比例放大或缩小元素。单位是数字，默认值是1
* `perspective`**v0.16+** 观察者距离z=0平面的距离，在**Android 4.1**及以上有效。单位值数字，默认值为正无穷。
diff --git a/docs/zh/docs/styles/common-styles.md b/docs/zh/docs/styles/common-styles.md
index 6dd4962..669189e 100644
--- a/docs/zh/docs/styles/common-styles.md
+++ b/docs/zh/docs/styles/common-styles.md
@@ -7,7 +7,7 @@ Weex所支持的通用样式已在本文档中全部列出，一些组件可能
:::
::: warning
-对于长度值，Weex所有样式均支持`px`单位，部分样式支持`wx`单位，不支持相对单位（`em`、`rem`），详见[CSS单位](https://weex.apache.org/zh/docs/styles/css-units.html)。
+Weex 对于长度值目前只支持`px`和`wx`（不受屏幕宽度和viewPortWidth影响），不支持相对单位（`em`、`rem`）。
:::
## 盒模型
diff --git a/docs/zh/docs/styles/css-units.md b/docs/zh/docs/styles/css-units.md
index 2295518..4b7a278 100644
--- a/docs/zh/docs/styles/css-units.md
+++ b/docs/zh/docs/styles/css-units.md
@@ -2,27 +2,13 @@
## CSS 长度单位
-在 Weex 中，**所有样式支持`px`长度单位，部分样式支持`wx`**。
+在 Weex 中，我们**支持 `px`和`wx` 长度单位**。对于不希望受屏幕宽度和 viewPortWidth 影响的尺寸，请使用 `wx` 单位。
::: warning 注意
- Weex 不支持类似 `em`、`rem`、`pt`,`%` 这样的 CSS 标准中的其他长度单位；
- 单位 `px`或`wx` 不可省略，否则在 H5 环境无法正确渲染；
:::
-### wx单位
-使用 `wx` 单位可使尺寸不受屏幕宽度和 viewPortWidth 影响。以下是支持`wx`单位的样式。
-* 通用盒模型：
- * `width {length}`
- * `height {length}`
- * `padding {length}`
- * `margin {length}`
- * `border-width {length}`
-* Transform：
- * `translate {length}`
-* 文本样式：
- * `font-size {number}`
- * `line-height {length}`
-
## CSS 数值单位
在 Weex 中，除了长度单位外，还有数值单位，仅仅一个数值，后面没有 `px` 等单位。用于 `opacity`，`lines`，`flex` 等属性指定一个纯数值。