Kaydırma hareketini canlandırma

"Oluştur" yöntemini deneyin

Jetpack Compose, Android için önerilen kullanıcı arayüzü araç setidir. Oluşturma'da dokunma ve giriş özelliklerini nasıl kullanacağınızı öğrenin.

Kaydırma →

Android'de, kaydırma genellikle ScrollView sınıfı kullanılarak gerçekleştirilir. Çerçeve tarafından yönetilen kaydırılabilir bir görünüm sağlamak için kapsayıcısının sınırlarının dışına çıkabilecek tüm standart düzenleri bir ScrollView içinde iç içe yerleştirin. Özel bir kaydırma aracı uygulamak yalnızca özel senaryolar için gereklidir. Bu dokümanda, kaydırma hareketleri kullanılarak dokunma hareketlerine yanıt olarak bir kaydırma efektinin nasıl gösterileceği açıklanmaktadır.

Uygulamanız, dokunma etkinliğine yanıt olarak bir kaydırma animasyonu oluşturmak için gereken verileri toplamak üzere kaydırıcıları (Scroller veya OverScroller) kullanabilir. Bunlar birbirine benzer, ancak OverScroller, bir pan veya hızlı hamle hareketinin ardından içerik kenarlarına ulaştıklarında kullanıcılara bunu bildirmek için yöntemler de içerir.

• Android 12'den (API düzeyi 31) itibaren görsel öğeler, bir sürükleme etkinliğinde esneyip geri seker, bir hızlı geçiş etkinliğinde hızla geri döner ve geri döner.
• Android 11 (API düzeyi 30) ve önceki sürümlerde, kenarlara sürükleme veya kaydırma hareketinden sonra sınırlar bir "parlama" efekti gösterir.

Bu dokümandaki InteractiveChart örneğinde, bu fazla kaydırma efektlerini görüntülemek için EdgeEffect sınıfı kullanılmaktadır.

Sürtünme, hız ve diğer nitelikler gibi platform standardı kaydırma fiziğinden yararlanarak zaman içinde kaydırmayı canlandırmak için bir kaydırma çubuğu kullanabilirsiniz. Kaydırıcının kendisi hiçbir şey çizmez. Kaydırıcılar, zaman içinde kaydırma ofsetlerini izler, ancak bu konumları görünümünüze otomatik olarak uygulamaz. Yeni koordinatları almalı ve uygulamanız gerekir.

Kaydırma terminolojisini anlama

Kaydırma, bağlama bağlı olarak Android'de farklı anlama gelebilen bir kelimedir.

Kaydırma, görüntü alanını, yani bakmakta olduğunuz içeriğin "penceresini" taşımaya ilişkin genel işlemdir. Kaydırma hem x hem de y ekseninde olduğunda buna kaydırma denir. Bu belgedeki InteractiveChart örnek uygulamasında iki farklı kaydırma, sürükleme ve hızlıca kaydırma türü gösterilmektedir:

• Sürükleme: Bu, kullanıcı parmağını dokunmatik ekranda sürüklediğinde gerçekleşen kaydırma türüdür. GestureDetector.OnGestureListener öğesinde onScroll() değerini geçersiz kılarak sürüklemeyi uygulayabilirsiniz. Sürükleme hakkında daha fazla bilgi için Sürükleme ve ölçeklendirme bölümüne bakın.
• Kaydırma: Bu, kullanıcı parmağını hızlı bir şekilde sürükleyip kaldırdığında gerçekleşen kaydırma türüdür. Kullanıcı parmağını kaldırdıktan sonra, genellikle görüntü alanını hareket ettirmeye devam etmek ancak görüntü alanının hareketi durana kadar yavaşlamak istersiniz. GestureDetector.OnGestureListener içinde onFling() değerini geçersiz kılarak ve bir kaydırıcı nesnesi kullanarak hızla kaydırma uygulayabilirsiniz.
• Kaydırma: x ve y eksenleri boyunca aynı anda kaydırma yapmaya kaydırma adı verilir.

