如果你仍然希望使用 ToolbarAndroid,以下是一个简单的例子:
import React from 'react';
import { View, ToolbarAndroid, StyleSheet } from 'react-native';
const App = () => {
const onActionSelected = (position) => {
if (position === 0) {
// 处理工具栏中的第一个按钮点击事件
// 可以执行你的操作
}
};
return (
<View style={styles.container}>
<ToolbarAndroid
style={styles.toolbar}
title="工具栏标题"
actions={[
{ title: '按钮1', show: 'always', icon: require('./path/to/icon.png') },
// 添加更多的按钮
]}
onActionSelected={onActionSelected}
/>
</View>
);
};
const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
},
toolbar: {
height: 56, // 默认工具栏高度
backgroundColor: '#2196F3',
},
});
export default App;
在这个例子中,我们使用了 ToolbarAndroid 组件,并设置了一些属性,如 title(工具栏标题)、actions(工具栏上的操作按钮)和 onActionSelected(操作按钮被点击时的回调函数)。
请注意,ToolbarAndroid 不再是 React Native 推荐的导航解决方案,建议使用 react-navigation 或其他现代的导航库。
转载请注明出处:http://www.zyzy.cn/article/detail/9478/React Native