react-native - React スタック ナビゲーションにアイコンを提供する

Question

下部のナビゲーションにアイコンを割り当てようとしていますが、スタック ナビゲーションを作成しており、それらを下部のナビゲーションにレンダリングしています。私はReact Nativeが初めてなので、助けてください。そして使いたくないcreateMaterialBottomNavigator

import React from "react";
import { createStackNavigator, createAppContainer, createBottomTabNavigator } from "react-navigation";
import { Icon } from "native-base";
import DoctorHome from "../containers/Home/DoctorHome/DoctorHome";
import Appointments from "../containers/DoctorFlow/Appointments/Appointments";
import EditProfile from "../containers/DoctorFlow/EditProfile/EditProfile";
import ViewClinic from "../containers/DoctorFlow/ViewClinic/ViewClinic";
import AddClinic from "../containers/DoctorFlow/AddClinic/AddClinic";
import Profile from "../containers/DoctorFlow/Profile/Profile";
import Proffession from "../containers/DoctorFlow/Profile/Proffession";
import Login from "../containers/Login/Login";
import SignUp from "../containers/SignUp/SignUp";
// import Splash from "../containers/SplashScreen";
import {
  View,
  Image,
  Touchable,
  TouchableHighlight,
  TouchableNativeFeedback,
  Platform
} from "react-native";

  const HomeStack = createStackNavigator ({
    Home: DoctorHome,
    Appointments: Appointments,
    EditProfile: EditProfile
  });
  const ClinicStack = createStackNavigator ({
    Clinic: ViewClinic,
    AddClinic: AddClinic
  });
  const ProfileStack = createStackNavigator ({
    Profile: Profile,
    EditProfile: EditProfile,
    Proffession: Proffession
  });
  const LoginStack = createStackNavigator ({
    Login: Login,
    SignUp: SignUp
  });
  const MainNavigator = createBottomTabNavigator({
    Home: HomeStack,
    Clinic: ClinicStack,
    Profile: ProfileStack,
    Login: LoginStack
});

export const AppNavigator = createAppContainer(MainNavigator);