@onekeyfe/react-native-pager-view 3.0.120 → 3.0.122

package/android/src/main/java/com/reactnativepagerview/CollapsiblePagerHost.kt

@@ -760,9 +760,10 @@ class CollapsiblePagerHost(context: Context) : NestedScrollableHost(context), Ne
 
   private fun finishHeaderGesture(event: MotionEvent) {
     val owner = headerGestureOwner.name.lowercase()
-    if (nativeGestureStarted) {
+    if (nativeGestureStarted || nestedNativeGestureStarted) {
       NativeGestureUtil.notifyNativeGestureEnded(this, event)
       nativeGestureStarted = false
+      nestedNativeGestureStarted = false
     }
     log(
       "gesture-end action=${event.actionMasked} owner=$owner region=$headerTouchRegion " +
@@ -791,6 +792,7 @@ class CollapsiblePagerHost(context: Context) : NestedScrollableHost(context), Ne
         forwardedRecycler = null
         pressCancelled = false
         nativeGestureStarted = false
+        nestedNativeGestureStarted = false
         headerTouchRegion = headerRegionAt(event.y) ?: "none"
         headerTouchActive = headerTouchRegion != "none"
         if (!headerTouchActive) return super.dispatchTouchEvent(event)
@@ -979,6 +981,7 @@ class CollapsiblePagerHost(context: Context) : NestedScrollableHost(context), Ne
     forwardedRecycler = null
     pressCancelled = false
     nativeGestureStarted = false
+    nestedNativeGestureStarted = false
     viewTreeObserver.removeOnPreDrawListener(pageContentLayoutListener)
     detachRecyclerObserver()
     for (recycler in originalRecyclerPadding.keys.toList()) {

package/android/src/main/java/com/reactnativepagerview/CollapsiblePagerNativeHeaders.kt

@@ -53,6 +53,9 @@ private class CollapsiblePagerHorizontalItemsView(
   private val density = resources.displayMetrics.density
   private val content = FrameLayout(context)
   private val indicator = View(context)
+  private val indicatorBackground = GradientDrawable().apply {
+    shape = GradientDrawable.RECTANGLE
+  }
   private val buttons = ArrayList<TextView>()
   private val itemFrames = ArrayList<IntArray>()
   private var items: List<CollapsiblePagerNativeHeaderItem> = emptyList()
@@ -80,7 +83,8 @@ private class CollapsiblePagerHorizontalItemsView(
     isFillViewport = true
     overScrollMode = OVER_SCROLL_NEVER
     clipToPadding = false
-    content.addView(indicator)
+    indicator.background = indicatorBackground
+    content.addView(indicator, FrameLayout.LayoutParams(0, 0))
     addView(
       content,
       LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.MATCH_PARENT),
@@ -141,6 +145,7 @@ private class CollapsiblePagerHorizontalItemsView(
     if (showsProgressIndicator) {
       indicatorHeightPx = max(0, dp(indicatorHeight))
       indicatorBottomPx = max(0, dp(indicatorBottom))
+      indicatorBackground.cornerRadius = indicatorHeightPx / 2f
     }
     applyTypeface()
     requestLayout()
@@ -159,7 +164,7 @@ private class CollapsiblePagerHorizontalItemsView(
     this.inactiveTextColor = inactiveTextColor
     this.selectedBackgroundColor = selectedBackgroundColor
     this.indicatorColor = indicatorColor
-    indicator.setBackgroundColor(indicatorColor)
+    indicatorBackground.setColor(indicatorColor)
     updatePresentation()
   }
 
@@ -216,7 +221,6 @@ private class CollapsiblePagerHorizontalItemsView(
       MeasureSpec.makeMeasureSpec(height, MeasureSpec.EXACTLY),
     )
     setMeasuredDimension(width, height)
-    updatePresentation()
   }
 
   override fun onLayout(changed: Boolean, left: Int, top: Int, right: Int, bottom: Int) {
@@ -238,6 +242,7 @@ private class CollapsiblePagerHorizontalItemsView(
   private fun updatePresentation() {
     if (buttons.isEmpty() || itemFrames.size != buttons.size) return
     val selectedIndex: Int
+    val scrollTargetCenterX: Float
     if (showsProgressIndicator) {
       val clamped = progress.coerceIn(0f, buttons.lastIndex.toFloat())
       val lower = floor(clamped).toInt()
@@ -245,18 +250,19 @@ private class CollapsiblePagerHorizontalItemsView(
       val fraction = clamped - lower
       val from = itemFrames[lower]
       val to = itemFrames[upper]
-      val indicatorX = (from[2] + (to[2] - from[2]) * fraction).roundToInt()
-      val indicatorWidth = (from[3] + (to[3] - from[3]) * fraction).roundToInt()
-      indicator.layoutParams = FrameLayout.LayoutParams(indicatorWidth, indicatorHeightPx).apply {
-        leftMargin = indicatorX
-        topMargin = max(0, measuredHeight - indicatorBottomPx - indicatorHeightPx)
-      }
+      val interpolatedIndicatorX = from[2] + (to[2] - from[2]) * fraction
+      val interpolatedIndicatorWidth = from[3] + (to[3] - from[3]) * fraction
+      val indicatorX = interpolatedIndicatorX.roundToInt()
+      val indicatorWidth = interpolatedIndicatorWidth.roundToInt()
+      val indicatorTop = max(0, measuredHeight - indicatorBottomPx - indicatorHeightPx)
+      indicator.layout(
+        indicatorX,
+        indicatorTop,
+        indicatorX + indicatorWidth,
+        indicatorTop + indicatorHeightPx,
+      )
       indicator.visibility = if (indicatorHeightPx > 0) VISIBLE else GONE
-      indicator.background = GradientDrawable().apply {
-        shape = GradientDrawable.RECTANGLE
-        setColor(indicatorColor)
-        cornerRadius = indicatorHeightPx / 2f
-      }
+      scrollTargetCenterX = interpolatedIndicatorX + interpolatedIndicatorWidth / 2f
       selectedIndex = clamped.roundToInt()
       buttons.forEachIndexed { index, button ->
         val emphasis = 1f - min(1f, kotlin.math.abs(clamped - index))
@@ -266,6 +272,8 @@ private class CollapsiblePagerHorizontalItemsView(
       }
     } else {
       selectedIndex = items.indexOfFirst { item -> item.key == selectedKey }
+      val frame = itemFrames.getOrNull(selectedIndex)
+      scrollTargetCenterX = frame?.let { it[0] + it[1] / 2f } ?: 0f
       indicator.visibility = GONE
       buttons.forEachIndexed { index, button ->
         val selected = index == selectedIndex
@@ -276,8 +284,7 @@ private class CollapsiblePagerHorizontalItemsView(
     }
 
     if (centerSelectionWhenIdle && !isTouchDragging && width > 0 && selectedIndex in itemFrames.indices) {
-      val frame = itemFrames[selectedIndex]
-      val desired = (frame[0] + frame[1] / 2 - width / 2)
+      val desired = (scrollTargetCenterX - width / 2f).roundToInt()
         .coerceIn(0, max(0, content.measuredWidth - width))
       scrollTo(desired, 0)
       centerSelectionWhenIdle = false

package/android/src/main/java/com/reactnativepagerview/NestedScrollableHost.kt

@@ -32,7 +32,7 @@ open class NestedScrollableHost : FrameLayout {
   private var touchSlop = 0
   private var initialX = 0f
   private var initialY = 0f
-  private var nativeGestureStarted: Boolean = false
+  protected var nestedNativeGestureStarted: Boolean = false
   private val parentViewPager: ViewPager2?
     get() {
       var v: View? = parent as? View
@@ -110,7 +110,7 @@ open class NestedScrollableHost : FrameLayout {
 
       if (scaledDx > touchSlop || scaledDy > touchSlop) {
         NativeGestureUtil.notifyNativeGestureStarted(this, e)
-        nativeGestureStarted = true
+        nestedNativeGestureStarted = true
 
         if (orientation == null) return
         if (isVpHorizontal == (scaledDy > scaledDx)) {
@@ -132,9 +132,9 @@ open class NestedScrollableHost : FrameLayout {
 
   override fun onTouchEvent(e: MotionEvent): Boolean {
     if (e.actionMasked == MotionEvent.ACTION_UP) {
-      if (nativeGestureStarted) {
+      if (nestedNativeGestureStarted) {
         NativeGestureUtil.notifyNativeGestureEnded(this, e)
-        nativeGestureStarted = false
+        nestedNativeGestureStarted = false
       }
     }
     return super.onTouchEvent(e)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@onekeyfe/react-native-pager-view",
-  "version": "3.0.120",
+  "version": "3.0.122",
   "description": "React Native wrapper for Android and iOS ViewPager",
   "source": "./src/index.tsx",
   "main": "./lib/module/index.js",
@@ -67,7 +67,7 @@
     "typescript": "^5.9.2"
   },
   "peerDependencies": {
-    "@onekeyfe/react-native-native-logger": "3.0.120",
+    "@onekeyfe/react-native-native-logger": "3.0.122",
     "react": "*",
     "react-native": "*"
   },