Как добавить настраиваемую панель контейнера поверх встроенной верхней навигации

я хочу создать пользовательскую панель поиска и значок уведомления, включая контейнер заголовка для определенной страницы поверх верхней панели навигации, экран должен быть похож на Google Play Store, я пробовал этот код `const

findScreen = ({navigation}) => {
    
    return (
        <View>
            <View style = {{flexDirection:"row",justifyContent:'space- 
                 between',padding:10}}>
                  <Searchbar
                     placeholder = "Search "
                      inputStyle = {{fontSize:15}}
                      style = {{
                     borderRadius:20,width:'85%'}}
                    />
                    <TouchableOpacity
                    style = {{
                        padding:5,
                    }}> 
                    
                        <FontAwesome5
                                    name = {'bell'}
                                    size = {30}
                                    color = {'#000'}
                               
                                />

                     </TouchableOpacity>
                                
        </View>
<View>
     <App/>
</View>
   

        </View>
    )
}

С помощью приведенного ниже `кода для навигации

const MyTabs = () => {
  return (

    <Tab.Navigator 
    sceneContainerStyle = {props => <MyTabBar {...props} />}

    tabBarOptions= {{
      activeTintColor: '#e91e63',
      labelStyle: {
        fontSize: 12,
      },
      scrollEnabled:true,
      
    }}
    >
    <Tab.Screen name = "Home" component = {AppHomeScreen} />
      <Tab.Screen name = "Clothing" component = {AppCategoryScreen} />
      <Tab.Screen name = "Learning" component = {AppCategoryScreen} />
      <Tab.Screen name = "Daily Life" component = {AppCategoryScreen} />
      <Tab.Screen name = "Category" component = {AppCategoryScreen} />
      <Tab.Screen name = "Service" component = {AppCategoryScreen} />
    </Tab.Navigator>

  );
}

export default MyTabs;

я не получил желаемого результата. Как добавить настраиваемую панель контейнера поверх встроенной верхней навигации

Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Массив зависимостей в React
Массив зависимостей в React
Все о массиве Dependency и его связи с useEffect.
0
0
33
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Если вы используете навигатор стека внутри своей навигации по вкладкам, вы можете установить панель заголовка на своих экранах следующим образом:

<Stack.Navigator screenOptions = {{
header: ({route}) => <YourCustomHeaderBar />
}}>
  <Stack.Screen name = {MyScreen} />
</Stack.Navigator>
Ответ принят как подходящий

Я добавил представление с flex=1 и интегрировал в него навигацию и панель поиска, и это все, что мне потребовалось.

Другие вопросы по теме