From 5565421302f4d33ea4e3d0439dfd021b09bb0a49 Mon Sep 17 00:00:00 2001
From: huhuanming <huanming@onekey.so>
Date: Sat, 12 Oct 2024 09:41:45 +0800
Subject: [PATCH] feat: support border-radius on cursor (#8)

---
 .gitignore               |  1 +
 package.json             |  2 +-
 src/PageContentView.tsx  |  2 +-
 src/PageHeaderCursor.tsx | 14 +++++++-------
 src/PageHeaderView.tsx   |  6 ++++--
 5 files changed, 14 insertions(+), 11 deletions(-)

diff --git a/.gitignore b/.gitignore
index 2b3d2c3..8292d1f 100644
--- a/.gitignore
+++ b/.gitignore
@@ -77,3 +77,4 @@ android/keystores/debug.keystore
 # generated by bob
 lib/
 
+.history/
\ No newline at end of file
diff --git a/package.json b/package.json
index 45e6c0d..73ac18f 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@onekeyfe/react-native-tab-page-view",
-  "version": "1.0.15",
+  "version": "1.0.16",
   "description": "React Native Tab Page View",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",
diff --git a/src/PageContentView.tsx b/src/PageContentView.tsx
index 5ee8140..2c48263 100644
--- a/src/PageContentView.tsx
+++ b/src/PageContentView.tsx
@@ -64,7 +64,7 @@ export default class PageContentView extends Component<PageContentViewProps> {
       },
     ],
     {
-      useNativeDriver: true,
+      useNativeDriver: false,
     }
   );
   private scrollView: RefObject<ContentFlatList> | null = React.createRef();
diff --git a/src/PageHeaderCursor.tsx b/src/PageHeaderCursor.tsx
index e2b689d..2cd7789 100644
--- a/src/PageHeaderCursor.tsx
+++ b/src/PageHeaderCursor.tsx
@@ -44,7 +44,7 @@ export default class PageHeaderCursor extends Component<PageHeaderCursorProps> {
 
   private _findPercentCursorWidth = () => {
     const { width } = this.props.cursorStyle as any;
-    if (typeof width == 'string') {
+    if (typeof width === 'string') {
       return width.match(/(\d+(\.\d+)?)%/)?.[1];
     }
     return null;
@@ -78,7 +78,7 @@ export default class PageHeaderCursor extends Component<PageHeaderCursorProps> {
                 const width = item.width - left - right;
                 return isWidth
                   ? (width * Number(percentWidth ?? 100)) / 100
-                  : item.x + width / 2.0 + left;
+                  : item.x + left;
               }
             } else {
               return 0;
@@ -113,11 +113,11 @@ export default class PageHeaderCursor extends Component<PageHeaderCursorProps> {
   override render() {
     const fixCursorWidth = this._findFixCursorWidth();
     const translateX = this._reloadPageIndexValue(false);
-    const scaleX = this._reloadPageIndexValue(true);
+    const widthX = this._reloadPageIndexValue(true);
 
     const containerStyle: Animated.WithAnimatedObject<any> = {
-      transform: [{ translateX }, fixCursorWidth ? { scale: 1 } : { scaleX }],
-      width: fixCursorWidth ?? 1,
+      transform: [{ translateX }],
+      width: fixCursorWidth ?? widthX,
       position: 'absolute',
       top: 0,
       bottom: 0,
@@ -127,7 +127,7 @@ export default class PageHeaderCursor extends Component<PageHeaderCursorProps> {
 
     const contentStyle = [
       this.props.cursorStyle,
-      { left: null, right: null, width: fixCursorWidth ?? 1 },
+      { left: null, right: null, width: fixCursorWidth ?? widthX },
     ];
 
     return (
@@ -149,7 +149,7 @@ export default class PageHeaderCursor extends Component<PageHeaderCursorProps> {
           {this.props.renderCursor ? (
             this.props.renderCursor()
           ) : (
-            <View style={contentStyle}></View>
+            <Animated.View style={contentStyle} />
           )}
         </Animated.View>
       </View>
diff --git a/src/PageHeaderView.tsx b/src/PageHeaderView.tsx
index 6aa0b80..40d9ccc 100644
--- a/src/PageHeaderView.tsx
+++ b/src/PageHeaderView.tsx
@@ -37,7 +37,9 @@ interface PageHeaderViewProps extends ScrollViewProps {
 
 export default class PageHeaderView extends Component<PageHeaderViewProps> {
   private scrollPageIndex = this.props.initialScrollIndex ?? 0;
-  private scrollPageIndexValue = new Animated.Value(this.scrollPageIndex);
+  private scrollPageIndexValue = new Animated.Value(this.scrollPageIndex, {
+    useNativeDriver: false,
+  });
   private nextScrollPageIndex = -1;
   private shouldHandlerAnimationValue = true;
   private itemConfigList = this.props.data.map((_: any) => ({
@@ -217,7 +219,7 @@ export default class PageHeaderView extends Component<PageHeaderViewProps> {
         this.scrollPageIndexValue,
         index,
         this.props.selectedPageIndexDuration,
-        true
+        false
       );
     }
     this.props.onSelectedPageIndex?.(index);