Custom view of the Big Windmill Series Demo (iii)

Source: Internet
Author: User
Tags gety

Wind Car Series version 1.0 to version 3.0 experience has a lot of shortcomings: the rotation of the windmill is manually written to death, not according to the speed of the movement of the fingers and speed. Version 4.0 will address this issue with the following ideas:

1) Take the center of the windmill picture as the coordinate origin resume a Cartesian coordinate system, capturing the finger press event is also the Motionevent.action_down event, recording the angle of the finger's coordinate point and the right angle coordinate system x positive axis

2) Gets the angle of the current finger coordinate point and the x-axis of the right angle coordinate system when the finger moves.

3) Calculate the difference between the two angles of step 1 and step 2, which is the radian at which the finger moves. And not as dead as it was before version 3.0.

The specific code is designed as follows: Provides the speed controller class Speedcontrol class, which mainly provides the method to get the angle between the current coordinate point and the x-axis, the code of this class is as follows:

Package Rotation.demo.bean;public class Speedcontrol {/** The radian of the current coordinates when the finger is pressed **/private float down_rad;/** the finger move **/ Private float current_move_rad;/** radians increment, whose value equals the center origin of the current_move_rad-down_rad**/private floatδrad;/** picture **/private float x0, y0;public speedcontrol (float x0, float y0) {this.x0 = X0;this.y0 = y0;} /*** * Calculates the radian represented by the angle between the current coordinate point and the x-axis, the radian is calculated as 1rad = 180/math.pi,<br> * Note that the Cartesian coordinate system is divided into four quadrants, and the coordinate point of each quadrant is calculated with the angle of the x-axis to calculate the * * @param cu rrent_x * Horizontal point of the current coordinate point * @param current_y * Ordinate point of the current coordinate point * @return */public float Computerad (float Curre nt_x, float current_y) {final floatδx = current_x-x0;final floatδy = current_y-y0;doubleθ= 0f;//angle//absolute value of the tangent of the angle FL Oat tanθ= math.abs (Δy/δx), if (Δx > 0) {//when coordinate points in 1 or 4 quadrants if (Δy >= 0) {//coordinate point in first quadrant θ= Math.atan (tanθ);} else {// When the coordinate point is located in Quadrant θ= 2 * Math.pi-math.atan (tanθ);}} else {//when the coordinate point is in 2 or 3 quadrant if (Δy >= 0) {//is located in the second Quadrant θ= Math.pi-math.atan (tanθ);} else {//in the third quadrant θ= Math.PI + math.atan (tanθ)                ;}} Note one radian =180/math.pifloat result = (float) ((180 *θ)/Math.PI); return result;} public float Getdown_rad () {return down_rad;} public void Setdown_rad (float down_rad) {This.down_rad = Down_rad;} public float Getcurrent_move_rad () {return current_move_rad;}        public void Setcurrent_move_rad (float current_move_rad) {This.current_move_rad = Current_move_rad;} The method works matrix.prerotate using public float Getδrad () {Returnδrad;} public void Setδrad (Floatδrad) {Δrad =δrad;}}

The following changes were made to the Rotationview code, mainly in Ontouchevent and OnDraw:

Package Rotation.demo.view;import Rotation.demo.bean.speedcontrol;import Android.content.context;import Android.graphics.bitmap;import Android.graphics.canvas;import Android.graphics.matrix;import Android.graphics.paint;import Android.util.attributeset;import Android.util.log;import android.view.MotionEvent; Import android.view.view;/** * verson3.0 The first two versions of the finger leave the screen immediately when the rotation will stop, and now this version lets the finger lift, as the inertia of the windmill to continue to rotate a little time.  * Idea: Monitor your finger to lift the event, then redraw * * @author Yanqiu * */public class Rotationview extends View {/** to rotate the picture **/private Bitmap bitmap;/** The **/private int degree = 0;/** the width of the picture: here is a square picture, so the width and height are the same **/private int width = 0;/*** the height of the picture: Here is a picture of a square , so the width and height are the same **/private int height = 0;/** defines a brush **/private paint paint = new Paint ();/** finger lift time **/private long upTime = 0;/** finger lifted when the windmill continued to turn the time **/private final long stoptimeduration = 5000;/** speed controller **/private Speedcontrol Speedcontrol; Public Rotationview (context context, AttributeSet Attrs) {Super (context, attrs);} Public Rotationview (Context ConteXT, AttributeSet attrs, int defstyleattr) {Super (context, attrs, defstyleattr);} Public Rotationview (Context context) {super (context);} Private String tag = "";/** * Calculates the center of the picture */public void Initsize () {width = bitmap.getwidth (); height = bitmap.getheight (); Spee Dcontrol = new Speedcontrol (WIDTH/2,HEIGHT/2);p ostinvalidate (); public void SetBitmap (Bitmap Bitmap) {this.bitmap = Bitmap;} @Overrideprotected void onmeasure (int widthmeasurespec, int heightmeasurespec) {//TODO auto-generated method Stubsuper.onmeasure (Widthmeasurespec, Heightmeasurespec); setmeasureddimension (width, width);} @Overrideprotected void OnDraw (canvas canvas) {Matrix matrix = new Matrix ();//Set Hinge position matrix.settranslate ((float) WIDTH/2 , (float) HEIGHT/2);//start rotation, matrix.prerotate (Speedcontrol.getδrad ()) for the rotation of the fingers,//Pivot Restore Matrix.pretranslate (-(float) WIDTH/2,-(float) HEIGHT/2); Canvas.drawbitmap (BitMap, Matrix, paint); Super.ondraw (canvas);} @Overridepublic boolean ontouchevent (Motionevent event) {int action = Event.getaction (), switch (action) {case motionevent.action_down://gets the arc of the point at which the finger is pressed and the x-axis  final float Down_rad = sp Eedcontrol.computerad (Event.getx (), event.gety ()); Speedcontrol.setdown_rad (Down_rad); break;case MOTIONEVENT.ACTION_MOVE://continues to redraw the final float Current_move_rad = Speedcontrol.computerad (Event.getx () with the MOVE of the finger, Event.gety ()); Final Floatδrad = Current_move_rad-speedcontrol.getdown_rad ();//Calculates the radian difference of the finger slip Speedcontrol.setδrad (Δrad );//The method uses Postinvalidate () in the UI thread itself, Break;case motionevent.action_up://continually redraws with the move of the finger uptime = System.currenttimemillis ();p Ost (new Runnable () {@Overridepublic void run () {Long duration = System.currenttimemillis () -uptime;if (Duration ==stoptimeduration) {return;} else if (duration<stoptimeduration) {post (this);} Used in non-UI threads. Invalidate ();}}); break;} return true;}}
After testing this version allows the windmill to change with the speed of the finger movement, but there is still a problem, that is, when the finger is lifted, the same windmill will stop rotating, this will be in the final version to solve

Custom view of the Big Windmill Series Demo (iii)

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.