Android: simple implementation of sliding and hanging up custom View, androidview

Android: simple implementation of sliding and hanging up custom View, androidview
Key points:

• Position updated as the finger slides

• How to calculate the start position and center str in drawText

1. CallSliderEndView. java

Package net. mobctrl. callendview; import android. annotation. suppressLint; import android. content. context; import android. content. res. typedArray; import android. graphics. canvas; import android. graphics. color; import android. graphics. paint; import android. graphics. paint. style; import android. graphics. rectF; import android. util. attributeSet; import android. view. motionEvent; import android. view. view;/*** @ date 20 February 2 11:02:00 * @ author Zheng Haibo * @ Description: Sliding hanging custom controls * @ Web http://www.mobctrl.net */@ SuppressLint ({"DrawAllocation", "ClickableViewAccessibility "}) public class CallSliderEndView extends View {public interface SliderEndListener {public void onSliderEnd ();} private SliderEndListener sliderEndListener; public void setSliderEndListener (SliderEndListener sliderEndListener) {this. s LiderEndListener = sliderEndListener;} private int height; private int width; private int circleOffset = 0; private int prevX = 0; private int maxOffset; private String sliderText; private float textSize; private int progressBackgroundColor; private int backgroundColor; private int redReginWidth; public CallSliderEndView (Context context) {super (context); init (context, null);} public CallSliderE NdView (Context context, AttributeSet attrs) {super (context, attrs); init (context, attrs);} public CallSliderEndView (Context context, AttributeSet attrs, int defStyleAttr) {super (context, attrs, defStyleAttr); init (context, attrs);} private void init (Context context, AttributeSet attrs) {if (null = attrs) {return ;} typedArray typedArray = context. obtainStyledAttributes (attrs, R. styleable. ca LlSliderEndView); textSize = typedArray. getDimensionPixelSize (R. styleable. callSliderEndView_textSize, 40); sliderText = typedArray. getString (R. styleable. callSliderEndView_text); progressBackgroundColor = typedArray. getColor (R. styleable. callSliderEndView_progressBackgroundColor, Color. GREEN); backgroundColor = typedArray. getColor (R. styleable. callSliderEndView_backgroundColor, 0x0fffffff); typedA Rray. recycle () ;}@ Override protected void onDraw (Canvas canvas) {super. onDraw (canvas); // TODO height = getHeight (); width = getWidth (); // Paint background paint = new Paint (); paint. setStyle (Style. FILL); paint. setAntiAlias (true); paint. setColor (backgroundColor); drawBackground (canvas, paint); // drawCircleButton (canvas, paint); drawRoundButton (canvas, paint);} // draw the background private void drawBackground (Ca Nvas canvas, Paint paint) {canvas. drawRoundRect (new RectF (0, 0, width, height), height/2, height/2, paint );} // draw the View @ Deprecated private void drawCircleButton (Canvas canvas, Paint paint) of the hanging button {int circleMargin = height/10; paint. setColor (Color. RED); canvas. drawCircle (height/2 + circleOffset, height/2, height/2-circleMargin, paint);} // draw the View private void drawRoundButton (C Anvas canvas, Paint paint) {redReginWidth = width/2; // paint progress background. setColor (progressBackgroundColor); canvas. drawRoundRect (new RectF (circleOffset, 0, circleOffset + redReginWidth, height), height/2, height/2, paint); // display the text sliderText in the middle of the painting. setTextSize (textSize); paint. setColor (Color. WHITE); int yCenterPos = (int) (canvas. getHeight ()/2)-(paint. descent () + paint. ascent ()/2 )); // Calculate the value in Y int startX = circleOffset + (redReginWidth-(int) paint. measureText (sliderText, 0, sliderText. length ()/2; canvas. drawText (sliderText, startX, yCenterPos, paint) ;}@ Override public boolean onTouchEvent (MotionEvent event) {switch (event. getAction () {case MotionEvent. ACTION_DOWN: actionDown (event); break; case MotionEvent. ACTION_MOVE: actionMove (event); break; case MotionEvent. ACTION _ UP: actionUp (event); break;} return true;} private void actionUp (MotionEvent event) {if (this. circleOffset! = MaxOffset) {this. circleOffset = 0;} postInvalidate ();} private void actionMove (MotionEvent event) {int tempOffset = (int) (event. getX ()-this. prevX); this. maxOffset = width-redReginWidth; if (tempOffset> = maxOffset & this. circleOffset = maxOffset) {return;} this. circleOffset = tempOffset; if (this. circleOffset> maxOffset) {// whether it has been moved to the edge this. circleOffset = maxOffset; if (sliderEndList Ener! = Null) {sliderEndListener. onSliderEnd () ;}} if (this. circleOffset <= 0) {this. circleOffset = 0;} postInvalidate ();} private void actionDown (MotionEvent e) {this. prevX = (int) e. getX ();}}

2. Use
Layout main. xml

<? Xml version = "1.0" encoding = "UTF-8"?> <RelativeLayout xmlns: android = "http://schemas.android.com/apk/res/android" xmlns: app = "http://schemas.android.com/apk/res/net.mobctrl.callendview" android: id = "@ + id/rl_root" android: layout_width = "match_parent" android: layout_height = "match_parent" android: background = "@ android: color/background_dark" android: orientation = "horizontal"> <net. mobctrl. callendview. callSliderEndView android: id = "@ + id/csev_slider_view" android: layout_width = "match_parent" android: layout_height = "60dp" android: layout_centerInParent = "true" android: layout_margin = "30dp" app: backgroundColor = "# ffffff" app: progressBackgroundColor = "# ffff1221" app: text = "" app: textSize = "24sp"/> </RelativeLayout>

MainActivity. java

package net.mobctrl.callendview;import net.mobctrl.callendview.CallSliderEndView.SliderEndListener;import android.app.Activity;import android.os.Bundle;import android.widget.Toast;/** *  * @author Zheng Haibo * @web http://www.mobctrl.net * */public class MainActivity extends Activity {    private CallSliderEndView callSliderEndView;    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.main);        callSliderEndView = (CallSliderEndView) findViewById(R.id.csev_slider_view);        callSliderEndView.setSliderEndListener(new SliderEndListener() {            @Override            public void onSliderEnd() {                System.out.println("debug:onSliderEnd...");                Toast.makeText(getApplicationContext(), "Slider To End",                        Toast.LENGTH_SHORT).show();            }        });    }}

3. configuration of attributes attr (/res/value/attr. xml)

<?xml version="1.0" encoding="utf-8"?><resources>    <declare-styleable name="CallSliderEndView">        <attr name="backgroundColor" format="color" />        <attr name="progressBackgroundColor" format="color" />        <attr name="textSize" format="dimension" />        <attr name="text" format="string" />    </declare-styleable></resources>

4. Results

You can use your fingers to slide

Github address: GitHub

QQ group of Android Development Alliance:272209595

Not for commercial purposes without permission