Kaydırma nesnelerini hızla kaydırma hareketiyle birlikte kullanmak yaygın bir durumdur ancak bunları, kullanıcı arayüzünün bir dokunma etkinliğine yanıt olarak kaydırmayı görüntülemesini istediğiniz herhangi bir bağlamda kullanabilirsiniz. Örneğin, dokunma etkinliklerini doğrudan işlemek ve bu dokunma etkinliklerine yanıt olarak bir kaydırma efekti veya "sayfaya tuttur" animasyonu oluşturmak için onTouchEvent() öğesini geçersiz kılabilirsiniz.

Yerleşik kaydırma uygulamaları içeren bileşenler

Aşağıdaki Android bileşenleri, kaydırma ve fazla kaydırma davranışı için yerleşik destek içerir:

• GridView
• HorizontalScrollView
• ListView
• NestedScrollView
• RecyclerView
• ScrollView
• ViewPager
• ViewPager2

Uygulamanızın farklı bir bileşen içinde kaydırmayı ve fazla kaydırmayı desteklemesi gerekiyorsa aşağıdaki adımları tamamlayın:

1. Özel bir dokunmaya dayalı kaydırma uygulaması oluşturun.
2. Android 12 ve sonraki sürümleri çalıştıran cihazları desteklemek için fazladan kaydırma efektini uygulayın.

Özel bir dokunmaya dayalı kaydırma uygulaması oluşturma

Bu bölümde, uygulamanızda kaydırma ve fazla kaydırma için yerleşik destek içermeyen bir bileşen kullanılıyorsa kendi kaydırma çubuğunuzu nasıl oluşturacağınız açıklanmaktadır.

Aşağıdaki snippet, InteractiveChart örneğinden gelir. GestureDetector kullanır ve GestureDetector.SimpleOnGestureListener yöntemini onFling() geçersiz kılar. Hızlıca kaydırma hareketini izlemek için OverScroller kullanır. Kullanıcı, hızlıca kaydırma hareketini gerçekleştirdikten sonra içerik kenarlarına ulaşırsa kapsayıcı, kullanıcının içeriğin sonuna ulaştığı zamanı belirtir. Bu gösterge, cihazın çalıştırdığı Android sürümüne bağlıdır:

• Android 12 ve sonraki sürümlerde görsel öğeler uzatılır ve geri döndürülür.
• Android 11 ve önceki sürümlerde görsel öğeler, parıltı efekti gösterir.

Aşağıdaki snippet'in ilk bölümünde onFling() uygulaması gösterilmektedir:

// Viewport extremes. See currentViewport for a discussion of the viewport.
private val AXIS_X_MIN = -1f
private val AXIS_X_MAX = 1f
private val AXIS_Y_MIN = -1f
private val AXIS_Y_MAX = 1f

// The current viewport. This rectangle represents the visible chart
// domain and range. The viewport is the part of the app that the
// user manipulates via touch gestures.
private val currentViewport = RectF(AXIS_X_MIN, AXIS_Y_MIN, AXIS_X_MAX, AXIS_Y_MAX)

// The current destination rectangle—in pixel coordinates—into which
// the chart data must be drawn.
private lateinit var contentRect: Rect

private lateinit var scroller: OverScroller
private lateinit var scrollerStartViewport: RectF
...
private val gestureListener = object : GestureDetector.SimpleOnGestureListener() {

    override fun onDown(e: MotionEvent): Boolean {
        // Initiates the decay phase of any active edge effects.
        if (Build.VERSION.SDK_INT < Build.VERSION_CODES.S) {
            releaseEdgeEffects()
        }
        scrollerStartViewport.set(currentViewport)
        // Aborts any active scroll animations and invalidates.
        scroller.forceFinished(true)
        ViewCompat.postInvalidateOnAnimation(this@InteractiveLineGraphView)
        return true
    }
    ...
    override fun onFling(
            e1: MotionEvent,
            e2: MotionEvent,
            velocityX: Float,
            velocityY: Float
    ): Boolean {
        fling((-velocityX).toInt(), (-velocityY).toInt())
        return true
    }
}

