Introduction to the

This is a little thing I wrote a long time ago that allows you to slide back to your page. I didn’t care about it at the beginning, but later I found that there were many people in STAR…

So I decided to perfect it and write a blog about it…

GitHub address: SlideBack

The effect is as follows:

Method of use

Step 1. Add the jitpack. IO library to your project root build.gradle

allprojects {
    repositories {
        ...
        maven { url 'https://jitpack.io'}}}Copy the code

Step 2. Add the SlideBack dependency

dependencies {
    implementation 'com. Making. ChenTianSaber: SlideBack: v0.8.1'
}
Copy the code

Step 3. Replace the inherited Activity in the project with a SlideBackActivity

public class YourActivity extends SlideBackActivity
Copy the code

You can call setSlideBackDirection in the onCreate method, which can be configured for each Activity individually. If this is not configured, the default is slideBackActivity.all

protected void onCreate(Bundle savedInstanceState) { //Other Code... / / there are three values can be set / / SlideBackActivity RIGHT slip out of / / SlideBackActivity said only from the RIGHT side of the screen. The LEFT said only out of the screen on the LEFT side of the slide / / SlideBackActivity. ALL Means you can slide out from either side of the screensetSlideBackDirection(SlideBackActivity.RIGHT);
}
Copy the code

Step 5. Override slideBackSuccess(this method will be called back if the slide is valid, you can do a rollback here or something)

@Override
protected void slideBackSuccess() { finish(); // or other}Copy the code

Realize the principle of

The principle is very simple, specific you can go to GitHub to see the source code, not a few lines of code, very short

As for this article, I will briefly talk about it:

Step 1. First let’s draw a custom view, the one you pull from the edge of the screen. Let’s call it a sideslip view

The View has only one variable argument, the width of the View. All other coordinates are calculated according to this width, so we can create an animation effect by changing this width

Step 2. We then get the DecorView and add the slideslip View as follows:

FrameLayout container = (FrameLayout) getWindow().getDecorView();
containerView = LayoutInflater.from(this).inflate(R.layout.chentian_view_slide_container, null);
slideContainerView = containerView.findViewById(R.id.slide_container);
slideContainerView.addView(backView);
container.addView(slideContainerView);
Copy the code

The last Step is to listen to the DecorView Touch event to determine the sliding area and the sliding distance to set the parameters of the sliding View.

slideContainerView.setOnTouchListener(new View.OnTouchListener() {
    @Override
    public boolean onTouch(View view, MotionEvent motionEvent) {

        x = Math.abs(screenWidth * offset - motionEvent.getRawX());
        y = motionEvent.getRawY();

        switch (motionEvent.getAction()) {
            caseMotionEvent.ACTION_DOWN: downX = motionEvent.getRawX(); // Determine whether the click range matches the set slide out areaif (SLIDEBACK_DIRECTION == LEFT) {
                    if(downX > screenWidth / 2) {// In the right area, directreturn
                        return false;
                    } else{ offset = 0; }}else if (SLIDEBACK_DIRECTION == RIGHT) {
                    if(downX < screenWidth / 2) {// In the left area, directlyreturn
                        return false;
                    } else{ offset = 1; }}else if (SLIDEBACK_DIRECTION == ALL) {
                    if(downX > screenWidth / 2) {// In the RIGHT area, set RIGHT offset = 1; }else if(downX < screenWidth / 2) {// In the LEFT area, set the LEFT offset = 0; } } x = Math.abs(screenWidth * offset - motionEvent.getRawX());if (x <= dp2px(CANSLIDE_LENGTH)) {
                    isEage = true;
                    slideBackView.updateControlPoint(Math.abs(x), offset);
                    setBackViewY(backView, (int) (motionEvent.getRawY()));
                }
                break;

            case MotionEvent.ACTION_MOVE:
                float moveX = Math.abs(screenWidth * offset - x) - downX;
                if (isEage) {
                    if (Math.abs(moveX) <= shouldFinishPix) {
                        slideBackView.updateControlPoint(Math.abs(moveX) / 2, offset);
                    }
                    setBackViewY(backView, (int) (motionEvent.getRawY()));
                }
                break;

            caseMotionevent.action_up: // Strokes from the left edge and ends up a third of the way out of the screenif (isEage) {
                    if (x >= shouldFinishPix) {
                        slideBackSuccess();
                    }
                }
                isEage = false;
                slideBackView.updateControlPoint(0, offset);
                break;
        }
        if (isEage) {
            return true;
        } else {
            return false; }}});Copy the code

This is the general process…

conclusion

If you have any questions or suggestions, please let me know in the comments below, or make an issue on GitHub. Thank you and happy New Year to you all

Meet is fate… Please give me a Star… thank you