Kaydırma hareketini canlandırma

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

Android'de kaydırma işlemi genellikle ScrollView sınıfı kullanılarak gerçekleştirilir. Kapsayıcısının sınırlarının dışına taşabilecek tüm standart düzenleri bir ScrollView içine yerleştirerek çerçeve tarafından yönetilen kaydırılabilir bir görünüm sağlayın. Özel bir kaydırıcı uygulamak yalnızca özel senaryolar için gereklidir. Bu belgede, kaydırıcılar kullanılarak dokunma hareketlerine yanıt olarak kaydırma efektinin nasıl gösterileceği açıklanmaktadır.

Uygulamanız, dokunma etkinliğine yanıt olarak kaydırma animasyonu oluşturmak için gereken verileri toplamak amacıyla kaydırıcıları (Scroller veya OverScroller) kullanabilir. İkisi benzerdir ancak OverScroller, kullanıcıların kaydırma veya hızlı kaydırma hareketinden sonra içerik kenarlarına ulaştığını belirten yöntemler de içerir.

  • Android 12'den (API düzeyi 31) itibaren görsel öğeler, sürükleme etkinliğinde esneyip geri döner ve kaydırma etkinliğinde kaydırılıp geri döner.
  • Android 11 (API düzeyi 30) ve önceki sürümlerde, kenara doğru sürükleme veya kaydırma hareketinden sonra sınırlarda "parlama" efekti gösterilir.

Bu belgedeki InteractiveChart örneği, bu kaydırma sonu efektlerini görüntülemek için EdgeEffect sınıfını kullanır.

Sürtünme, hız ve diğer özellikler gibi platform standardı kaydırma fiziğini kullanarak kaydırma işlemini zaman içinde animasyonlu hale getirmek için kaydırıcı kullanabilirsiniz. Kaydırıcının kendisi hiçbir şey çizmez. Kaydırıcılar, kaydırma ofsetlerini zaman içinde sizin için izler ancak bu konumları görünümünüze otomatik olarak uygulamaz. Kaydırma animasyonunun sorunsuz görünmesini sağlayacak bir hızda yeni koordinatlar alıp uygulamanız gerekir.

Kaydırma terminolojisini anlama

Kaydırma, Android'de bağlama göre farklı anlamlara gelebilen bir kelimedir.

Kaydırma, görüntü alanını (yani baktığınız içerik "penceresini") hareket ettirme işlemidir. Kaydırma hem x hem de y ekseninde olduğunda buna kaydırma denir. Bu belgedeki InteractiveChart örnek uygulaması, iki farklı kaydırma, sürükleme ve fırlatma türünü gösterir:

  • Sürükleme: Bu, kullanıcının parmağını dokunmatik ekranda sürüklediğinde gerçekleşen kaydırma türüdür. GestureDetector.OnGestureListener içinde onScroll() yöntemini geçersiz kılarak sürükleme işlemini uygulayabilirsiniz. Sürükleme hakkında daha fazla bilgi için Sürükleme ve ölçeklendirme bölümüne bakın.
  • Hızlı kaydırma: Bu, kullanıcının parmağını hızlıca 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ı hareket etmeyi durdurana kadar yavaşlatmak istersiniz. GestureDetector.OnGestureListener içinde onFling() yöntemini geçersiz kılarak ve bir kaydırıcı nesnesi kullanarak kaydırma işlemini uygulayabilirsiniz.
  • Kaydırma: Aynı anda hem x hem de y eksenleri boyunca kaydırma işlemine kaydırma denir.

Kaydırıcı nesneleri genellikle kaydırma hareketiyle birlikte kullanılır ancak kullanıcı arayüzünün bir dokunma etkinliğine yanıt olarak kaydırma işlemini göstermesini istediğiniz her bağlamda kullanabilirsiniz. Örneğin, dokunma etkinliklerini doğrudan işlemek ve bu dokunma etkinliklerine yanıt olarak bir kaydırma efekti veya "sayfaya sığdır" animasyonu oluşturmak için onTouchEvent() yöntemini geçersiz kılabilirsiniz.

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

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

Uygulamanızın farklı bir bileşende kaydırmayı ve aşırı kaydırmayı desteklemesi gerekiyorsa aşağıdaki adımları uygulayın:

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

Dokunmaya dayalı özel bir kaydırma uygulaması oluşturma

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

Aşağıdaki snippet, InteractiveChart örneğinden alınmıştır. GestureDetector kullanır ve GestureDetector.SimpleOnGestureListener yöntemini onFling() geçersiz kılar. Hızlı kaydırma hareketini izlemek için OverScroller kullanır. Kullanıcı, kaydırma hareketini yaptıktan sonra içerik kenarlarına ulaşırsa kapsayıcı, kullanıcının içeriğin sonuna ulaştığını gösterir. Gösterge, cihazın kullandığı Android sürümüne bağlıdır:

  • Android 12 ve sonraki sürümlerde görsel öğeler esner ve geri döner.
  • Android 11 ve önceki sürümlerde görsel öğeler parlama efekti gösterir.

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

Kotlin

// 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)
}

Java

