反应导航材料顶栏起始位置

时间:2020-04-13 00:26:42

标签: react-native react-navigation

我目前正在使用来自反应导航的重要顶部标签导航器,我的问题是,打开应用程序时,我希望它像这样Wanted Initial Position才能启动,但是它像这样Actual Initial Position一样启动,然后滚动到最后。我已经尝试过使用springConfig,timingConfig,但是它们都不起作用。因此,我与你们联系。

代码:

import React from "react";
import { View, Text } from "react-native";
import { createMaterialTopTabNavigator } from "@react-navigation/material-top-tabs";

//API's
import moment from "moment";

//Stack

//Screens
import Home from "../../screens/home/Home";
import AddTask from "../../screens/home/AddTasks";

//Initialize
const TopTab = createMaterialTopTabNavigator();

function DateFrom(days) {
 return moment().subtract(days,"d").format("MMMM Do YYYY");
};

function MyTabBar(props) {
    return(
        <View style={{ width: "100%", height: 30, backgroundColor: "red", justifyContent: "center", alignItems: "center" }}>
            <Text>Salut</Text>
        </View>
    );
}

function HomeTopTabNavigator() {
    return (
        <TopTab.Navigator tabBarOptions={defaultOptions} initialRouteName="TODAY">
            <TopTab.Screen name={DateFrom(4)} component={AddTask} />
            <TopTab.Screen name={DateFrom(3)} component={AddTask} />
            <TopTab.Screen name="YESTERDAY" component={AddTask} />
            <TopTab.Screen name="TODAY" component={Home} />
        </TopTab.Navigator>
    );
};

//Default Options
const defaultOptions = {
    indicatorStyle: {
        backgroundColor: "#ffa87b",
    },
    labelStyle: {
        fontFamily: "myriadBold",
    },
    scrollEnabled: true,
};

export default HomeTopTabNavigator

0 个答案:

没有答案
相关问题