Skip to content

Commit 97bbf43

Browse files
committed
chore(SpeedDial): 修复SpeedDial 悬浮标记在实例中拖拽困难 (#276)
1 parent 5bb11bb commit 97bbf43

File tree

4 files changed

+23
-25
lines changed

4 files changed

+23
-25
lines changed

example/examples/src/Layout/index.tsx

Lines changed: 8 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,7 @@ import {
66
ViewStyle,
77
SafeAreaView,
88
ScrollView,
9+
ScrollViewProps,
910
Text,
1011
TextStyle,
1112
Image,
@@ -54,7 +55,7 @@ const Header = (props: HeaderProps) => {
5455
);
5556
};
5657

57-
export interface BodyProps {
58+
export interface BodyProps extends ScrollViewProps {
5859
style?: StyleProp<ViewStyle>;
5960
children?: React.ReactNode;
6061
isScroll?: boolean;
@@ -141,15 +142,18 @@ const Card = (props: CardProps) => {
141142
);
142143
};
143144

144-
export interface ContainerProps {
145+
export interface ContainerProps extends ScrollViewProps {
145146
children?: React.ReactNode;
146147
isScroll?: boolean;
147148
}
148149

149150
export const Container = (props: ContainerProps) => {
151+
const {children, ...others} = props;
150152
return (
151-
<SafeAreaView style={{backgroundColor: '#ededed'}}>
152-
<ScrollView style={{height: '100%'}}>{props.children}</ScrollView>
153+
<SafeAreaView style={{backgroundColor: '#ededed'}} {...others}>
154+
<ScrollView style={{height: '100%'}} {...others}>
155+
{children}
156+
</ScrollView>
153157
</SafeAreaView>
154158
);
155159
};

example/examples/src/routes/SpeedDial/index.tsx

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -27,12 +27,11 @@ export default class Index extends Component<IndexProps, IndexState> {
2727
const {route} = this.props;
2828
const description = route.params.description;
2929
const title = route.params.title;
30-
3130
return (
32-
<Container>
31+
<Container scrollEnabled={false}>
3332
<Layout>
3433
<Header title={title} description={description} />
35-
<Body>
34+
<Body scrollEnabled={false}>
3635
<SpeedDial
3736
icon={['star-on', 'star-off']}
3837
isDrag={true}

packages/core/src/SpeedDial/SpeedDialItem.tsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import React, { useMemo } from 'react';
2-
import { View, StyleSheet, Text, TouchableOpacity, ViewStyle } from 'react-native';
2+
import { View, StyleSheet, Text, TouchableOpacity, ViewStyle, GestureResponderHandlers } from 'react-native';
33
import Icon, { IconsName } from '../Icon';
44
import { TabsItemIconTypes } from '../Tabs/TabsItem';
55

@@ -16,6 +16,7 @@ export interface SpeedDialItemProps {
1616
* 点击右边时触发
1717
*/
1818
onPress?: Function;
19+
move?: GestureResponderHandlers;
1920
}
2021

2122
function SpeedDialItem(props: SpeedDialItemProps) {
@@ -38,9 +39,8 @@ function SpeedDialItem(props: SpeedDialItemProps) {
3839
}, [icon]);
3940

4041
return (
41-
<View style={styles.speedDialItemContainer}>
42+
<View style={styles.speedDialItemContainer} {...props.move}>
4243
<View style={[styles.speedDialItemTitle, { ...titleStyle }]}>{ChildTitle}</View>
43-
4444
<TouchableOpacity
4545
onPress={() => {
4646
onPress && onPress();

packages/core/src/SpeedDial/index.tsx

Lines changed: 10 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -137,14 +137,8 @@ function SpeedDial(props: SpeedDialProps) {
137137
return (
138138
<View>
139139
<Animated.View
140-
style={
141-
isDrag
142-
? {
143-
transform: [{ translateX: pan.x }, { translateY: pan.y }],
144-
}
145-
: {}
146-
}
147-
{...panResponder.panHandlers}
140+
style={{ transform: [{ translateX: pan.x }, { translateY: pan.y }] }}
141+
// {...panResponder.panHandlers}
148142
>
149143
<View style={[styles.viewPosition, { bottom: bottom - MainHeight, right: right }]}>
150144
{success &&
@@ -159,15 +153,16 @@ function SpeedDial(props: SpeedDialProps) {
159153
]}
160154
key={i}
161155
>
162-
<Item {...item} />
156+
<Item {...item} move={panResponder.panHandlers} />
163157
</Animated.View>
164158
))}
165-
166-
<TouchableOpacity activeOpacity={1} onPress={onOpenHome}>
167-
<View style={[styles.homeContainer, { ...style }]} {...other}>
168-
{iconName === 'plus' ? PlusDom : CloseDom}
169-
</View>
170-
</TouchableOpacity>
159+
<View {...panResponder.panHandlers}>
160+
<TouchableOpacity activeOpacity={1} onPress={onOpenHome}>
161+
<View style={[styles.homeContainer, { ...style }]} {...other}>
162+
{iconName === 'plus' ? PlusDom : CloseDom}
163+
</View>
164+
</TouchableOpacity>
165+
</View>
171166
</View>
172167
</Animated.View>
173168
</View>

0 commit comments

Comments
 (0)