Làm thế nào để làm slide để nút trong android

Question

Hi unlock Tôi muốn có một nút nên hoạt động như 'slide to unlock' nút của IOS

trong ngắn hạn tôi muốn có một nút mà không có tác dụng nhấp chuột nhưng có thể trượt trái sang phải trong khi kéo và kéo hoàn thành nó nên được coi là nhấp chuột.

vui lòng đề xuất cho tôi bất kỳ mã mẫu nào nếu có thể.

Cảm ơn!

Answer 1

Trước hết tôi muốn cảm ơn @matthias vì câu trả lời của anh ấy. Tôi đã sử dụng sau tìm quầy bar với một số tùy biến:

<SeekBar 
     android:id="@+id/myseek" 
     android:layout_width="fill_parent" 
     android:layout_height="wrap_content" 
     android:clickable="false" 
     android:max="100" 
     android:progressDrawable="@android:color/transparent" 
     android:thumb="@drawable/ic_launcher" /> 

và trong mã java

sb.setOnSeekBarChangeListener(new OnSeekBarChangeListener() { 

     @Override 
     public void onStopTrackingTouch(SeekBar seekBar) { 

      if (seekBar.getProgress() > 95) { 

      } else { 

       seekBar.setThumb(getResources().getDrawable(R.drawable.ic_launcher)); 
      } 

     } 

     @Override 
     public void onStartTrackingTouch(SeekBar seekBar) { 


     } 

     @Override 
     public void onProgressChanged(SeekBar seekBar, int progress, 
       boolean fromUser) { 
      if(progress>95){ 
       seekBar.setThumb(getResources().getDrawable(R.drawable.load_img1)); 
      } 

     } 
    }); 

Answer 2

Android cung cấp tiện ích Switch tương tự như trang trình bày để mở khóa. Tuy nhiên, bạn sẽ phải tùy chỉnh nó một chút, ví dụ: vô hiệu hóa thay đổi khi nhấp chuột.

Answer 3

Tôi bắt đầu với ví dụ mà Jignesh Ansodariya đăng, nhưng như Aerrow chỉ ra, người dùng có thể bấm vào bất cứ nơi nào trên SeekBar để mở khóa. Điều đó làm cho nó khá không thể sử dụng được, vì điểm có nút trượt là các nhấp chuột tình cờ nên được bỏ qua. Giải pháp của tôi là tạo ra một lớp con của SeekBar, như thế này:

public class SlideButton extends SeekBar { 

    private Drawable thumb; 
    private SlideButtonListener listener; 

    public SlideButton(Context context, AttributeSet attrs) { 
     super(context, attrs); 
    } 

    @Override 
    public void setThumb(Drawable thumb) { 
     super.setThumb(thumb); 
     this.thumb = thumb; 
    } 

    @Override 
    public boolean onTouchEvent(MotionEvent event) { 
     if (event.getAction() == MotionEvent.ACTION_DOWN) { 
      if (thumb.getBounds().contains((int) event.getX(), (int) event.getY())) { 
       super.onTouchEvent(event); 
      } else 
       return false; 
     } else if (event.getAction() == MotionEvent.ACTION_UP) { 
      if (getProgress() > 70) 
       handleSlide(); 

      setProgress(0); 
     } else 
      super.onTouchEvent(event); 

     return true; 
    } 

    private void handleSlide() { 
     listener.handleSlide(); 
    } 

    public void setSlideButtonListener(SlideButtonListener listener) { 
     this.listener = listener; 
    } 
} 

public interface SlideButtonListener { 
    public void handleSlide(); 
} 

XML:

 <package.SlideButton 
      android:id="@+id/unlockButton" 
      android:layout_width="match_parent" 
      android:layout_height="wrap_content" 
      android:clickable="false" 
      android:max="100" 
      android:progressDrawable="@android:color/transparent" 
      android:thumb="@drawable/button_lock" > 
     </package.SlideButton> 

Và cuối cùng là mã bên Hoạt động của tôi:

((SlideButton) findViewById(R.id.unlockButton)).setSlideButtonListener(new SlideButtonListener() { 
     @Override 
     public void handleSlide() { 
      unlockScreen(); 
     } 
    }); 

Answer 4

