From f4fe2518ed7315dd030dc9396db56f0a421829a1 Mon Sep 17 00:00:00 2001 From: "ester.zhou" Date: Tue, 25 Apr 2023 09:01:00 +0800 Subject: [PATCH] Update docs (16571) Signed-off-by: ester.zhou --- .../reference/arkui-ts/figures/coordinates.png | Bin 0 -> 10785 bytes .../ts-universal-attributes-transformation.md | 13 ++++++++----- 2 files changed, 8 insertions(+), 5 deletions(-) create mode 100644 en/application-dev/reference/arkui-ts/figures/coordinates.png diff --git a/en/application-dev/reference/arkui-ts/figures/coordinates.png b/en/application-dev/reference/arkui-ts/figures/coordinates.png new file mode 100644 index 0000000000000000000000000000000000000000..839f765b9f62dd9efcf1d2ee891a191c9a5ba053 GIT binary patch literal 10785 zcmbVyXH=6-w601=2t;Zmlq58%A_$?EK!Tw3UZqG81VT|nP(g*z0$31~q9DB&=|~Gr zIs#IqS5bOV5YO^Wbsk!RX0sxiQdw=jiuNBh39e+dDAlO!!Evy~0 ze}+4-nTuTN^wn(bUg}MDlk47YBxBI457-+LPic>fOuBN5_LaD0Z+S3>JB&(a(Du=v zj8Cr7+2Y&jF-mi$cf`GCo1f(_bZcB(ellGd6lWW>_ev8*!ixY+V$)2%NE=(j17Rjxb5KN?-a zvylydPafcK7csL-gj&l5i@1a>l5+mNjc;pFM~9_I=kA2}THj{7BBCe^;vloN5hB(# zQha=TB`m@w*OUFYrvnzEWxi!={oDZqFOM3m`|k8i(-Y(HY{$;$xy+W$CXUe; zudc)>pUgapeH%Td0#2}ukbc@zxhu{K9dW)(-LRV7LG9th(ewk6?j?8f0kcw-Y%<{jlYEn(IeLzO!tZ z4=8?&cmFz{ZD{f=;fEyMt<=D6ntR42&CTuwo|i3*c`30K9ur!)6W;NF{=kz~BBw&~ zZ~1@L+qEIqU=!%+JbcnVF_Ke4}-ilG2sm*=9h7_fsH*AYxEjtl(fyD{I5mI?kF5Mm) zNT)NI3WfFi7JmFvDJG5|Zx0(?l9Ds#RVky3-kIFYN0vCZ(t_XnF=_fK6V~JkIhyK2 zA0zbR%$`LarZl~>Z(lcYJURYl9KN#MC2q>+V^!1U?kVBz1JqfL_-DnG%UjBZO^ zbY=M}bj3hdih5sDGSasaGil;jVDZuDl6St5;|JE)EU+7V=W;qk^2?cgP_x3N0efq? z%$(UBPk*?*7Pqx|l_p>(JQzM98~Ze0Q$TTmXIAKntgQK~q-Vn0?jc6JtnX@C!BDeJ zrynkH#JG=Z2mS6}8Aum|DHpQjbyCCJ42r6tjdMI>o7v`J7u|Y_#Cm z-RNob&xpHs@W!oh)|8XlGH!*-J~7nJW^=u)?@i{+dGfCH*puasIMmwpbsF zF4DvE&eZ=r4F4VtRbdi>qJS}s8A;h$d)YoJHivpOhLEa*fViGrc<%bGPBvqxKzmP0 z+RApmE!y9M`a$~C6%p;H7$iA4UEaEoNxo*!o2&EX5(7LCSm?&5BjVcEB3%@gE-PYD zn9(T~k~H{bKb7}$z+Xo9C%*WS0ArZcS(@$7 z@uJ$oCiycC*Da93ba(U7iLkb7n0T1`q)H~t{hOCh$_2s;*Fo8D|OX^E1~xsuC_ zVY?7~he(CT)Mw)1m~(25BpVX4%1QGhR-rGUy$zOV{s)ptr3`b@rO!2jcV&2Gx=q!Cy zv%m4XM`k*y{__FAubEd34JW^axhI;wLaKp33fOF-O4o_H1cAM|>Ne6pY--!{WIjQG za96YAH6(np(O*jb734bniqxq``CinJ@_YYB*Mo5)mtyX>lCUE9b{O}=clp`kgx=}Wxt!$9+OGck z7mX5h&z}0sqJuiUl_1NphhlW?#d_0MZJ4!{|VWa~u2t)|7D&dmOW3!f( z`Y^ZGA5)AOzuM9{c?GW-)6vl}W8;$_VvJsl^>~Z^&~>v!fEf?y#oBfEQ-g|fUXT{K{*BQggAA>m(FcvD{DG4FU19tpeEbHl7Swh0Or1s}RuPE;o2ZKtZ z-W~JpF<(Ahd$9uO#)ohwfzlgqrK88oU0dX5Cdaus0R+^yl;EV1HVAe(=0OJXTm^e_ z;{pp~PK~w+&xW2~uxN#f;G21r9yg~wVOb3h|9-!lB$t-2OP#D*PpHq3g zw87|+9H=+dk2`2ylXvHr2$&i=gXl&YJC{M~S!ft@xfCS%J-EZ@%v`RT zq~A}8$EtFWV9y9+B@R@a3jTVWvSH|SMu`^!x=XE{r@TSH`5rAEi?C-EF>7>_DM42Q zMVpy!A-A$OYwNK#i-$7kk++p_|{@`hWjCm zJ&-kmse|o+a8ca_V@G*>o0ZB+W17ZB1|+$rf4BO)>vp%S#d!JH&PophzmqKX{u@~z z{wzxDK5Z8LcbSsbb8p9H2-xga=hUEhnaX5^aLuKCMrXRS6{tpN+~dHR#^536Mjp9% zzmvvGiu7aLBOVjl#=@p^qDYT(IB|<|!HwsnhdH;p;&bk$VUi@M9a0&%dPFVCXXJx+ zSM-PKO}WQ?j>W$iambDK+V=KG_*v#?WkmR{kK#{cswnK6ln*9-%JK79IX|KAI$qRx zER)>5pWU^*x~WP%?JZ&S>0I?k{onHcI!NOBn|fvED|~wWC#{`*wePpW$Qnrd8<1h^fr`(6$BwW$}uuPf% zRx8_mI?*BaM0C0gZ@FX|f+#(=)2GaRx6l~WxG)Zr2t8bQp=;A`E`d3HFarBBIGBCy z1^+I9=3L45Q0Lvyr#{%-q*+3Y;y!y=MOnycOG%RUhm_{c5N@UX-UZ_6lb4eA5ezX- zWwUR+2$D9ZtP1^A2Dwie0+|Ig1qdgd3MbbK%`j*xJd*1&(M7Ct~iv0E=` zPginhqCz(F5UH9pkmT9$Cw|@ld86x8Y2KUiW9!?PXszre*hpp`7XRjd-Wvg%i+aC0 zRVy>))j|)S2%M<6vzD(IxEf`~9;tPEtTY4Fl}v(R$~>o)Oxl6(+Ab+sAwfR*Vtq~e z(<4ow^q}yGY>=-LEwiA?M*TsGoEyWmEQ(c8VY>t63pRoue*g*A15@z7%pzhIYubX^ zo7P~nCf&cgKF8rq^1`Gl1yz;V---~wK!W*{I`v%q{8mOBumv9+g#y_v}!zxf-4txUr+enw?aTA?B zmR=o{JtS_)ww!xpn556tk0ov1kTTSb zV=N?lg5xF9<7k(o{CDTd{OJ#-8n1A*AJQqgEk#v9Ubey%DF@CMue`^ELG*jB;YikZ%RDMNs;!oROfw$V6CaSeEYQxnFsKy4Cws+f|uAOcAPcbJ@a&y=5k zPXOG$^y=M3^0}yQ@9HI+p%Q5uw>Tu&!BOlVhn3u?jaXTFT){$u)vIbdle%ds%OnER z$xbULgUTh53@tJ?2X8Ql-WB?BS=4@hqx~3`uFVTO#+@(=D1*5FgRT< zvr+z1El}>DU41{S_-UKxok=OL*lhd}OZ7{71jztQcQW+t_marIPDNoI6lhe!2iu)_ zQ-uSZv<1TJe`+K_^E@Xfg=TocC>WWXN$mDOD1Q8YHB1ehe1&^ppI;7~Zxd6hWOUx8 z>`NLLRd~iePOW@Fw-NSWk5i>8Xy5sxkZ*anWCv%Jco$6AoY;}akpc#PRe7gdlK2e1 z^*j!R)th?BycRd|y5`f%%nZMcy(@|nIp>|_hwnQg;VEcT5+m987C;*Z^>|5X*U1E% zpgoq0v3`cDw^x`Uuq&j2h37VNxu@{5iudEjb;fS}ItgZa8lR4mTJO;HynFN)2 zH6vCii%JVd>__Y5d9EYDl=bCN``P5Zm(sJMx(%t9e%}2+RRpFInw^XX5w$uuPav`3 z-sJU8?xitVc+%v5m2J(nzI^$TR8ls8C3R~lK&GFbB4OHH?E0jzaW1oQj={6`s!zX` zIQEE-{&^({+B6Z#Ca&{J*wo26->d}5Cm`@8*EnxT;P}*7>Wfi;+AiaymkvtIYsJwNGy6SrgI?SiWPZ~G}Ovuyga`qqK2NWn>h9GI70)|b3iSmHAfMY#1 zA|87lSpEq*odUep6fbH26Xw(Jv}8OYBz_9)gk)%5b$blA?!DL%g zQNOkV%gSw&si32MpgpeK`po=Ib@g?$+rS(_Qs<3SI0!^(+dll2AvZ7HM&xvJWBLn@ z;mZDmXBJ=uIg-n&Lt)SPv={=9Z z4>X==3{18VW!@70I2*(ZGUVhKDx7$(7EMbRX<&>1=3kW)8_kUnba;5KiE490$S{-6 zIM*m#-kDG9=-A*d1qe);x9p?wh`6 zatZX#$#Q-M&M2}Q34jMC;1G>#!+EP~c}1D@9MYR5UJ%RPD&JKD4}lW^cY#s0^8Lr8 z$!eeb@Q)TBZ;$mlhQ0Nu34fAtu3R-^{`m`FB}tLdHx^Z1cEp?~L$@{MXfUwlV)HIt zo(f+3>sTh+3o(v@B5Ra)H0i!mvt1~WOsjtaV~-L>D&2e61eM^r2Uz)@>!VE&>iUwV z5jhm62;oxbm@lq!EvjC+=x0Jr8gaN--|4j^lXQ3w;U&b(`ePk1^qev^o(lQPY70>u zGQ^XOzbCpA<-R4@qyf~sDE8jf;k?&!C~^QbP~e0!I6SI?_t(eLd#RfUk~P%lGVL2V zevm>a&JS)cb`8si0N*PXlA}a!*sAvY$3$gbnVKL8M)7|#$^XX(1Y)4k zlO+2h*R-fNZWLNjXI1UJ+kuMd2az||)(93j8Abp!iBs{0IyR0~+~K(Mtu9g8bKJLA zI#R=Z%&#)B!o72b4x?$^xOdSxJ}$1Qh?@VTSAIheICI%!uUA6Gqdc*ii)Xa2U7L;P zGe|A4s(z07(OhIdOwWdAPNUQ>WF*0RZA31G-yX`nQIP7Po1^&{q&!P;;-2-6vWEw$1qkh&n{c9~Z!f~w^sQiS_6gYxm^BkIA3nPE-Q z5btNSEa-Pi_ScY4Oo7ICB@v(^xg~24Bhj=_=pl31JhI{e@LGbhvWYFY*O#nAe?#Ev zxV~f6qet?X3CTxHk&P9%#!_r`4VH3Vlzac-zbL(QBiEq%LNr_{3g~k!0iC3oYxH$( zPi8IbIuLtcG{r^lwCN>C!Zo8VSCL(sUkj~&Np>_n&F*8=;H`;`PiK^Q_x9=J4KI%m zHRkmJH%z{Ip05WnQ=@8ojkW#3F5d;+G{yG6X;EYXu3b$ck~Xc)7HucfF74vZD>JTX zEZ-{z`@gmuzS3fGT_}DJ2z5!-ji#qt>W|*p!MV-JFPeos??zCCEQb|jAF-~MmJQzh zUlp2Ed|!fCjF&dFR;>7e-RGB=;OsmX|GW2H*5}y8An6tQurc zobz>(KDRoY=`lF8JJJmxu(osVCqTq5CQ%dUzatpPdUq71m}~a@Nl@O6H&X9GjAhF# zo#S-+4_R^RMQsrTpzL@0i7Yei{#D{uRk1QCkh+;DlVim1A^;H2-+4H?FrA^z_8S1= z{r#~USr>&&e-Xsqlezq7&fXr*W!bRvt2u&4+{8=OZnfqoPS*~P8a+|hT6d#=&8|9lxaB<_hzG$n%=aZ%%{Y`#GBdQ_N?mChWt7NVx=8DX%B=I#T%=aeC zuQpL}FR;$mAACFYW_+pb#SArlgyjT~>$yEyCDD^888*Fh5!#M+`Z4}-sM6CG!Zlvw z=k`Xf*$aE zDZViIyZHgjYQ=3($%({^vud|nv`M7oaU${s99g!Y&l{KQ_)w0r3H`h z6A|#>IjWK-PpS%qtxpINqf{NYNN8|_!}3Nmk9V6a0rn8J88kn>Y1!r{VqUG(e$*y= z96cka^;DwWUxhT_Ff+*>7%IpwAh2^&s^S-7>%M{mKhea3=s)cuL6O>i5bgc$F?*T= zyk+y#R%Q1$86~nU%vkUAGl~<=IyJ$qgAh?YI9UTji)@|qF?MqrEG9sf7!}hqXA%8D zZJ!K8=CH(gy|LrD=+rwz*))o02V1grVGdxO+C0h66B1X*BjUF{4g6`V22#+PN9*p1 zn8@bFOy$;Fbl65CPgQ7@1r#@b*4~P&HyphdOh~87xA++Gdv~>^tj{cq;2#keRZSvO z4r6Rrd6K|xf6K|gkCEUaV)l{_L3>N*c*^Aw*;f}rDIuMUfUcpYOr7}X)}BWAxdYN} z>}3=M9u6At`cgg73V(psiU3yGyYuamkrm3rd8RR^;X}lmI^y&Bt8(EEbpVGzBXZQG z2Z$8p-EyAh4nXXJ#3LxdsZIRPvNI#Ldn*G^Ud&dyk3H8I^mK@*MgVmA&ynA_d=&L8 z2l)Cq|A#q0Bp{!Y+g*cfD>ZC3pNGqJi)(wYBmaHbf&3=!eA|UQ zKx-zB0n25sl($I20=NNggbdnl)!61gdFX;b_QK;AKq}Ix)<2?z-we)o^iJ_b-7s)d z?B@u`_ywMh{J3-qd5bwwo~Ne&?ZRBn@tYLa7Xe_Mv{%2Wv#Jz^``1CWpSgTA`O(c3 z(nlO~h8dO<3F(sjbJ+|u;zYvrs5=h{&!2>|0)z>!VuXQZNFbyu@s^{J9U|L?H@BqI z=#MUG5x@RdN3pSU1VLGl+?Aqw+W5`+slD#YI}bg;`b2^C!88+4X|wB-)i21@PVX_u zZ|rP|gfXT4JCf;0lsYs#kS79!ML(DnSm2*?HJNv}Ziz$Nsc!&37AQ*W=nRpHWj9p+ z<}C89x4YYDgI34e2Hs_GAcF5!&@RV)gtz8fww=5vpC=%QmSv~qbR(6;43dztRWnK)((do#P&k9=d@6%ggN#dj z8C-l{b1)xoe_gus+Mcz5)#gRcU2o1@{WAXHeB;QAG9K5N1auazVW7B;&1Y!)>v(X3 zLLoEZ&703@g4*776cVB!C)QhCS^Mb_dCSqUKQo%c6*!}E9T9s>eSvjt=tzNO7efjN zf-Jr{W9t=P#fl>!w-p^WB>637^hS?FbWJyc(U7h+6Nmdl;L^abxhlbSP6v*7*l{%3 z@aR#lZG+NP&u>XeCx;H^S?msgEjPT6MlZ#`Vkl7URzkJ90-lM^2G7B^zNkOj3TN6w^d~%9IYH6CzQRi4t8=^*y&f zzkClaA#C+fs7_XTa^pHxS1tnwGbaRlIl=_RHF=V(;3fQ9Q}?ECodtG58y8w73K?ZL zO7>~ue~&uE3_PV_a=b=dI_)2|Gh z`__mOMm5Hg#Uh}ZlHlC3?}4W7YjQR%wCdFN(@8?Vf2i6Is3aJ#I$T0N+T4}=iHenm zNT2FK0MJb3?qgTR>mOA5zMrT2w^DV;qzDMg&GziB*q`5uCZx~E*efAWhX6O5Ji&B` zrz-{gZWHu$=@D~+=#bMor>f<2aKPoyPy<2?pq3d9q|)XoJ4XFu29mxPP)+}%kvp^g07jpezC%w6_l7bY}&mJ->BN(D`U*@Q@&3+vPc&f2O>xZw-pspvtaAy8iPyj- z9F}EfHBa8bmvyywf6RTjLmeJA*-uSCx&~2@6|}(-vA|qPEJ8*EOCq&%=)z{mi3&V! zXc`>cDm+T@P${1nl%nF4cZAKZ+8ZDY6kmX>PO{SRCT5SwlLR)XLeOt1+@S~H zeDZFqgBh|+@81a={#DC6-xM}*9vygiIS5R5_p@-39?0or1Fjhefgump$6B^z_3z3> zi?zMmI@0_UFXL%*d$br4v_Iy&Hq}290D>LbGE=@xr*Y@gH1F01wHl8E8?KygV6Y=q zS(!!5Dxr)%%}sRWJShVg!<8fiJVU8beSjZvhRExxi9Z{x?k!b^Y?cqj_M;x3sUEna zapHZfs9-ix>DhO}6y$ZirzG2}8WO z={3ckPC8;71k`uOEImJjv6~Q%w$B$76%~C@M>R&lw|D#atQ}0!iLR1P`=uZNMy$6K zuf~HPAHNP|O)UcWkhE%|9fQ>~H3`VJsDYjna9yF@;knIY6GY7qUBx|SYwu3J z$+TpJ`=tQ~lij7%k#9E39oK?AEYsdN*r)C+nGLUxM&!HF~b+5jjlEK#Z z?SS0%8#flic`myS^4j2z`W~IUsQohdiq*S?2~S#I>VJ>vjYZnIM4ba z(Qbb$EmCZ*@WAh@H4Xsc+#)h0UABR%%&$)d1WPM8LUL8TAawPZ`z4)FkRgg zuu3myrx5lZDQNR&NSSLp=M@Dtmk4Ani_u*E-Ol|e+m^|ftRUc6*-l|Buh3U;M%bm3 zpO0^=We>>KOb{l(oBjn!W`ooVPd7=9YFNfe@)k7v^h2=ub5w%QiNv}L*t_8PPssBC z7<$Jw}nmFWO}Lz#WT;bK5YUy z6OIl4rl-@f2#kLwT)vV2bKPB@tgmT0&kVwzitoGRLuSKHNdsbGuJe9)C<*ahWrOSU7Pg) literal 0 HcmV?d00001 diff --git a/en/application-dev/reference/arkui-ts/ts-universal-attributes-transformation.md b/en/application-dev/reference/arkui-ts/ts-universal-attributes-transformation.md index 3427774435..276ed2eb01 100644 --- a/en/application-dev/reference/arkui-ts/ts-universal-attributes-transformation.md +++ b/en/application-dev/reference/arkui-ts/ts-universal-attributes-transformation.md @@ -9,13 +9,16 @@ Transformation attributes allow you to rotate, translate, scale, or transform a ## Attributes -| Name | Type | Description | -| --------- | ------------------------------------------------------------ | ------------------------------------------------------------ | -| rotate | {
x?: number,
y?: number,
z?: number,
angle: number \| string,
centerX?: number \| string,
centerY?: number \| string
} | Rotation axis. A positive angle indicates a clockwise rotation, and a negative angle indicates a counterclockwise rotation. The default value is **0**. **centerX** and **centerY** are used to set the rotation center point.
Default value:
{
x: 0,
y: 0,
z: 0,
angle: 0,
centerX: '50%',
centerY: '50%'
}
Since API version 9, this API is supported in ArkTS widgets.| -| translate | {
x?: number \| string,
y?: number \| string,
z? : number \| string
} | Translation distance along the x-, y-, and z-axis. The translation direction is determined by the positive and negative values. The value cannot be a percentage.
Default value:
{
x: 0,
y: 0,
z: 0
}
Since API version 9, this API is supported in ArkTS widgets.| +| Name | Type | Description | +| --------- | ---------------------------------------- | ---------------------------------------- | +| rotate | {
x?: number,
y?: number,
z?: number,
angle: number \| string,
centerX?: number \| string,
centerY?: number \| string
} | How the component rotates in the coordinate system (as shown below) with the upper left corner of the component as the coordinate origin. (x, y, z) specifies a vector as the axis of rotation.
- **angle**: rotation angle. A positive angle indicates a clockwise rotation, and a negative angle indicates a counterclockwise rotation. The value can be of the string type, for example, **'90deg'**.
- **centerX** and **centerY** are used to set the center of rotation.
The axis and center of rotation are set based on the coordinate system, which remains where it is when the component is moved.
Default value:
{
x: 0,
y: 0,
z: 0,
centerX: '50%',
centerY: '50%'
}
![coordinates](figures/coordinates.png)
Since API version 9, this API is supported in ArkTS widgets.| +| translate | {
x?: number \| string,
y?: number \| string,
z? : number \| string
} | How the component is translated in the coordinate system (as shown below) with the upper left corner of the component as the coordinate origin. Values of **x**, **y**, and **z** indicate the translation distance along the respective axis. A positive value indicates a forward movement towards the respective axis, and a negative value indicates a backward movement towards the respective axis. The translation distance can be a number or a string (for example, **'10px'** or **'10%'**).
Default value:
{
x: 0,
y: 0,
z: 0
}
![coordinates](figures/coordinates.png)
Since API version 9, this API is supported in ArkTS widgets.| | scale | {
x?: number,
y?: number,
z?: number,
centerX?: number \| string,
centerY?: number \| string
} | Scale ratio along the x-, y-, and z-axis. The default value is **1**. **centerX** and **centerY** are used to set the scale center point.
Default value:
{
x: 1,
y: 1,
z: 1,
centerX:'50%',
centerY:'50%'
}
Since API version 9, this API is supported in ArkTS widgets.| -| transform | [Matrix4Transit](../apis/js-apis-matrix4.md) | Transformation matrix of the component. | +| transform | [Matrix4Transit](../apis/js-apis-matrix4.md) | Transformation matrix of the component. | +> **NOTE** +> +> If both the **rotate** and **scale** attributes are set for a component, the values of **centerX** and **centerY** conflict. In this case, the one that is set later in time prevails. ## Example -- GitLab