private fun fling(velocityX: Int, velocityY: Int) {
    // Initiates the decay phase of any active edge effects.
    // On Android 12 and later, the edge effect (stretch) must
    // continue.
    if (Build.VERSION.SDK_INT < Build.VERSION_CODES.S) {
            releaseEdgeEffects()
    }
    // Flings use math in pixels, as opposed to math based on the viewport.
    val surfaceSize: Point = computeScrollSurfaceSize()
    val (startX: Int, startY: Int) = scrollerStartViewport.run {
        set(currentViewport)
        (surfaceSize.x * (left - AXIS_X_MIN) / (AXIS_X_MAX - AXIS_X_MIN)).toInt() to
                (surfaceSize.y * (AXIS_Y_MAX - bottom) / (AXIS_Y_MAX - AXIS_Y_MIN)).toInt()
    }
    // Before flinging, stops the current animation.
    scroller.forceFinished(true)
    // Begins the animation.
    scroller.fling(
            // Current scroll position.
            startX,
            startY,
            velocityX,
            velocityY,
            /*
             * Minimum and maximum scroll positions. The minimum scroll
             * position is generally 0 and the maximum scroll position
             * is generally the content size less the screen size. So if the
             * content width is 1000 pixels and the screen width is 200
             * pixels, the maximum scroll offset is 800 pixels.
             */
            0, surfaceSize.x - contentRect.width(),
            0, surfaceSize.y - contentRect.height(),
            // The edges of the content. This comes into play when using
            // the EdgeEffect class to draw "glow" overlays.
            contentRect.width() / 2,
            contentRect.height() / 2
    )
    // Invalidates to trigger computeScroll().
    ViewCompat.postInvalidateOnAnimation(this)
}

// Viewport extremes. See currentViewport for a discussion of the viewport.
private static final float AXIS_X_MIN = -1f;
private static final float AXIS_X_MAX = 1f;
private static final float AXIS_Y_MIN = -1f;
private static final float AXIS_Y_MAX = 1f;

// The current viewport. This rectangle represents the visible chart
// domain and range. The viewport is the part of the app that the
// user manipulates via touch gestures.
private RectF currentViewport =
  new RectF(AXIS_X_MIN, AXIS_Y_MIN, AXIS_X_MAX, AXIS_Y_MAX);

// The current destination rectangle—in pixel coordinates—into which
// the chart data must be drawn.
private final Rect contentRect = new Rect();

private final OverScroller scroller;
private final RectF scrollerStartViewport =
  new RectF(); // Used only for zooms and flings.
...
private final GestureDetector.SimpleOnGestureListener gestureListener
        = new GestureDetector.SimpleOnGestureListener() {
    @Override
    public boolean onDown(MotionEvent e) {
         if (Build.VERSION.SDK_INT < Build.VERSION_CODES.S) {
            releaseEdgeEffects();
        }
        scrollerStartViewport.set(currentViewport);
        scroller.forceFinished(true);
        ViewCompat.postInvalidateOnAnimation(InteractiveLineGraphView.this);
        return true;
    }
...
    @Override
    public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {
        fling((int) -velocityX, (int) -velocityY);
        return true;
    }
};

private void fling(int velocityX, int velocityY) {
    // Initiates the decay phase of any active edge effects.
    // On Android 12 and later, the edge effect (stretch) must
    // continue.
    if (Build.VERSION.SDK_INT < Build.VERSION_CODES.S) {
            releaseEdgeEffects();
    }
    // Flings use math in pixels, as opposed to math based on the viewport.
    Point surfaceSize = computeScrollSurfaceSize();
    scrollerStartViewport.set(currentViewport);
    int startX = (int) (surfaceSize.x * (scrollerStartViewport.left -
            AXIS_X_MIN) / (
            AXIS_X_MAX - AXIS_X_MIN));
    int startY = (int) (surfaceSize.y * (AXIS_Y_MAX -
            scrollerStartViewport.bottom) / (
            AXIS_Y_MAX - AXIS_Y_MIN));
    // Before flinging, stops the current animation.
    scroller.forceFinished(true);
    // Begins the animation.
    scroller.fling(
            // Current scroll position.
            startX,
            startY,
            velocityX,
            velocityY,
            /*
             * Minimum and maximum scroll positions. The minimum scroll
             * position is generally 0 and the maximum scroll position
             * is generally the content size less the screen size. So if the
             * content width is 1000 pixels and the screen width is 200
             * pixels, the maximum scroll offset is 800 pixels.
             */
            0, surfaceSize.x - contentRect.width(),
            0, surfaceSize.y - contentRect.height(),
            // The edges of the content. This comes into play when using
            // the EdgeEffect class to draw "glow" overlays.
            contentRect.width() / 2,
            contentRect.height() / 2);
    // Invalidates to trigger computeScroll().
    ViewCompat.postInvalidateOnAnimation(this);
}

