Swipeable TabScreen
Chưa có ai nhận issue này.
Đánh giá
- Độ khó
- 2/5
- Thời gian dự kiến
- 1-3 giờ
- Mức phù hợp với người mới
- 35/100
- Loại issue
- Tài liệu
- Độ rõ ràng
- Cần làm rõ
- Mức độ hoạt động
- Đình trệ
- Công nghệ
- javascript, react-native
- Lĩnh vực
- documentation, mobile-dev
Hướng nghiên cứu
Bắt đầu bằng cách kiểm tra tài liệu của Tab.Navigator và các hướng dẫn điều hướng Android/iOS hiện có liên quan đến cấu hình vuốt. Công việc được xem là hoàn tất khi đã ghi rõ liệu điều hướng bằng thao tác vuốt có được hỗ trợ hay không và, nếu có, cấu hình hoặc ví dụ cần thiết thuộc về đâu.
Do mô hình lập chỉ mục viết ra từ nội dung của issue.
Mô tả
How can I enable swipe in TabScreen?
I want to change screens when the user swipes on it in (Android and IOS).
Is there any property that I am missing?
<Tab.Navigator
initialRouteName="home"
tabBarOptions={{
keyboardHidesTabBar: true,
}}
tabBar={props => <CustomBottomBar {...props} />}>
<Tab.Screen
name="home"
component={HomeScreen}
options={{
tabBarLabel: 'Abc',
}}
/>
<Tab.Screen
name="splash"
component={SplashScreen}
options={{
tabBarLabel: 'Xyz',
}}
/>
</Tab.Navigator>
function CustomTabBar({ state, descriptors, navigation }) {
return (
<View style={{ flexDirection: 'row' }}>
{state.routes.map((route, index) => {
const { options } = descriptors[route.key];
const label =
options.tabBarLabel !== undefined
? options.tabBarLabel
: options.title !== undefined
? options.title
: route.name;
const isFocused = state.index === index;
const onPress = () => {
const event = navigation.emit({
type: 'tabPress',
target: route.key,
canPreventDefault: true,
});
if (!isFocused && !event.defaultPrevented) {
navigation.navigate(route.name);
}
};
const onLongPress = () => {
navigation.emit({
type: 'tabLongPress',
target: route.key,
});
};
return (
<TouchableOpacity
accessibilityRole="button"
accessibilityStates={isFocused ? ['selected'] : []}
accessibilityLabel={options.tabBarAccessibilityLabel}
testID={options.tabBarTestID}
onPress={onPress}
onLongPress={onLongPress}
style={{ flex: 1 }}
>
<Text style={{ color: isFocused ? '#673ab7' : '#222' }}>
{label}
</Text>
</TouchableOpacity>
);
})}
</View>
);
}
- Ngôn ngữ chính
- JavaScript
- Star
- 324
- Fork
- 2k
- Chỉ số merge pull request
- Không có pull request nào được merge trong 30 ngày
Hướng dẫn đóng góp
Chưa lập chỉ mục được hướng dẫn đóng góp cho kho mã nguồn này
Bắt đầu từ đâu
- Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
- Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
- Fork repository và làm thay đổi trên một nhánh.
- Mở pull request có tham chiếu số hiệu của issue.
Issue khác của react-navigation/react-navigation.github.io
-
Độ khó 1/5 Dưới một giờ Mức phù hợp với người mới 94/100
react-navigation/react-navigation.github.io#1516 · 1 bình luận ·
-
Độ khó 1/5 Dưới một giờ Mức phù hợp với người mới 90/100
-
Độ khó 1/5 Dưới một giờ Mức phù hợp với người mới 72/100
-
Độ khó 1/5 1-3 giờ Mức phù hợp với người mới 68/100
-
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 72/100
Tất cả issue của react-navigation/react-navigation.github.io
Issue tương tự
-
Bug
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 70/100
Automattic/safe-publish#594 ·
-
内部文件键(绝对路径的 base64)泄漏到界面标签 Đang mở
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 75/100
dream-num/dsh-univer-office#104 ·
-
comp/dashboard invalid P3
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 70/100
NousResearch/hermes-agent#121143 ·
-
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 75/100
avniproject/avni-webapp#1811 ·
-
area/auroraboot area/webui bug
Độ khó 2/5 1-3 giờ Mức phù hợp với người mới 75/100