@cake-fxd/rn-case/Nav.js

ReactNative Case

"use strict";
exports.__esModule = true;
var lib_1 = require("@cake-fxd/rn-elements/lib");
var native_1 = require("@react-navigation/native");
var stack_1 = require("@react-navigation/stack");
var WordExerciseCase_1 = require("examples/WordExerciseCase");
var Font = require("expo-font");
var react_1 = require("react");
var react_native_1 = require("react-native");
var react_native_gesture_handler_1 = require("react-native-gesture-handler");
var react_native_safe_area_context_1 = require("react-native-safe-area-context");
var AudioSelectCase_1 = require("./examples/AudioSelectCase");
var AudioTextSelectCase_1 = require("./examples/AudioTextSelectCase");
var ChapterCase_1 = require("./examples/ChapterCase");
var ChunkWordCase_1 = require("./examples/ChunkWordCase");
var PosterCase_1 = require("./examples/PosterCase");
var ReviewCase_1 = require("./examples/ReviewCase");
var SelectPicCase_1 = require("./examples/SelectPicCase");
var SelectPicCaseMore_1 = require("./examples/SelectPicCaseMore");
var TextSelectCase_1 = require("./examples/TextSelectCase");
var TextSelectImageCase_1 = require("./examples/TextSelectImageCase");
var SCREENS = [
    {
        name: 'Home',
        title: '基础题型',
        component: HomeScreen
    },
    {
        name: 'SelectPicCase',
        title: 'N图选1(两张图片)',
        component: SelectPicCase_1["default"]
    },
    {
        name: 'SelectPicCaseMore',
        title: 'N图选1(三张图片)',
        component: SelectPicCaseMore_1["default"]
    },
    {
        name: 'TextSelectCase',
        title: '文本选1(文本)',
        component: TextSelectCase_1["default"]
    },
    {
        name: 'TextSelectImageCase',
        title: '文本选1(图片)',
        component: TextSelectImageCase_1["default"]
    },
    {
        name: 'AudioSelectCase',
        title: 'N音选1(图片)',
        component: AudioSelectCase_1["default"]
    },
    {
        name: 'AudioTextSelectCase',
        title: 'N音选1(文本)',
        component: AudioTextSelectCase_1["default"]
    },
    {
        name: 'ChunkWordCase',
        title: '组块拼句子',
        component: ChunkWordCase_1["default"]
    },
    {
        name: 'ChapterCase',
        title: '章节书',
        component: ChapterCase_1["default"]
    },
    {
        name: 'ReviewCase',
        title: '知识点总结页',
        component: ReviewCase_1["default"]
    },
    {
        name: 'PosterCase',
        title: '海报题',
        component: PosterCase_1["default"]
    },
    {
        name: 'WordExerciseCase',
        title: '练单词',
        component: WordExerciseCase_1["default"]
    },
];
var Stack = stack_1.createStackNavigator();
function App() {
    var loaded = Font.useFonts({
        'Nunito-Black': require('@assets/fonts/Nunito-Black-unhinted.ttf')
    })[0];
    if (!loaded) {
        return null;
    }
    //   return     (
    //     <Portal>
    //     <NavigationContainer>
    //         <Stack.Navigator
    //           initialRouteName="Home"
    //           screenOptions={{ headerShown: false, gestureEnabled: true }}
    //         >
    //           {SCREENS.map((item) => {
    //             return (
    //               <Stack.Screen
    //                 name={item.name}
    //                 component={item.component}
    //                 key={item.name}
    //                 options={{
    //                   headerShown: item.name === 'Home',
    //                   title: item.title,
    //                 }}
    //               />
    //             )
    //           })}
    //         </Stack.Navigator>
    //     </NavigationContainer>
    // </Portal>
    //   )
    return (<lib_1.Portal>
      <native_1.NavigationContainer>
        <Stack.Navigator initialRouteName="Home" screenOptions={{ headerShown: false, gestureEnabled: true }}>
          {SCREENS.map(function (item) {
        return (<Stack.Screen name={item.name} component={item.component} key={item.name} options={{
            headerShown: item.name === 'Home',
            title: item.title
        }}/>);
    })}
        </Stack.Navigator>
      </native_1.NavigationContainer>
    </lib_1.Portal>);
}
exports["default"] = App;
function HomeScreen(_a) {
    var navigation = _a.navigation;
    var AllScreens = SCREENS.slice(1);
    return (<react_native_safe_area_context_1.SafeAreaProvider>
      <react_native_1.View style={{ flex: 1 }}>
        <react_native_gesture_handler_1.ScrollView>
          {AllScreens.map(function (item) {
        return (<react_native_gesture_handler_1.TouchableWithoutFeedback onPress={function () { return navigation.navigate(item.name); }} key={item.name}>
                <react_native_1.View style={{
            height: 60,
            justifyContent: 'center',
            borderBottomWidth: 1,
            borderBottomColor: '#f2f2f2',
            backgroundColor: '#fff',
            paddingHorizontal: 20
        }}>
                  <react_native_1.Text style={{ fontWeight: 'bold' }}>{item.title}</react_native_1.Text>
                </react_native_1.View>
              </react_native_gesture_handler_1.TouchableWithoutFeedback>);
    })}
        </react_native_gesture_handler_1.ScrollView>
      </react_native_1.View>
    </react_native_safe_area_context_1.SafeAreaProvider>);
}
var styles = react_native_1.StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: '#fff',
        alignItems: 'center',
        justifyContent: 'center'
    }
});