CODEWITHSUNDEEP
androidanimationdrag
lopez.mikhael
lopez.mikhael

Reputation: 10061

How to realize a Swipe to submit on Android?

I would like to make an animation for submit like that on Android:

Swipe transfer

Would anyone an idea how to achieve that?

The idea is to drag (horizontal) a View in a ViewGroup (LinearLayout) and be able to recover the position.

Upvotes: 0

Views: 1323

Answers (1)

Vishwesh Jainkuniya
Vishwesh Jainkuniya

Reputation: 2839

Use custom seekbar

set your own background and icon.

on Complete swipe of seekbar, seekbar.setVisibility(View.GONE); and circle.setVisibility(View.VISIBLE); 

  <SeekBar  
    android:id="@+id/seekBar1"  
    android:layout_width="match_parent"  
    android:layout_height="wrap_content"  

    android:layout_centerHorizontal="true"  
    android:layout_marginTop="16dp" />

Use

android:thumb="@drawable/drag_thumb"

to replace @drawable/drag_thumb with your drawable of thumb

 android:progressDrawable="@layout/custom_seekbar_layout"

to create your own background

 android:max="YOUR_TOTAL_PROGRESS"  <--replace YOUR_TOTAL_PROGRESS with your int -->

Make your class implements OnSeekBarChangeListener

and

 seekBar=(SeekBar)findViewById(R.id.seekBar1);  
    seekBar.setOnSeekBarChangeListener(this);

Now manage events

@Override  
public void onProgressChanged(SeekBar seekBar, int progress,  
        boolean fromUser) {  
    Toast.makeText(getApplicationContext(),"seekbar progress: "+progress, Toast.LENGTH_SHORT).show();  
   if(progress == YOUR_TOTAL_PROGRESS)
   {
        seekbar.setVisibility(View.GONE);   
        circle.setVisibility(View.VISIBLE);
   }
}  
@Override  
public void onStartTrackingTouch(SeekBar seekBar) {  
    Toast.makeText(getApplicationContext(),"seekbar touch started!", Toast.LENGTH_SHORT).show();  
}  
@Override  
public void onStopTrackingTouch(SeekBar seekBar) {  
    Toast.makeText(getApplicationContext(),"seekbar touch stopped!", Toast.LENGTH_SHORT).show();  
    if (seekBar.getProgress() < YOUR_TOTAL_PROGRESS) {
        seekBar.setProgress(0);
    }
}

on complete slide of seekbar you can apply transition from bottom to top for the layout which contains the additional info (that shows "Transfer Successful and contains button at bottom").

slide_in_top.xml :

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
 android:toYDelta="0%p"
android:duration="@android:integer/config_longAnimTime" />

slide_out_top.xml :

<?xml version="1.0" encoding="utf-8"?>
<translate xmlns:android="http://schemas.android.com/apk/res/android"
android:toYDelta="100%p"
android:duration="@android:integer/config_longAnimTime" />

Upvotes: 3

Related Questions