onFling(), postInvalidateOnAnimation() özelliğini çağırdığında x ve y değerlerinin güncellenmesi için computeScroll() tetiklenir. Bu işlem genellikle önceki örnekte gösterildiği gibi, görünüm alt öğesi bir kaydırıcı nesnesini kullanarak kaydırmayı canlandırdığında yapılır.

Çoğu görünüm, kaydırıcı nesnesinin x ve y konumunu doğrudan scrollTo() öğesine geçirir. Şu computeScroll() uygulaması farklı bir yaklaşım benimser: x ve y öğelerinin mevcut konumunu almak için computeScrollOffset() yöntemini çağırır. Fazla kaydırma "parlama" kenar efektini görüntüleme ölçütü karşılandığında, yani ekran yakınlaştırıldığında, x veya y sınırların dışındaysa ve uygulama halihazırda aşırı kaydırma göstermiyorsa kod, kaydırma parlama efektini ayarlar ve görünüm üzerinde bir geçersiz kılma tetiklemek için postInvalidateOnAnimation() çağrısı yapar.

// Edge effect/overscroll tracking objects.
private lateinit var edgeEffectTop: EdgeEffect
private lateinit var edgeEffectBottom: EdgeEffect
private lateinit var edgeEffectLeft: EdgeEffect
private lateinit var edgeEffectRight: EdgeEffect

private var edgeEffectTopActive: Boolean = false
private var edgeEffectBottomActive: Boolean = false
private var edgeEffectLeftActive: Boolean = false
private var edgeEffectRightActive: Boolean = false

override fun computeScroll() {
    super.computeScroll()

    var needsInvalidate = false

    // The scroller isn't finished, meaning a fling or
    // programmatic pan operation is active.
    if (scroller.computeScrollOffset()) {
        val surfaceSize: Point = computeScrollSurfaceSize()
        val currX: Int = scroller.currX
        val currY: Int = scroller.currY

        val (canScrollX: Boolean, canScrollY: Boolean) = currentViewport.run {
            (left > AXIS_X_MIN || right < AXIS_X_MAX) to (top > AXIS_Y_MIN || bottom < AXIS_Y_MAX)
        }

        /*
         * If you are zoomed in, currX or currY is
         * outside of bounds, and you aren't already
         * showing overscroll, then render the overscroll
         * glow edge effect.
         */
        if (canScrollX
                && currX < 0
                && edgeEffectLeft.isFinished
                && !edgeEffectLeftActive) {
            edgeEffectLeft.onAbsorb(scroller.currVelocity.toInt())
            edgeEffectLeftActive = true
            needsInvalidate = true
        } else if (canScrollX
                && currX > surfaceSize.x - contentRect.width()
                && edgeEffectRight.isFinished
                && !edgeEffectRightActive) {
            edgeEffectRight.onAbsorb(scroller.currVelocity.toInt())
            edgeEffectRightActive = true
            needsInvalidate = true
        }

        if (canScrollY
                && currY < 0
                && edgeEffectTop.isFinished
                && !edgeEffectTopActive) {
            edgeEffectTop.onAbsorb(scroller.currVelocity.toInt())
            edgeEffectTopActive = true
            needsInvalidate = true
        } else if (canScrollY
                && currY > surfaceSize.y - contentRect.height()
                && edgeEffectBottom.isFinished
                && !edgeEffectBottomActive) {
            edgeEffectBottom.onAbsorb(scroller.currVelocity.toInt())
            edgeEffectBottomActive = true
            needsInvalidate = true
        }
        ...
    }
}

// Edge effect/overscroll tracking objects.
private EdgeEffectCompat edgeEffectTop;
private EdgeEffectCompat edgeEffectBottom;
private EdgeEffectCompat edgeEffectLeft;
private EdgeEffectCompat edgeEffectRight;

private boolean edgeEffectTopActive;
private boolean edgeEffectBottomActive;
private boolean edgeEffectLeftActive;
private boolean edgeEffectRightActive;