Đối với một số lý do, tôi couldn 't vô hiệu hóa các hành động cảm ứng để vòi tình cờ vẫn còn có thể
Tôi đã đưa ra giải pháp này, về cơ bản nó sẽ không cho phép thay đổi tiến độ của hơn 10 giá trị cho mỗi cha nge kiện

int unlockLastSeekVal = 0; 
// there are skips btwn changes, use value greater than 1 
// 10 is great for seekbars with 100 values 
int unlockSeekSensitivity = 10; 
// final stage to "unlock"; 0.9 => 90% 
Double unlockFinalStage = 0.9; 
//........... 
unlock.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() { 
    public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) { 
     if (fromUser){ 
      if (Math.abs(unlockLastSeekVal - progress) > unlockSeekSensitivity){ 
       // too much delta, revert to last value 
       seekBar.setProgress(unlockLastSeekVal); 
      }else{ 
       unlockLastSeekVal = progress; 
      } 
     } 
    } 

    public void onStartTrackingTouch(SeekBar seekBar) { 
    } 

    public void onStopTrackingTouch(SeekBar seekBar) { 
     if (seekBar.getProgress() > seekBar.getMax() * unlockFinalStage){ 
      DoYourThing(); 
     } 
     unlockLastSeekVal = 0; 
     seekBar.setProgress(0);   
    } 
}); 

Answer 5

Bắt đầu từ câu trả lời Oskar của (nhờ cho bạn đóng góp) i tạo ra một dự án ví dụ đơn giản để quản lý Trượt nút (ngang và dọc): https://github.com/rcaboni/AndroidSlideButton

Đối với một ảnh chụp màn hình: https://raw.githubusercontent.com/rcaboni/AndroidSlideButton/master/screenshot.jpg

Đây là phương pháp chính:

public boolean onTouchEvent(MotionEvent event) { 
    if (!isEnabled()) { 
     return false; 
    } 
    if (orientation == ORIENTATION_HORIZONTAL) { 
     if (event.getAction() == MotionEvent.ACTION_DOWN) { 
      int x= (int) event.getX(); 
      int y= (int) event.getY(); 
      if (thumb.getBounds().contains((int) event.getX(), (int) event.getY())) { 
       super.onTouchEvent(event); 
      } else 
       return false; 
     } else if (event.getAction() == MotionEvent.ACTION_UP) { 
      if (getProgress() > 70) 
       handleSlide(); 

      setProgress(0); 
     } else 
      super.onTouchEvent(event); 
    }else{ 
     int i=0; 
     switch (event.getAction()) { 
      case MotionEvent.ACTION_DOWN: 
       if (event.getAction() == MotionEvent.ACTION_DOWN) { 
        int x= (int) event.getX(); 
        int y= (int) event.getY(); 
        if (!thumb.getBounds().contains((int) event.getY(), (int) event.getX())) { 
         return false; 
        } 
       } 
      case MotionEvent.ACTION_MOVE: 
       i=getMax() - (int) (getMax() * event.getY()/getHeight()); 
       setProgress(100 - i); 
       onSizeChanged(getWidth(), getHeight(), 0, 0); 
       break; 
      case MotionEvent.ACTION_UP: 
       i=getMax() - (int) (getMax() * event.getY()/getHeight()); 
       if (i < 30) { 
        handleSlide(); 
       } 
       setProgress(0); 
       onSizeChanged(getWidth(), getHeight(), 0, 0); 
       break; 

      case MotionEvent.ACTION_CANCEL: 
       break; 
     } 
    } 
    return true; 
} 

XML cho nút dọc:

