2012-02-27 101 views
1

現在我可以使用發佈的代碼處理滑動手勢。但是我想在用戶從一個方向滑動到另一個方向時爲轉換添加背景顏色。非常類似股票聯繫人應用程序的方式。我知道我將不得不使用GestureOverlay,但我無法弄清楚如何將其與當前代碼關聯。是否有可能,還是有更簡單的方法來做到這一點?添加漸變色以滑動手勢

// inside my onCreate method 
    View view = getLayoutInflater().inflate(R.layout.gesture_overlay, null); 
    GestureOverlayView gestureOverlayView = new GestureOverlayView(this); 
    gestureOverlayView.addView(view); 


    mGestureDetector = new GestureDetector(new MyGestureDetector()); 
    mGestureListener = new View.OnTouchListener() { 
     public boolean onTouch(View view, MotionEvent event) { 
      mLongPress = false; 
      return mGestureDetector.onTouchEvent(event); 
     } 
    }; 

    // mListView.setOnItemClickListener(this); 
    mListView.setOnTouchListener(mGestureListener); 
} 


class MyGestureDetector extends SimpleOnGestureListener { 
    private static final int SWIPE_MIN_DISTANCE  = 120; 
    private static final int SWIPE_MAX_OFF_PATH  = 200; 
    private static final int SWIPE_THRESHOLD_VELOCITY = 200; 

    @Override 
    public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) { 
    if (Math.abs(e1.getY() - e2.getY()) > SWIPE_MAX_OFF_PATH) { 
     return false; 
    } 
    // right to left swipe 
    if (e1.getX() - e2.getX() > SWIPE_MIN_DISTANCE 
      && Math.abs(velocityX) > SWIPE_THRESHOLD_VELOCITY) { 
     return true; 
    } else 
     if (e2.getX() - e1.getX() > SWIPE_MIN_DISTANCE 
       && Math.abs(velocityX) > SWIPE_THRESHOLD_VELOCITY) { 
      return true; 
     } 

    return false; 
} 

}

enter image description here

+0

你解決了這個問題嗎?如果是的話,請給我一些提示bcoz我必須這樣做,完全像這樣在此先感謝...... – 2013-05-24 10:39:14

回答

0

是否截圖來自三星手機?之前我已經實現了這個效果。 此滑動條不是漸變色,而是由三張圖片組成。

你可以得到這些圖片通過反編譯APK與apktool

+0

是的,它是一款三星Galaxy系列手機。我下載了apktool,你還記得照片的位置嗎? – Justin 2012-02-28 00:54:12

+0

發送apk文件,我會給你發送圖片。 ufo222940268 AT gmail.com – 2012-02-28 01:05:12

+0

正好在'/ res/drawable-mdpi'或'/ res/drawable'下面。 – 2012-02-28 01:06:54

3

我已經創建了一個對我來說,到目前爲止的工作解決方案文件...

這樣創建列表項目flipperview:

list_item.xml

<?xml version="1.0" encoding="utf-8"?> 
<ViewFlipper xmlns:android="http://schemas.android.com/apk/res/android" 
android:id="@+id/listItemViewFlipper" 
android:layout_width="match_parent" 
android:layout_height="match_parent"> 

<!-- ViewFlipper Child 1 --> 
<RelativeLayout 
android:id="@+id/listItem" 
android:layout_width="match_parent" 
android:layout_height="80dip"  
android:padding="4dip"  
android:background="@drawable/list_item_background" 
> 

<TextView 
    android:id="@+id/productName"   
    android:singleLine="true" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content" 
    android:textSize="20sp" 
    android:gravity="left|center_vertical" 
    android:text="" 
    android:textColor="#FFFFFF"/> 
<TextView 
    android:id="@+id/short_description" 
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content"   
    android:text="short description" 
    android:gravity="left" 
    android:layout_below="@id/productName" 
    />  
<EditText 
    android:id="@+id/editValue"  
    android:layout_width="wrap_content" 
    android:layout_height="wrap_content"      
    android:hint="@string/value" 
    android:layout_alignParentRight="true" 
    android:layout_alignBaseline="@id/productName" 
    android:textColorHint="#FFFFFF" 
    android:text="" 
    android:singleLine="true" 
    android:inputType="number" 
    android:textColor="#FFFFFF" 
    android:maxLength="2"  
    /> 
     <TextView 
    android:id="@+id/productPrice"  
    android:layout_height="wrap_content"  
    android:layout_width="wrap_content" 
    android:paddingRight="8dip"  
    android:layout_toLeftOf="@id/editValue"     
    android:text="€3,40" 
    android:textSize="20sp" 
    android:textColor="#FFFFFF" 
    /> 

