diff options
Diffstat (limited to 'src')
-rw-r--r-- | src/view/com/util/Pager.tsx | 2 | ||||
-rw-r--r-- | src/view/com/util/TabBar.tsx | 24 | ||||
-rw-r--r-- | src/view/screens/Home.tsx | 1 |
3 files changed, 17 insertions, 10 deletions
diff --git a/src/view/com/util/Pager.tsx b/src/view/com/util/Pager.tsx index 89ba59e85..47b786fb1 100644 --- a/src/view/com/util/Pager.tsx +++ b/src/view/com/util/Pager.tsx @@ -68,7 +68,7 @@ export const Pager = ({ }, }, ], - {useNativeDriver: false}, + {useNativeDriver: true}, )}> {children} </AnimatedPagerView> diff --git a/src/view/com/util/TabBar.tsx b/src/view/com/util/TabBar.tsx index ac1814685..d3fe54830 100644 --- a/src/view/com/util/TabBar.tsx +++ b/src/view/com/util/TabBar.tsx @@ -44,14 +44,20 @@ export function TabBar({ backgroundColor: indicatorColor || pal.colors.link, bottom: indicatorPosition === 'bottom' ? -1 : undefined, top: indicatorPosition === 'top' ? -1 : undefined, - left: panX.interpolate({ - inputRange: items.map((_item, i) => i), - outputRange: itemLayouts.map(l => l.x), - }), - width: panX.interpolate({ - inputRange: items.map((_item, i) => i), - outputRange: itemLayouts.map(l => l.width), - }), + transform: [ + { + translateX: panX.interpolate({ + inputRange: items.map((_item, i) => i), + outputRange: itemLayouts.map(l => l.x + l.width / 2), + }), + }, + { + scaleX: panX.interpolate({ + inputRange: items.map((_item, i) => i), + outputRange: itemLayouts.map(l => l.width), + }), + }, + ], } const onLayout = () => { @@ -116,6 +122,8 @@ const styles = StyleSheet.create({ }, indicator: { position: 'absolute', + left: 0, + width: 1, height: 3, borderRadius: 4, }, diff --git a/src/view/screens/Home.tsx b/src/view/screens/Home.tsx index 390746eb3..52cf4352f 100644 --- a/src/view/screens/Home.tsx +++ b/src/view/screens/Home.tsx @@ -311,7 +311,6 @@ const styles = StyleSheet.create({ borderTopWidth: 1, paddingTop: 0, paddingBottom: 30, - // height: 100, }, tabBarAvi: { marginRight: 4, |