<RelativeLayout 
    android:layout_width="75dp" 
    android:layout_height="130dp" 
    android:background="@drawable/slide_background_green" 
    android:id="@+id/lSlideButtonV" 
    android:layout_below="@+id/lSlideButton" 
    android:layout_marginTop="50dp"> 
    <TextView 
     android:layout_width="20dp" 
     android:layout_height="match_parent" 
     android:text="SOS" 
     android:id="@+id/tvSlideActionV" 
     android:gravity="center|bottom" 
     android:layout_alignParentRight="false" 
     android:layout_alignParentEnd="false" 
     android:layout_alignParentLeft="false" 
     android:layout_alignParentStart="false" 
     android:textSize="20dp" 
     android:textColor="@android:color/white" 
     android:layout_alignParentTop="false" 
     android:layout_centerHorizontal="true" 
     android:layout_alignParentBottom="false" 
     android:layout_marginBottom="15dp" /> 
    <it.aldea.android.widget.SlideButton 
     android:id="@+id/unlockButtonV" 
     android:layout_width="match_parent" 
     android:layout_height="150dp" 
     android:clickable="false" 
     android:max="100" 
     slideButton:orientation="vertical" 
     android:progressDrawable="@android:color/transparent" 
     android:thumb="@drawable/slide_track_red" 
     android:indeterminate="false" 
     android:layout_marginRight="5dp" 
     android:layout_marginTop="20dp" 
     android:layout_centerInParent="true" 
     android:layout_marginBottom="10dp" 
     android:thumbOffset="-2dp"> 
    </it.aldea.android.widget.SlideButton> 

</RelativeLayout> 

Nó không phải là một phụ tùng hoàn toàn thực vì được sáng tác từ hai view (TextView và SlideButton) vào một Layout, nhưng đó là một giải pháp có thể cấu hình dễ dàng cho Slide Nút với văn bản bên trong. Tôi hy vọng điều này hữu ích cho ai đó.

Answer 6

Có thể rất muộn nhưng tôi đã tạo một thư viện nhỏ cho mục đích này. Nó cho phép bạn vuốt và tùy chỉnh hành vi của nút của bạn từ xml.Slide Button

Về cơ bản nó liên quan đến việc ghi đè sự kiện onTouch() và thực hiện thay đổi theo tọa độ nhận được. Một điều đơn giản sau đó để thiết lập nền như bạn muốn và tùy chỉnh văn bản.

Answer 7

Bạn có thể sử dụng thư viện này để tùy chỉnh mở khóa nhanh chóng và dễ dàng.

https://github.com/cheekiat/SlideToUnlock

Sử dụng mã này vào xml

<cheekiat.slideview.SlideView 
     android:id="@+id/slide_view" 
     android:layout_width="match_parent" 
     android:layout_height="wrap_content" 
     app:slideBackground="@drawable/orangesquarebutton" 
     app:slideSrc="@drawable/slide_image" 
     app:slideText="Slide to unlock" 
     app:slideTextColor="#ffffff" 
     app:slideTextSize="10dp" /> 

Slide to unlock screenshort

Answer 8

Bạn có thể xây dựng lại các SeekBar bình thường để làm những gì bạn muốn:

Với:

• Điểm bắt đầu (20)
• Đường giao nhau (90)

• Và tự động đặt lại.

  seekBar.setOnSeekBarChangeListener ( SeekBar.OnSeekBarChangeListener mới() { Integer điểm = 0; Integer StartPoint = 0; boolean bắt đầu = true;

  @Override 
      public void onProgressChanged(SeekBar seekBar, int i, boolean wasUserInput) { 
       point = i; 
  
       if (started && i > 0 && wasUserInput) { 
        startPoint = new Integer(i); 
        started = false; 
       } 
      } 
  
      @Override 
      public void onStartTrackingTouch(SeekBar seekBar) { 
      } 
  
      @Override 
      public void onStopTrackingTouch(SeekBar seekBar) { 
       if (point > 90 && startPoint < 20) { // slided to the right correctly. 
        // TODO:: 
  
       } else { // reset. 
        resetSeekBar(seekBar, point); 
       } 
  
       startPoint = 0; 
       started = true; 
      } 
  }); 
  

Và:

/** 
* Resetting the seekbar, on point at a time. 
* @param seekBar       Reference to the seekbar made smaller. 
* @param oldPoint       The point where the dot is atm. 
*/ 
private void resetSeekBar(final SeekBar seekBar, final int oldPoint) { 
    if (oldPoint > 0) { 
     final int newPoint = oldPoint -1; 
     seekBar.setProgress(newPoint); 

     timer.schedule(new TimerTask() { 
      final SeekBar seekBar = seekBarBid; 
      @Override 
      public void run() { 
       resetSeekBar(seekBar, newPoint); 
      } 
     }, 3); 

    } else { 
     seekBar.setProgress(oldPoint); 
    } 
}