</RelativeLayout> 

<!-- Transition views --> 
<!-- ViewFlipper Child 2 --> 
<LinearLayout 
    android:id="@+id/transitionViewAdd" 
    android:layout_width="match_parent" 
    android:layout_height="80dip" 
    android:padding="4dip"  
    android:background="@drawable/list_item_swipe"    
    android:orientation="horizontal" 
> 
    <TextView 
     android:id="@+id/swipe_transition_textview_add" 
     android:layout_width="wrap_content" 
     android:layout_height="match_parent" 
     android:layout_weight="1"      
     android:gravity="center" 
     android:textSize="25sp"  
     android:textColor="#FFFFFF" 
     android:text="@string/swipe_transition_text_add"    
    /> 
    <ImageView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_weight="1" 
     android:layout_gravity="center" 
     android:src="@drawable/content_new" 
    /> 

</LinearLayout> 
<!-- ViewFlipper Child 3 --> 
<LinearLayout 
    android:id="@+id/transitionViewRemove" 
    android:layout_width="match_parent" 
    android:layout_height="80dip"   
    android:background="#ff7978"   
    android:orientation="horizontal" 
> 
<ImageView 
     android:layout_width="wrap_content" 
     android:layout_height="wrap_content" 
     android:layout_weight="1" 
     android:layout_gravity="center" 
     android:src="@drawable/ic_action_remove"    
/> 
<TextView 
     android:id="@+id/swipe_transition_textview_remove" 
     android:layout_width="wrap_content" 
     android:layout_height="match_parent" 
     android:layout_weight="1" 
     android:gravity="center" 
     android:textSize="25sp"  
     android:textColor="#FFFFFF" 
     android:text="@string/swipe_transition_text_remove"     
    /> 
</LinearLayout> 
</ViewFlipper> 

設置爲flipperview的背景的梯度象下面這樣:

<?xml version="1.0" encoding="utf-8"?> 
<shape xmlns:android="http://schemas.android.com/apk/res/android"> 
    <gradient android:startColor="#FF0000" 
       android:endColor="@android:color/transparent" 
       android:angle="0"/>   
    <corners android:radius="3dp"/>   
</shape> 

現在在GestureDetector刷卡時更改FlipperViewView你想要的。 (我假設你使用MotionEvent辦理刷卡的不同狀態)

case MotionEvent.ACTION_MOVE:{   
     float deltaX = motionEvent.getRawX() - mDownX; 
     int deltaXRound = Math.round(deltaX); 
     float deltaY = motionEvent.getRawY() - mDownY; 
     if(mVelocityTracker == null || mPaused){ 
      break; 
     } 

     if(Math.abs(deltaY) > Math.abs(deltaX)){     
      return false; 
     } 

     mVelocityTracker.addMovement(motionEvent);   
     if (Math.abs(deltaX) > mSlop) { 
      mSwiping = true;          
      mListView.requestDisallowInterceptTouchEvent(true); 
     } 

    // Cancel ListView's touch (un-highlighting the item) 
     MotionEvent cancelEvent = MotionEvent.obtain(motionEvent); 
     cancelEvent.setAction(MotionEvent.ACTION_CANCEL | 
       (motionEvent.getActionIndex() 
         << MotionEvent.ACTION_POINTER_INDEX_SHIFT)); 
     mListView.onTouchEvent(cancelEvent); 
     cancelEvent.recycle();   

     if(deltaX > 0 && mSwiping){        
        mViewFlipper.setDisplayedChild(mViewFlipper.indexOfChild(mViewFlipper.findViewById(R.id.transitionViewAdd))); 
      mCurrentFlipperView = mViewFlipper.getCurrentView(); 

      Drawable background = mCurrentFlipperView.getBackground(); 
      background.setBounds(0, 0, deltaXRound, mCurrentFlipperView.getHeight()); 
      background.invalidateSelf(); 

現在..這不,關鍵是東西用setBounds方法來設置列表項

背景的邊界
Drawable background = mCurrentFlipperView.getBackground(); 
background.setBounds(0, 0, deltaXRound, mCurrentFlipperView.getHeight()); 
background.invalidateSelf(); 

這對我很有用..它創建一個漸變,在觸摸的同時觸摸..它需要一些編輯,讓它工作更好..但我尋找一個解決方案很長,我知道很多的人正在尋找它,所以我想盡可能快地展示它。但是我想你會想出來讓它成爲你想要的樣子。