// 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() işlevini çağırdığında computeScroll() tetiklenerek x ve y değerlerini günceller. Bu işlem genellikle bir alt görünüm, önceki örnekte gösterildiği gibi bir kaydırıcı nesnesi kullanarak kaydırma animasyonu oluşturduğunda yapılır.

Çoğu görünüm, kaydırıcı nesnesinin x ve y konumunu doğrudan scrollTo() yöntemine iletir. Aşağıdaki computeScroll() uygulaması farklı bir yaklaşım kullanır: x ve y'nin mevcut konumunu almak için computeScrollOffset() yöntemini çağırır. Aşırı kaydırma "kaydırma sonu" kenar efektini görüntüleme ölçütleri karşılandığında (yani ekran yakınlaştırıldığında, x veya y sınırların dışındaysa ve uygulama zaten aşırı kaydırma göstermiyorsa) kod, aşırı kaydırma parlama efektini ayarlar ve görünümde geçersiz kılmayı tetiklemek için postInvalidateOnAnimation() yöntemini çağırır.

Kotlin

// 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
        }
        ...
    }
}

Java

// 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 yakınlaştırma işlemini gerçekleştiren bölümü aşağıda verilmiştir:

Kotlin

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)
}

Java

// 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.

Kotlin

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()
    )
}

Java

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. Kaydırma hareketlerine yanıt olarak kaydırılır ve "sayfaya tutturma" animasyonunu uygulamak için kaydırmayı kullanır.

Esnemeli kaydırma sonu efektini uygulama

Android 12'den itibaren EdgeEffect, esnek kaydırma sonu efektini uygulamak için aşağıdaki API'leri ekler:

  • getDistance()
  • onPullDistance()

Esnek kaydırma sonu ile en iyi kullanıcı deneyimini sunmak için aşağıdakileri yapın:

  1. Kullanıcı içeriğe dokunduğunda esnetme animasyonu etkinse dokunmayı "yakalama" olarak kaydedin. Kullanıcı animasyonu durdurur ve esnetme işlemini tekrar yapmaya başlar.
  2. Kullanıcı parmağını esnemenin tersi yönde hareket ettirdiğinde, esnemeyi tamamen kaybolana kadar serbest bırakın ve ardından kaydırmaya başlayın.
  3. Kullanıcı esnetme sırasında kaydırdığında esnetme efektini iyileştirmek için EdgeEffect kaydırın.

Animasyonu yakalayın

Kullanıcı etkin bir esneme animasyonu yakaladığında EdgeEffect.getDistance(), 0 değerini döndürür. Bu koşul, esnemenin dokunma hareketiyle değiştirilmesi gerektiğini gösterir. Çoğu container'da, catch ifadesi onInterceptTouchEvent() içinde algılanır. Bu durum aşağıdaki kod snippet'inde gösterilmektedir:

Kotlin

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
}

Java

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

Önceki örnekte, mIsBeingDragged true olduğunda onInterceptTouchEvent(), true değerini döndürür. Bu nedenle, alt öğenin etkinliği kullanma fırsatı olmadan önce etkinliği kullanmak yeterlidir.

Kaydırma sonu efektini serbest bırakma

Kaydırma efektinin kaydırılan içeriğe uygulanmasını önlemek için kaydırmadan önce esnetme efektini serbest bırakmak önemlidir. Aşağıdaki kod örneğinde bu en iyi uygulama uygulanmaktadır:

Kotlin

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);
      }
      ...
  }

Java

@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ükleme işlemi yaparken dokunma etkinliğini iç içe yerleştirilmiş bir kaydırma kapsayıcısına iletmeden veya kaydırma çubuğunu sürüklemeden önce EdgeEffect çekme mesafesini kullanın. Yukarıdaki kod örneğinde getDistance(), bir kenar efekti gösterildiğinde ve hareketle serbest bırakılabildiğinde pozitif bir değer döndürür. Dokunma etkinliği esnetmeyi bıraktığında, ilk olarak EdgeEffect tarafından kullanılır. Böylece, iç içe yerleştirilmiş kaydırma gibi diğer efektler gösterilmeden önce tamamen bırakılır. Mevcut efekti kaldırmak için ne kadar çekme mesafesi gerektiğini öğrenmek üzere getDistance() kullanabilirsiniz.

onPull() işlevinin aksine onPullDistance(), iletilen farkın tüketilen miktarını döndürür. Android 12'den itibaren, getDistance() 0 olduğunda onPull() veya onPullDistance()'e negatif deltaDistance değerleri iletilirse esneme efekti değişmez. Android 11 ve önceki sürümlerde onPull(), toplam mesafe için negatif değerlerin parlama efektleri göstermesine olanak tanır.

Kaydırma sonunu devre dışı bırakma

Kaydırma sonu efektini düzen dosyanızda veya programatik olarak devre dışı bırakabilirsiniz.

Düzen dosyanızda kapsam dışında kalmayı seçmek için android:overScrollMode değerini aşağıdaki örnekte gösterildiği gibi ayarlayın:

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

Programatik olarak kapsam dışında kalmak için aşağıdaki gibi bir kod kullanın:

Kotlin

customView.overScrollMode = View.OVER_SCROLL_NEVER

Java

customView.setOverScrollMode(View.OVER_SCROLL_NEVER);

Ek kaynaklar

Aşağıdaki ilgili kaynaklara göz atın: