SwipedHorizontalScrollView

Aug 29, 2014 16:03

For one project I needed an iOS7 like control, when you can swipe buttons from right side in listView.
But I needed to swipe different buttons from right and left sides.
All controls I found just show a layout that is hiding under the listView row.
So, I made my controI on the base of HorizontalScrollView and would like to share it with you.

Start position:


Shows you that vertical scroll works fine


Swipe left


 Swipe right


Class implementation:

public class SwipedHorizontalScrollView extends HorizontalScrollView {
  private float lastX = 0;
  private float xDistance = 0;
  private float curX = 0;
  private float lastX2 = 0;
  private float xDistance2 = 0;
  private float curX2 = 0;
  private float lastX3 = 0;
  private FrameLayout templateMainLayout;
  /////////////////////////////////
  public SwipedHorizontalScrollView(Context context, AttributeSet attrs) {
      super(context, attrs);
  }
  /////////////////////////////////
  @Override
  public boolean onTouchEvent(MotionEvent ev) {
      int mainPartWidth = getTemplateMainLayout().getWidth();
      double insBorder = mainPartWidth*0.05;
      int insenseBorder = (int) insBorder;
      double sBorder = mainPartWidth*0.20;
      int senseBorder = (int) sBorder;
      switch (ev.getAction()) {
          case MotionEvent.ACTION_DOWN:
              lastX = ev.getX();
              lastX2 = getScrollX();
              lastX3 = getTemplateMainLayout().getLeft();
              break;
          case MotionEvent.ACTION_MOVE:
              curX = ev.getX();
              xDistance = curX - lastX;
              if (xDistance < insenseBorder && xDistance > -insenseBorder )
                  return true;
              else break;
          case MotionEvent.ACTION_UP:
              curX = ev.getX();
              curX2 = getScrollX();
              xDistance = curX - lastX;
              xDistance2 = curX2 - lastX2;
              if (xDistance < -senseBorder) {
                  if (curX2 >= lastX3) fullScroll(FOCUS_RIGHT);
                  else smoothScrollTo((int) lastX3, 0);
              }
              if (xDistance > senseBorder) {
                  if (curX2 <= lastX3) fullScroll(FOCUS_LEFT);
                  else smoothScrollTo((int) lastX3, 0);
              }
              if (xDistance >= -senseBorder && xDistance <= -insenseBorder){
                  if (curX2 >= lastX3) smoothScrollTo((int) lastX3, 0);
                  else fullScroll(FOCUS_LEFT);
              }
              if (xDistance <= senseBorder && xDistance >= insenseBorder) {
                  if (curX2 <= lastX3) smoothScrollTo((int) lastX3, 0);
                  else fullScroll(FOCUS_RIGHT);
              }
              return false;
      }
      return super.onTouchEvent(ev);
  }
  public FrameLayout getTemplateMainLayout() {
      return templateMainLayout;
  }
  public void setTemplateMainLayout(FrameLayout templateMainLayout) {
      this.templateMainLayout = templateMainLayout;
  }
}
Layout implementation:

android:layout_width="wrap_content"
                  android:layout_height="90dp"
                  android:scrollbars="none"
                  android:id="@+id/templateSample" >

android:orientation="horizontal"
                      android:layout_width="fill_parent"
                      android:layout_height="fill_parent"
                      android:id="@+id/templateLayout">

android:layout_width="200dp"
                          android:layout_height="fill_parent"
                          android:id="@+id/templateLayoutPay"
                          android:background="#ffbbb7f2">

android:layout_width="wrap_content"
                              android:layout_height="wrap_content"
                              android:text="Some Action"
                              android:id="@+id/button"
                              android:layout_gravity="center" />

android:layout_width="360dp"
                          android:layout_height="fill_parent"
                          android:id="@+id/templateLayoutMainPart"
                          android:background="#ffa0f298">

android:layout_width="wrap_content"
                              android:layout_height="wrap_content"
                              android:textAppearance="?android:attr/textAppearanceLarge"
                              android:text="Swipe left or right"
                              android:id="@+id/textView"
                              android:layout_gravity="center" />

android:orientation="horizontal"
                          android:layout_width="200dp"
                          android:layout_height="fill_parent"
                          android:gravity="center"
                          android:background="#fff2b5b8">

android:layout_width="wrap_content"
                              android:layout_height="wrap_content"
                              android:text="Some Other Action"
                              android:id="@+id/button2"
                              android:layout_gravity="center" />


Usage:

public class MyActivity extends ActionBarActivity {
  @Override
  protected void onCreate(Bundle savedInstanceState) {
      super.onCreate(savedInstanceState);
      setContentView(R.layout.activity_my);
      final SwipedHorizontalScrollView templateSample = (SwipedHorizontalScrollView) findViewById(R.id.templateSample);
      final FrameLayout templateMainLayout = (FrameLayout) findViewById(R.id.templateLayoutMainPart);
      templateSample.setTemplateMainLayout(templateMainLayout);
      templateSample.post(
              new Runnable() {
                  public void run() {
                      templateSample.scrollTo(templateMainLayout.getLeft(),0);
                  }
              });
  }
...
}

android java swipe listview scrollview h

Next post
Up