mirror of
https://gh-proxy.org/https://github.com/tiajinsha/JKVideo
synced 2026-07-07 23:18:38 +08:00
fix: 修复小窗无法拖动的问题
onStartShouldSetPanResponder 被内部 TouchableOpacity 抢占响应权。 改用 onMoveShouldSetPanResponderCapture:位移 >3px 时从子组件夺回响应权, 点击仍正常透传到 TouchableOpacity。
This commit is contained in:
@@ -35,7 +35,14 @@ export function LiveMiniPlayer() {
|
|||||||
|
|
||||||
const panResponder = useRef(
|
const panResponder = useRef(
|
||||||
PanResponder.create({
|
PanResponder.create({
|
||||||
onStartShouldSetPanResponder: () => true,
|
// 不在 start 阶段抢夺,让 TouchableOpacity 的点击正常触发
|
||||||
|
onStartShouldSetPanResponder: () => false,
|
||||||
|
onStartShouldSetPanResponderCapture: () => false,
|
||||||
|
// 有实际位移时,从子组件夺回响应权(capture 阶段,优先于子组件)
|
||||||
|
onMoveShouldSetPanResponder: (_, { dx, dy }) =>
|
||||||
|
Math.abs(dx) > 3 || Math.abs(dy) > 3,
|
||||||
|
onMoveShouldSetPanResponderCapture: (_, { dx, dy }) =>
|
||||||
|
Math.abs(dx) > 3 || Math.abs(dy) > 3,
|
||||||
onPanResponderGrant: () => {
|
onPanResponderGrant: () => {
|
||||||
pan.setOffset({ x: (pan.x as any)._value, y: (pan.y as any)._value });
|
pan.setOffset({ x: (pan.x as any)._value, y: (pan.y as any)._value });
|
||||||
pan.setValue({ x: 0, y: 0 });
|
pan.setValue({ x: 0, y: 0 });
|
||||||
@@ -51,12 +58,10 @@ export function LiveMiniPlayer() {
|
|||||||
const curY = (pan.y as any)._value;
|
const curY = (pan.y as any)._value;
|
||||||
|
|
||||||
// 吸附到左边缘或右边缘(取最近的一侧)
|
// 吸附到左边缘或右边缘(取最近的一侧)
|
||||||
// container 默认 right:12,pan.x=0 为右侧,-(sw-MINI_W-24) 为左侧贴边
|
|
||||||
const snapRight = 0;
|
const snapRight = 0;
|
||||||
const snapLeft = -(sw - MINI_W - 24);
|
const snapLeft = -(sw - MINI_W - 24);
|
||||||
const snapX = curX < snapLeft / 2 ? snapLeft : snapRight;
|
const snapX = curX < snapLeft / 2 ? snapLeft : snapRight;
|
||||||
|
|
||||||
// Y 轴仅做越界回弹,不吸附
|
|
||||||
const clampedY = Math.max(-sh + MINI_H + 60, Math.min(60, curY));
|
const clampedY = Math.max(-sh + MINI_H + 60, Math.min(60, curY));
|
||||||
|
|
||||||
Animated.spring(pan, {
|
Animated.spring(pan, {
|
||||||
@@ -66,6 +71,9 @@ export function LiveMiniPlayer() {
|
|||||||
friction: 10,
|
friction: 10,
|
||||||
}).start();
|
}).start();
|
||||||
},
|
},
|
||||||
|
onPanResponderTerminate: () => {
|
||||||
|
pan.flattenOffset();
|
||||||
|
},
|
||||||
}),
|
}),
|
||||||
).current;
|
).current;
|
||||||
|
|
||||||
|
|||||||
@@ -20,7 +20,12 @@ export function MiniPlayer() {
|
|||||||
|
|
||||||
const panResponder = useRef(
|
const panResponder = useRef(
|
||||||
PanResponder.create({
|
PanResponder.create({
|
||||||
onStartShouldSetPanResponder: () => true,
|
onStartShouldSetPanResponder: () => false,
|
||||||
|
onStartShouldSetPanResponderCapture: () => false,
|
||||||
|
onMoveShouldSetPanResponder: (_, { dx, dy }) =>
|
||||||
|
Math.abs(dx) > 3 || Math.abs(dy) > 3,
|
||||||
|
onMoveShouldSetPanResponderCapture: (_, { dx, dy }) =>
|
||||||
|
Math.abs(dx) > 3 || Math.abs(dy) > 3,
|
||||||
onPanResponderGrant: () => {
|
onPanResponderGrant: () => {
|
||||||
pan.setOffset({ x: (pan.x as any)._value, y: (pan.y as any)._value });
|
pan.setOffset({ x: (pan.x as any)._value, y: (pan.y as any)._value });
|
||||||
pan.setValue({ x: 0, y: 0 });
|
pan.setValue({ x: 0, y: 0 });
|
||||||
@@ -32,7 +37,6 @@ export function MiniPlayer() {
|
|||||||
const curX = (pan.x as any)._value;
|
const curX = (pan.x as any)._value;
|
||||||
const curY = (pan.y as any)._value;
|
const curY = (pan.y as any)._value;
|
||||||
|
|
||||||
// 吸附到左边缘或右边缘(取最近的一侧)
|
|
||||||
const snapRight = 0;
|
const snapRight = 0;
|
||||||
const snapLeft = -(sw - MINI_W - 24);
|
const snapLeft = -(sw - MINI_W - 24);
|
||||||
const snapX = curX < snapLeft / 2 ? snapLeft : snapRight;
|
const snapX = curX < snapLeft / 2 ? snapLeft : snapRight;
|
||||||
@@ -46,6 +50,9 @@ export function MiniPlayer() {
|
|||||||
friction: 10,
|
friction: 10,
|
||||||
}).start();
|
}).start();
|
||||||
},
|
},
|
||||||
|
onPanResponderTerminate: () => {
|
||||||
|
pan.flattenOffset();
|
||||||
|
},
|
||||||
})
|
})
|
||||||
).current;
|
).current;
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user