跑馬燈的效果也就是不斷的將字串的最後乙個字元移動到字串最前面,涉及到的知識點也就是定時器、字串拼接、vue事件繫結等等
<div
id>
<
p>}
p>
<
div>
<
button
@click
="lang"
>浪起來
button
>
<
button
@click
="stop"
>穩健發育
button
>
div>
div>
<
script
src="../js/vue.js"
>
script
>
<
script
>
let vm
=new
vue(,
methods:,1000);if(
this
.interval_id
!=null
) return
;
//箭頭函式沒有this問題
this
.interval_id
=setinterval(()
=>
,400
); },
stop:
function
() }
}});
script
>
1doctype html
>
2<
html
lang
="en"
>
3<
head
>
4<
meta
charset
="utf-8"
>
5<
title
>7、跑馬燈效果
title
>
6head
>
7<
body
>811
<
div
id>
12<
p>}
p>
13<
div>
14<
button
@click
="lang"
>浪起來
button
>
15<
button
@click
="stop"
>穩健發育
button
>
16div
>
17div
>
18<
script
src="../js/vue.js"
>
script
>
19<
script
>
20let vm
=new
vue(,
26methods:,1000);
32if
(this
.interval_id
!=null
) return;33
34//
箭頭函式沒有this問題
Vue跑馬燈效果
下面展示 doctype html en utf 8 x ua compatible content ie edge viewport content width device width,initial scale 1.0 document title vue.js script head sho...
跑馬燈效果
cgrect frame labelshow.frame frame.origin.x 180 labelshow.frame frame uiview beginanimations testanimation context null uiview setanimationduration 8....
跑馬燈效果
一句話概括,平移再畫一次。textview 預設就支援跑馬燈效果,但需要設定一些東西,滿足一些條件。但我想知道它的原理。看這效果,就是平滑移動 textview 的內容,這不就是 mscrollx 幹的嗎,結合 valueanimator 很容易就實現了。難點在於,把文字的頭部重新從右邊開始畫出來。...