@Override
public void computeScroll() {
    super.computeScroll();

    boolean needsInvalidate = false;

    // The scroller isn't finished, meaning a fling or
    // programmatic pan operation is active.
    if (scroller.computeScrollOffset()) {
        Point surfaceSize = computeScrollSurfaceSize();
        int currX = scroller.getCurrX();
        int currY = scroller.getCurrY();

        boolean canScrollX = (currentViewport.left > AXIS_X_MIN
                || currentViewport.right < AXIS_X_MAX);
        boolean canScrollY = (currentViewport.top > AXIS_Y_MIN
                || currentViewport.bottom < AXIS_Y_MAX);

        /*
         * If you are zoomed in, currX or currY is
         * outside of bounds, and you aren't already
         * showing overscroll, then render the overscroll
         * glow edge effect.
         */
        if (canScrollX
                && currX < 0
                && edgeEffectLeft.isFinished()
                && !edgeEffectLeftActive) {
            edgeEffectLeft.onAbsorb((int)mScroller.getCurrVelocity());
            edgeEffectLeftActive = true;
            needsInvalidate = true;
        } else if (canScrollX
                && currX > (surfaceSize.x - contentRect.width())
                && edgeEffectRight.isFinished()
                && !edgeEffectRightActive) {
            edgeEffectRight.onAbsorb((int)mScroller.getCurrVelocity());
            edgeEffectRightActive = true;
            needsInvalidate = true;
        }

        if (canScrollY
                && currY < 0
                && edgeEffectTop.isFinished()
                && !edgeEffectTopActive) {
            edgeEffectRight.onAbsorb((int)mScroller.getCurrVelocity());
            edgeEffectTopActive = true;
            needsInvalidate = true;
        } else if (canScrollY
                && currY > (surfaceSize.y - contentRect.height())
                && edgeEffectBottom.isFinished()
                && !edgeEffectBottomActive) {
            edgeEffectRight.onAbsorb((int)mScroller.getCurrVelocity());
            edgeEffectBottomActive = true;
            needsInvalidate = true;
        }
        ...
    }

Kodun gerçek yakınlaştırma işlemini gerçekleştiren bölümü aşağıda verilmiştir:

lateinit var zoomer: Zoomer
val zoomFocalPoint = PointF()
...
// If a zoom is in progress—either programmatically
// or through double touch—this performs the zoom.
if (zoomer.computeZoom()) {
    val newWidth: Float = (1f - zoomer.currZoom) * scrollerStartViewport.width()
    val newHeight: Float = (1f - zoomer.currZoom) * scrollerStartViewport.height()
    val pointWithinViewportX: Float =
            (zoomFocalPoint.x - scrollerStartViewport.left) / scrollerStartViewport.width()
    val pointWithinViewportY: Float =
            (zoomFocalPoint.y - scrollerStartViewport.top) / scrollerStartViewport.height()
    currentViewport.set(
            zoomFocalPoint.x - newWidth * pointWithinViewportX,
            zoomFocalPoint.y - newHeight * pointWithinViewportY,
            zoomFocalPoint.x + newWidth * (1 - pointWithinViewportX),
            zoomFocalPoint.y + newHeight * (1 - pointWithinViewportY)
    )
    constrainViewport()
    needsInvalidate = true
}
if (needsInvalidate) {
    ViewCompat.postInvalidateOnAnimation(this)
}

// Custom object that is functionally similar to Scroller.
Zoomer zoomer;
private PointF zoomFocalPoint = new PointF();
...
// If a zoom is in progress—either programmatically
// or through double touch—this performs the zoom.
if (zoomer.computeZoom()) {
    float newWidth = (1f - zoomer.getCurrZoom()) *
            scrollerStartViewport.width();
    float newHeight = (1f - zoomer.getCurrZoom()) *
            scrollerStartViewport.height();
    float pointWithinViewportX = (zoomFocalPoint.x -
            scrollerStartViewport.left)
            / scrollerStartViewport.width();
    float pointWithinViewportY = (zoomFocalPoint.y -
            scrollerStartViewport.top)
            / scrollerStartViewport.height();
    currentViewport.set(
            zoomFocalPoint.x - newWidth * pointWithinViewportX,
            zoomFocalPoint.y - newHeight * pointWithinViewportY,
            zoomFocalPoint.x + newWidth * (1 - pointWithinViewportX),
            zoomFocalPoint.y + newHeight * (1 - pointWithinViewportY));
    constrainViewport();
    needsInvalidate = true;
}
if (needsInvalidate) {
    ViewCompat.postInvalidateOnAnimation(this);
}

Bu, önceki snippet'te çağrılan computeScrollSurfaceSize() yöntemidir. Mevcut kaydırılabilir yüzey boyutunu piksel cinsinden hesaplar. Örneğin, grafik alanının tamamı görünüyorsa bu, mContentRect öğesinin mevcut boyutudur. Grafik her iki yönde de% 200 yakınlaştırılırsa döndürülen boyut yatay ve dikey olarak iki kat daha büyük olur.

private fun computeScrollSurfaceSize(): Point {
    return Point(
            (contentRect.width() * (AXIS_X_MAX - AXIS_X_MIN) / currentViewport.width()).toInt(),
            (contentRect.height() * (AXIS_Y_MAX - AXIS_Y_MIN) / currentViewport.height()).toInt()
    )
}

private Point computeScrollSurfaceSize() {
    return new Point(
            (int) (contentRect.width() * (AXIS_X_MAX - AXIS_X_MIN)
                    / currentViewport.width()),
            (int) (contentRect.height() * (AXIS_Y_MAX - AXIS_Y_MIN)
                    / currentViewport.height()));
}

Kaydırıcı kullanımına dair başka bir örnek için ViewPager sınıfının kaynak koduna bakın. Kısa süreli hareketlere yanıt olarak kaydırma yapar ve "sayfaya tuttur" animasyonunu uygulamak için kaydırmayı kullanır.

Fazla kaydırma efektini uygulama

EdgeEffect, Android 12'den başlayarak uzatma efektini uygulamak için aşağıdaki API'leri ekler:

• getDistance()
• onPullDistance()

Fazla kaydırma yaparak esnetme ile en iyi kullanıcı deneyimini sağlamak için aşağıdakileri yapın:

1. Kullanıcı içeriğe dokunduğunda uzatma animasyonu etkinleştiğinde, dokunmayı bir "yakalama" olarak kaydedin. Kullanıcı animasyonu durdurur ve esneme işlemini tekrar değiştirmeye başlar.
2. Kullanıcı parmağını egzersizin tersi yönünde hareket ettirdiğinde tam olarak geçene kadar esnemeyi bırakın, ardından kaydırmaya başlayın.
3. Kullanıcı bir esneme sırasında hızla hareket ettiğinde EdgeEffect, esneme efektini arttırır.

Animasyonu yakalama

Bir kullanıcı etkin bir uzatma animasyonu yakaladığında EdgeEffect.getDistance(), 0 değerini döndürür. Bu durum, esnemenin dokunma hareketiyle değiştirilmesi gerektiğini gösterir. Çoğu container'da, yakalama aşağıdaki kod snippet'inde gösterildiği gibi onInterceptTouchEvent() içinde algılanır:

override fun onInterceptTouchEvent(ev: MotionEvent): Boolean {
  ...
  when (action and MotionEvent.ACTION_MASK) {
    MotionEvent.ACTION_DOWN ->
      ...
      isBeingDragged = EdgeEffectCompat.getDistance(edgeEffectBottom) > 0f ||
          EdgeEffectCompat.getDistance(edgeEffectTop) > 0f
      ...
  }
  return isBeingDragged
}

@Override
public boolean onInterceptTouchEvent(MotionEvent ev) {
  ...
  switch (action & MotionEvent.ACTION_MASK) {
    case MotionEvent.ACTION_DOWN:
      ...
      isBeingDragged = EdgeEffectCompat.getDistance(edgeEffectBottom) > 0
          || EdgeEffectCompat.getDistance(edgeEffectTop) > 0;
      ...
  }
}

Yukarıdaki örnekte, mIsBeingDragged true olduğunda onInterceptTouchEvent(), true değerini döndürür. Dolayısıyla, alt yayıncının etkinliği kullanma fırsatı bulmadan önce etkinliği tüketmesi yeterlidir.

Fazla kaydırma efektini bırakın

Esneme efektinin, kayan içeriğe uygulanmasını önlemek için, kaydırma işleminden önce esneme efektinin serbest bırakılması önemlidir. Aşağıdaki kod örneği bu en iyi uygulamayı uygular:

override fun onTouchEvent(ev: MotionEvent): Boolean {
  val activePointerIndex = ev.actionIndex

  when (ev.getActionMasked()) {
    MotionEvent.ACTION_MOVE ->
      val x = ev.getX(activePointerIndex)
      val y = ev.getY(activePointerIndex)
      var deltaY = y - lastMotionY
      val pullDistance = deltaY / height
      val displacement = x / width

      if (deltaY < 0f && EdgeEffectCompat.getDistance(edgeEffectTop) > 0f) {
        deltaY -= height * EdgeEffectCompat.onPullDistance(edgeEffectTop,
            pullDistance, displacement);
      }
      if (deltaY > 0f && EdgeEffectCompat.getDistance(edgeEffectBottom) > 0f) {
        deltaY += height * EdgeEffectCompat.onPullDistance(edgeEffectBottom,
            -pullDistance, 1 - displacement);
      }
      ...
  }

@Override
public boolean onTouchEvent(MotionEvent ev) {

  final int actionMasked = ev.getActionMasked();

  switch (actionMasked) {
    case MotionEvent.ACTION_MOVE:
      final float x = ev.getX(activePointerIndex);
      final float y = ev.getY(activePointerIndex);
      float deltaY = y - lastMotionY;
      float pullDistance = deltaY / getHeight();
      float displacement = x / getWidth();

      if (deltaY < 0 && EdgeEffectCompat.getDistance(edgeEffectTop) > 0) {
        deltaY -= getHeight() * EdgeEffectCompat.onPullDistance(edgeEffectTop,
            pullDistance, displacement);
      }
      if (deltaY > 0 && EdgeEffectCompat.getDistance(edgeEffectBottom) > 0) {
        deltaY += getHeight() * EdgeEffectCompat.onPullDistance(edgeEffectBottom,
            -pullDistance, 1 - displacement);
      }
            ...

Kullanıcı sürüklerken dokunma etkinliğini iç içe yerleştirilmiş bir kaydırma kapsayıcısına iletmeden veya kaydırmayı sürüklemeden önce EdgeEffect çekme mesafesini kullanın. Önceki kod örneğinde, bir uç efekti gösterilirken getDistance() pozitif bir değer döndürür ve hareketle serbest bırakılabilir. Dokunma etkinliği, uzatmayı serbest bıraktığında ilk olarak EdgeEffect tarafından tüketilir. Böylece, iç içe geçmiş kaydırma gibi diğer efektler görüntülenmeden önce tamamen serbest bırakılır. Mevcut efektin serbest bırakılması için ne kadar çekme mesafesi gerektiğini öğrenmek amacıyla getDistance() kullanabilirsiniz.

onPull() işlevinden farklı olarak onPullDistance(), geçirilen deltanın tüketilen miktarını döndürür. Android 12'den itibaren, getDistance() 0 olduğunda onPull() veya onPullDistance() negatif deltaDistance değerleri iletilirse uzatma efekti değişmez. Android 11 ve önceki sürümlerde onPull(), toplam mesafe negatif değerlerinin parlama efektlerinin gösterilmesine izin verir.

Fazla kaydırmayı devre dışı bırak

Fazla kaydırmayı düzen dosyanızda veya programatik olarak devre dışı bırakabilirsiniz.

Düzen dosyanızda devre dışı bırakmak için android:overScrollMode öğesini aşağıdaki örnekte gösterildiği gibi ayarlayın:

<MyCustomView android:overScrollMode="never">
    ...
</MyCustomView>

Programatik olarak devre dışı bırakmak için aşağıdaki gibi bir kod kullanın:

customView.overScrollMode = View.OVER_SCROLL_NEVER

customView.setOverScrollMode(View.OVER_SCROLL_NEVER);

Ek kaynaklar

Aşağıdaki ilgili kaynaklara bakın:

• Giriş etkinliklerine genel bakış
• Sensörlere genel bakış
• Özel görünümü etkileşimli hale getirme