The elastic sliding--android of the view in Android development Art exploration notes

<span id="Label3"></p><p><p>Welcome reprint, Reprint Please indicate the source http://blog.csdn.net/l664675249/article/details/50732132</p></p>Introduced<p><p>Elastic sliding is also progressive sliding, there are many ways to achieve elastic sliding, but they all have a common idea: a large slide is divided into several small slides and completed over a period of time. This paper mainly introduces three kinds of elastic sliding way, Scroller, animation and Handler.</p></p><p><p><strong>The "swipe" in this article refers to the slide of the view content rather than the change in the View's Location.</strong></p></p>Example<p><p>Tap anywhere on the screen, when your finger touches the screen, the text that triggers the action_down screen slides upward by 400px, and the action_up text drops 400px when the finger leaves the Screen.</p></p><p><p></p></p>Basic Knowledge Supplement <ul> <ul> <li>View's width height and coordinate relationship: width = Right-left,height = Top-bottom.</li> <li>When the view is panning, top and left represent the position information of the original upper right corner, whose value does not change, and the four parameters of x, y, translationx, translationy are Changed.</li> <li>X is the coordinate of the upper-left corner of the view, translation is the offset from the parent container after the view is moved, so there is x = Translationx. Y is the same principle.</li> <li>Getx/gety returns the x and Y coordinates relative to the upper-left corner of the current view, and Getrawx/getrawy returns the x and Y coordinates relative to the upper-left corner of the phone Screen.</li> </ul> </ul>Using Scroller<pre class="prettyprint"><code class="language-java hljs "><span class="hljs-keyword"><span class="hljs-keyword">Private</span></span> <span class="hljs-keyword"><span class="hljs-keyword">void</span></span> <span class="hljs-title"><span class="hljs-title">Smoothscrollto</span></span>(<span class="hljs-keyword"><span class="hljs-keyword">int</span></span>destx,<span class="hljs-keyword"><span class="hljs-keyword">int</span></span>Desty) {<span class="hljs-keyword"><span class="hljs-keyword">int</span></span>SCROLLX = Getscrollx ();<span class="hljs-keyword"><span class="hljs-keyword">int</span></span>Detlax = destx-scrollx;<span class="hljs-keyword"><span class="hljs-keyword">int</span></span>scrolly = getscrolly ();<span class="hljs-keyword"><span class="hljs-keyword">int</span></span>Detlay = desty-scrolly; LOG.D (TAG,<span class="hljs-string"><span class="hljs-string">"smoothscrollto:scrolly, detlay="</span></span>+ scrolly+<span class="hljs-string"><span class="hljs-string">" "</span></span>+ detlay); Mscroller.startscroll (scrollx, scrolly, detlax, detlay,<span class="hljs-number"><span class="hljs-number"></span> +</span>); Invalidate (); }<span class="hljs-annotation"><span class="hljs-annotation">@Override</span></span> <span class="hljs-keyword"><span class="hljs-keyword"></span> public</span> <span class="hljs-keyword"><span class="hljs-keyword">void</span></span> <span class="hljs-title"><span class="hljs-title">Computescroll</span></span>() {<span class="hljs-keyword"><span class="hljs-keyword">if</span></span>(mscroller.computescrolloffset ()) {scrollTo (mscroller.getcurrx (), Mscroller.getcurry ()); Postinvalidate (); } }</code></pre><p><p>The above is a typical way to achieve elastic sliding using scroller.</p></p><p><p>The principle of implementation is: scroller itself can not let the view elastic sliding, it needs and view of the Computescroll method to work together to complete this Function. The Startscroll () method has been downgraded with invalidate (), which allows the view to redraw, and the view redraw will call Computescroll () in the draw method, where Scrollto is called to the specified Position. The Postinvalidate () is then redrawn two times, so repeat until the slide is Finished.</p></p><p><p>Here is the source code for the Computescrolloffset () Function. It can be seen from the timepassed that the end of the slide is determined by the Standard.</p></p><pre class="prettyprint"><code class="language-java hljs "><span class="hljs-javadoc">/** * Call this is the new location of <span class="hljs-javadoc">want to KNOW. If it returns true, * The animation is not yet Finished. */</span></span> <span class="hljs-keyword"><span class="hljs-keyword"></span> public</span> <span class="hljs-keyword"><span class="hljs-keyword">Boolean</span></span> <span class="hljs-title"><span class="hljs-title">Computescrolloffset</span></span>() {<span class="hljs-keyword"><span class="hljs-keyword">if</span></span>(mfinished) {<span class="hljs-keyword"><span class="hljs-keyword">return</span></span> <span class="hljs-keyword"><span class="hljs-keyword">false</span></span>; }<span class="hljs-keyword"><span class="hljs-keyword">int</span></span>timepassed = (<span class="hljs-keyword"><span class="hljs-keyword">int</span></span>) (animationutils.currentanimationtimemillis ()-mstarttime);<span class="hljs-keyword"><span class="hljs-keyword">if</span></span>(timepassed < Mduration) {<span class="hljs-keyword"><span class="hljs-keyword">Switch</span></span>(mmode) {<span class="hljs-keyword"><span class="hljs-keyword"></span> case</span>Scroll_mode:<span class="hljs-keyword"><span class="hljs-keyword">Final</span></span> <span class="hljs-keyword"><span class="hljs-keyword">float</span></span>x = minterpolator.getinterpolation (timepassed * mdurationreciprocal); Mcurrx = mstartx + math.round (x * mdeltax); Mcurry = Mstarty + math.round (x * mdeltay);<span class="hljs-keyword"><span class="hljs-keyword"></span> break</span>;<span class="hljs-keyword"><span class="hljs-keyword"></span> case</span>Fling_mode: ...<span class="hljs-keyword"><span class="hljs-keyword"></span> break</span>; } }<span class="hljs-keyword"><span class="hljs-keyword">Else</span></span>{mcurrx = mfinalx; Mcurry = mfinaly; mfinished =<span class="hljs-keyword"><span class="hljs-keyword">true</span></span>; }<span class="hljs-keyword"><span class="hljs-keyword">return</span></span> <span class="hljs-keyword"><span class="hljs-keyword">true</span></span>; }</code></pre>Using animations<pre class="prettyprint"><code class="language-java hljs "> <span class="hljs-keyword"><span class="hljs-keyword">Private</span></span> <span class="hljs-keyword"><span class="hljs-keyword">Static</span></span> <span class="hljs-keyword"><span class="hljs-keyword">Final</span></span> <span class="hljs-keyword"><span class="hljs-keyword">int</span></span>Frame_count =<span class="hljs-number"><span class="hljs-number"></span> -</span>;<span class="hljs-keyword"><span class="hljs-keyword">Final</span></span> <span class="hljs-keyword"><span class="hljs-keyword">int</span></span>StartX =<span class="hljs-number"><span class="hljs-number">0</span></span>;<span class="hljs-keyword"><span class="hljs-keyword">Final</span></span> <span class="hljs-keyword"><span class="hljs-keyword">int</span></span>DeltaX =<span class="hljs-number"><span class="hljs-number"></span> -</span>; Valueanimator animator = Valueanimator.ofint (<span class="hljs-number"><span class="hljs-number">0</span></span>,<span class="hljs-number"><span class="hljs-number">1</span></span>). Setduration (<span class="hljs-number"><span class="hljs-number"></span> +</span>); Animator.addupdatelistener (<span class="hljs-keyword"><span class="hljs-keyword">New</span></span>Animatorupdatelistener () {<span class="hljs-annotation"><span class="hljs-annotation">@Override</span></span> <span class="hljs-keyword"><span class="hljs-keyword"></span> public</span> <span class="hljs-keyword"><span class="hljs-keyword">void</span></span> <span class="hljs-title"><span class="hljs-title">onanimationupdate</span></span>(valueanimator Animator) {<span class="hljs-keyword"><span class="hljs-keyword">float</span></span>fraction = Animator.getanimatedfraction (); Mbutton1.scrollto (startX + (<span class="hljs-keyword"><span class="hljs-keyword">int</span></span>) (deltax * fraction),<span class="hljs-number"><span class="hljs-number">0</span></span>); } }); Animator.start ();</code></pre><p><p>In the above code, the animation essentially does not work on any object, but completes the entire animation process within 1000ms. This method Scrollto (startX + (int) (deltax * fraction), 0) makes the view slide a bit each time the animation is Updated.</p></p>Using handler<pre class="prettyprint"><code class="language-java hljs "> <span class="hljs-keyword"><span class="hljs-keyword">Private</span></span> <span class="hljs-keyword"><span class="hljs-keyword">Static</span></span> <span class="hljs-keyword"><span class="hljs-keyword">Final</span></span> <span class="hljs-keyword"><span class="hljs-keyword">int</span></span>Message_scroll_to =<span class="hljs-number"><span class="hljs-number">1</span></span>;<span class="hljs-keyword"><span class="hljs-keyword">Private</span></span> <span class="hljs-keyword"><span class="hljs-keyword">Static</span></span> <span class="hljs-keyword"><span class="hljs-keyword">Final</span></span> <span class="hljs-keyword"><span class="hljs-keyword">int</span></span>Delayed_time =<span class="hljs-number"><span class="hljs-number"></span> -</span>;<span class="hljs-keyword"><span class="hljs-keyword">Private</span></span>Handler Mhandler =<span class="hljs-keyword"><span class="hljs-keyword">New</span></span>Handler () {<span class="hljs-keyword"><span class="hljs-keyword"></span> public</span> <span class="hljs-keyword"><span class="hljs-keyword">void</span></span> <span class="hljs-title"><span class="hljs-title">Handlemessage</span></span>(Message Msg) {<span class="hljs-keyword"><span class="hljs-keyword">Switch</span></span>(msg.what) {<span class="hljs-keyword"><span class="hljs-keyword"></span> case</span>Message_scroll_to: {mcount++;<span class="hljs-keyword"><span class="hljs-keyword">if</span></span>(mCount <= Frame_count) {<span class="hljs-keyword"><span class="hljs-keyword">float</span></span>fraction = mCount/(<span class="hljs-keyword"><span class="hljs-keyword">float</span></span>) frame_count;<span class="hljs-keyword"><span class="hljs-keyword">int</span></span>SCROLLX = (<span class="hljs-keyword"><span class="hljs-keyword">int</span></span>) (fraction *<span class="hljs-number"><span class="hljs-number"></span> -</span>); Mbutton1.scrollto (scrollx,<span class="hljs-number"><span class="hljs-number">0</span></span>); mhandler.sendemptymessagedelayed (message_scroll_to, delayed_time); }<span class="hljs-keyword"><span class="hljs-keyword"></span> break</span>; }<span class="hljs-keyword"><span class="hljs-keyword">default</span></span>:<span class="hljs-keyword"><span class="hljs-keyword"></span> break</span>; } }; };</code></pre><p><p>In the handler handlemessage, call the View's Scrollto method to slide some distance, and then send a delay message to handler again to Slide. Key methods mhandler.sendemptymessagedelayed (message_scroll_to, delayed_time).</p></p>Source code for example animation effects<p><p>The animation effect in the example is done in one textview, and the text in the TextView is Sliding. The source code is as Follows.</p></p><pre class="prettyprint"><code class="language-java hljs "><span class="hljs-javadoc"><span class="hljs-javadoc">/** * Created by Spark on 2/22/2016 21:12.</span> * *</span><span class="hljs-keyword"><span class="hljs-keyword"></span> public</span> <span class="hljs-class"><span class="hljs-class"> <span class="hljs-keyword">class</span> <span class="hljs-title">elastictext</span> <span class="hljs-keyword">extends</span> <span class="hljs-title">TextView</span> {</span></span> <span class="hljs-keyword"><span class="hljs-keyword">Private</span></span> <span class="hljs-keyword"><span class="hljs-keyword">Static</span></span> <span class="hljs-keyword"><span class="hljs-keyword">Final</span></span>String TAG =<span class="hljs-string"><span class="hljs-string">"elastictext"</span></span>;<span class="hljs-keyword"><span class="hljs-keyword">Private</span></span>Scroller mscroller;<span class="hljs-keyword"><span class="hljs-keyword">Private</span></span>Velocitytracker mvelocitytracker;<span class="hljs-keyword"><span class="hljs-keyword"></span> public</span> <span class="hljs-title"><span class="hljs-title">Elastictext</span></span>(context Context) {<span class="hljs-keyword"><span class="hljs-keyword">Super</span></span>(context); Init (); }<span class="hljs-keyword"><span class="hljs-keyword"></span> public</span> <span class="hljs-title"><span class="hljs-title">Elastictext</span></span>(context context, AttributeSet Attrs) {<span class="hljs-keyword"><span class="hljs-keyword">Super</span></span>(context, attrs); Init (); }<span class="hljs-keyword"><span class="hljs-keyword"></span> public</span> <span class="hljs-title"><span class="hljs-title">Elastictext</span></span>(context context, AttributeSet attrs,<span class="hljs-keyword"><span class="hljs-keyword">int</span></span>Defstyleattr) {<span class="hljs-keyword"><span class="hljs-keyword">Super</span></span>(context, attrs, defstyleattr); Init (); }<span class="hljs-keyword"><span class="hljs-keyword">Private</span></span> <span class="hljs-keyword"><span class="hljs-keyword">void</span></span> <span class="hljs-title"><span class="hljs-title">Init</span></span>() {mscroller =<span class="hljs-keyword"><span class="hljs-keyword">New</span></span>Scroller (getcontext ()); Mvelocitytracker = Velocitytracker.obtain (); }<span class="hljs-annotation"><span class="hljs-annotation">@Override</span></span> <span class="hljs-keyword"><span class="hljs-keyword"></span> public</span> <span class="hljs-keyword"><span class="hljs-keyword">Boolean</span></span> <span class="hljs-title"><span class="hljs-title">ontouchevent</span></span>(motionevent Event) {<span class="hljs-keyword"><span class="hljs-keyword">Switch</span></span>(event.getaction ()) {<span class="hljs-keyword"><span class="hljs-keyword"></span> case</span>Motionevent.action_down: {LOG.D (TAG,<span class="hljs-string"><span class="hljs-string">"ontouchevent:actiondown"</span></span>); Mscroller.startscroll (getscrollx (), getscrolly (),<span class="hljs-number"><span class="hljs-number">0</span></span>,<span class="hljs-number"><span class="hljs-number"></span> -</span>,<span class="hljs-number"><span class="hljs-number"></span> -</span>); Invalidate ();<span class="hljs-keyword"><span class="hljs-keyword"></span> break</span>; }<span class="hljs-keyword"><span class="hljs-keyword"></span> case</span>motionevent.action_move: {<span class="hljs-keyword"><span class="hljs-keyword"></span> break</span>; }<span class="hljs-keyword"><span class="hljs-keyword"></span> case</span>Motionevent.action_up: {LOG.D (TAG,<span class="hljs-string"><span class="hljs-string">"ontouchevent:action_up"</span></span>); Mscroller.startscroll (getscrollx (), getscrolly (),<span class="hljs-number"><span class="hljs-number">0</span></span>, -<span class="hljs-number"><span class="hljs-number"></span> -</span>,<span class="hljs-number"><span class="hljs-number"></span> -</span>); Invalidate ();<span class="hljs-keyword"><span class="hljs-keyword"></span> break</span>; }<span class="hljs-keyword"><span class="hljs-keyword">default</span></span>:<span class="hljs-keyword"><span class="hljs-keyword"></span> break</span>; }<span class="hljs-keyword"><span class="hljs-keyword">return</span></span> <span class="hljs-keyword"><span class="hljs-keyword">true</span></span>; }<span class="hljs-keyword"><span class="hljs-keyword">Private</span></span> <span class="hljs-keyword"><span class="hljs-keyword">void</span></span> <span class="hljs-title"><span class="hljs-title">Smoothscrollto</span></span>(<span class="hljs-keyword"><span class="hljs-keyword">int</span></span>destx,<span class="hljs-keyword"><span class="hljs-keyword">int</span></span>Desty) {<span class="hljs-keyword"><span class="hljs-keyword">int</span></span>SCROLLX = Getscrollx ();<span class="hljs-keyword"><span class="hljs-keyword">int</span></span>Detlax = destx-scrollx;<span class="hljs-keyword"><span class="hljs-keyword">int</span></span>scrolly = getscrolly ();<span class="hljs-keyword"><span class="hljs-keyword">int</span></span>Detlay = desty-scrolly; Mscroller.startscroll (scrollx, scrolly, detlax, detlay,<span class="hljs-number"><span class="hljs-number"></span> +</span>); Invalidate (); }<span class="hljs-annotation"><span class="hljs-annotation">@Override</span></span> <span class="hljs-keyword"><span class="hljs-keyword"></span> public</span> <span class="hljs-keyword"><span class="hljs-keyword">void</span></span> <span class="hljs-title"><span class="hljs-title">Computescroll</span></span>() {<span class="hljs-keyword"><span class="hljs-keyword">if</span></span>(mscroller.computescrolloffset ()) {scrollTo (mscroller.getcurrx (), Mscroller.getcurry ()); Postinvalidate (); } }}</code></pre><p><p>Welcome reprint, Reprint Please indicate the source http://blog.csdn.net/l664675249/article/details/50732132</p></p> <p><p>The elastic sliding--android of the view in Android development Art exploration notes</p></p></span>