2013-10-25 66 views
20

我有一個viewpager包含許多子視圖;每個子視圖都是一個web視圖。每個webview都有一些用戶可以與之交互的HTML對象;例如,可以在滑動手勢上工作的幻燈片或用戶可以在HTML畫布上移動的可拖動圓圈。Android的webview:防止觸摸手勢傳遞給父viewpager

問題是,當用戶在這些HTML對象上執行一個手勢時,viewpager會滾動到下一個視圖。我希望HTML對象在用戶與它們交互時工作(viewpager不滾動),並且viewpager在用戶在其他地方滑動時滾動。我怎樣才能做到這一點?

Webviews inside Viewpager

P.S.我在HTML幻燈片的JavaScript中使用了event.preventDefault()event.stopPropagation(),希望webview不會將觸摸事件傳遞給父視圖。

+0

您退房類似的線程http://stackoverflow.com/questions/7774642/scroll-webview-horizo​​ntally-inside-a-viewpager – GrIsHu

+1

謝謝@GrIsHu,但這不適用於這種情況。該答案涵蓋了HTML Web視圖比viewpager的可見區域大的情況。我已經有這項工作。 –

+0

哪個是您支持的Android的最低版本?你有沒有對HTML的控制權?如果你需要它,你可以改變它嗎? – Juangcg

回答

2

創建您自己的ViewPager的子類並覆蓋canScroll,如下所示。

class MyViewPager extends ViewPager { 
... 

@Override 
protected boolean canScroll(View v, boolean checkV, int dx, int x, int y) { 
    if (isInsideSlideShow(x,y)) { 
     return true; // allow the slide show its own scrolling 
    } else { 
     return false; // ViewPager scrolls 
    } 
} 

您當然需要知道屏幕的哪一部分被幻燈片放映。 這個知識必須在方法isInsideSlideShow中實現。

如果您無法掌握幻燈片的x/y座標,另一種解決方案可能是使用從視圖邊界開始的手勢作爲分頁手勢和手勢,以滑塊內部區域開始更多顯示手勢。

我正在使用這種方法查看尋呼機,它顯示一張地圖和一個圖形。兩者都支持他們自己的平移。但是,當用戶開始在左邊或右邊框的手勢,整個地圖或圖表溜去:

@Override 
protected boolean canScroll(View v, boolean checkV, int dx, int x, int y) { 
     int width = getWidth(); 
     int slideWidth = Math.round(width * 0.15f); 
     if (x < slideWidth || x > width - slideWidth) { 
      return false; 
     } 
     return true; 
} 
+1

謝謝,這是我實際使用的解決方法,但我需要比此更穩固的解決方案 - 因爲用戶可以在我的webview中與HTML交互的區域可以更改(例如,用戶可以將HTML對象拖到網頁流量)。 –

+0

因此,您需要掌握幻燈片的當前座標。我不確定,但應該可以使用jQuery。 – user2808624

+0

謝謝,這就是我正在做的,但我正在尋找一個本地解決方案,這不涉及到HTML的變化。 –

3

覆蓋你ViewPager"canScroll"方法,只允許滾動如果視圖不是WebView一個實例。

樣品:

public class MyViewPager extends ViewPager { 

    public MyViewPager (Context context) { 
     super(context); 
    } 

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

    @Override 
    protected boolean canScroll(View v, boolean checkV, int dx, int x, int y) { 
     if(v instanceof WebView){ 
      return true; 
     } 
     return super.canScroll(v, checkV, dx, x, y); 
    } 

} 
+5

事情是,當用戶滑動HTML幻燈片之外,但*在* WebView中,'ViewPager'應該仍然滾動。 –

3

我的想法是實現一個JavaScript函數,決定滾動哪些部分:

function checkScroll(x, y){ 
    var o = document.elementFromPoint(x, y); 
    result = $('div.swiper-container').find(o).length; 
    MyAndroidInterface.processReturnValue(result); 
} 

然後覆蓋這兩種方法:

@Override 
public boolean onInterceptTouchEvent(MotionEvent ev) { 
    @Override 
public boolean onTouchEvent(MotionEvent ev) { 
    switch (ev.getAction()) { 
    case MotionEvent.ACTION_DOWN: 
     homepage.callJavascript("checkScroll(" + Math.round(ev.getX()) + "," + Math.round(ev.getY()) + ")"); 
     return super.onTouchEvent(ev); 
    case MotionEvent.ACTION_MOVE: 
     if (homepage.scrollSlideshowLock()) 
      return false;