RN 使用react-navigation写可以滚动的横向导航条(expo项目)

 

装包:

yarn add @react-navigation/material-top-tabs react-native-tab-view

 

npx expo install react-native-pager-view

 

 

import React from 'react'
import { View, Text, ScrollView, SafeAreaView } from 'react-native'
import { Icon } from '../../../../../component/light'
import { createMaterialTopTabNavigator } from '@react-navigation/material-top-tabs'
import useList from './useList'
import styles from './styles'const HomeScreen = () => {return (<ScrollView style={styles.mMeTabsScrollView}><Text>666</Text></ScrollView>)
}const SettingsScreen = () => {return (<ScrollView style={styles.mMeTabsScrollView}><Text>666</Text></ScrollView>)
}const Tab = createMaterialTopTabNavigator()export default function Home(props) {const { index, userInfo, handleSetIndex, handleJumpPage, handleQuit } =useList(props)return (<View style={{ flex: 1 }}><Tab.NavigatorscreenOptions={{tabBarScrollEnabled: true,}}><Tab.Screen name="Home" component={HomeScreen} /><Tab.Screen name="Settings" component={SettingsScreen} /><Tab.Screen name="Home1" component={HomeScreen} /><Tab.Screen name="Settings1" component={SettingsScreen} /><Tab.Screen name="Home2" component={HomeScreen} /><Tab.Screen name="Settings2" component={SettingsScreen} /></Tab.Navigator></View>)
}

 

 

 

参考链接:

https://chat.xutongbao.top/

https://www.cnblogs.com/tengyuxin/p/13263143.html

https://reactnavigation.org/docs/material-top-tab-navigator/ 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/33491.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

栈和队列详解

目录 栈 栈的概念及结构&#xff1a; 栈的实现&#xff1a; 代码实现&#xff1a; Stack.h stack.c 队列&#xff1a; 概念及结构&#xff1a; 队列的实现&#xff1a; 代码实现&#xff1a; Queue.h Queue.c 拓展&#xff1a; 循环队列&#xff08;LeetCode题目链接&#xff0…

rust里如何快速实现一个LRU 本地缓存?

LRU是Least Recently Used&#xff08;最近最少使用&#xff09;的缩写&#xff0c;是一种常见的缓存淘汰算法。LRU算法的基本思想是&#xff0c;当缓存空间已满时&#xff0c;优先淘汰最近最少使用的数据&#xff0c;以保留最常用的数据。 在计算机系统中&#xff0c;LRU算法…

http历史版本

1&#xff0c;HTTP0.9 最早的http版本&#xff0c;后来才被定义为0.9版本。 这时候通信采用的是纯文本格式&#xff1b; 只支持get请求&#xff0c;且在服务器响应之后就关闭连接&#xff1b; 没有请求头的概念&#xff0c;功能比较简单。 2&#xff0c;HTTP1.0 这个版本增…

C++中new/malloc,delete/free的区别

new和delete是操作符&#xff0c;malloc和free是库函数。 执行new实际上执行了两个操作&#xff1a;1、分配未初始化的内存空间&#xff0c;也就是调用malloc库函数。2、使用对象的构造函数对空间进行初始化&#xff0c;并返回空间的首地址。 如果第一步分配空间出现问题&…

机器学习基础08-回归算法矩阵分析(基于波士顿房价(Boston House Price)数据集)

回归算法通常涉及到使用矩阵来表示数据和模型参数。线性回归是最常见的回归算法之一&#xff0c;它可以用矩阵形式来表示。 考虑一个简单的线性回归模型&#xff1a; y m x b y mx b ymxb&#xff0c;其中 y y y 是因变量&#xff0c; x x x 是自变量&#xff0c; m m m 是…

美团视觉GPU推理服务部署架构优化实战

&#x1f337;&#x1f341; 博主 libin9iOak带您 Go to New World.✨&#x1f341; &#x1f984; 个人主页——libin9iOak的博客&#x1f390; &#x1f433; 《面试题大全》 文章图文并茂&#x1f995;生动形象&#x1f996;简单易学&#xff01;欢迎大家来踩踩~&#x1f33…

【C++】开源:tinyxml2解析库配置使用

&#x1f60f;★,:.☆(&#xffe3;▽&#xffe3;)/$:.★ &#x1f60f; 这篇文章主要介绍tinyxml2解析库配置使用。 无专精则不能成&#xff0c;无涉猎则不能通。——梁启超 欢迎来到我的博客&#xff0c;一起学习&#xff0c;共同进步。 喜欢的朋友可以关注一下&#xff0c;…

【问题解决】Git命令行常见error及其解决方法

以下是我一段时间没有使用xshell&#xff0c;然后用git命令行遇到的一些系列错误和他们的解决方法 遇到了这个报错&#xff1a; fatal: Not a git repository (or any of the parent directories): .git 我查阅一些博客和资料&#xff0c;可以解决的方式&#xff1a; git in…

Linux单进程、单线程调试命令

l //显示main函数所在的文件的源代码list 文件名:num //显示filename文件num行上下的源代码b 行号 //给指定行添加断点b 函数名 //给指点函数的第一有效行添加一个断点info break //显示断点信息delete 断点号 //删除指定断点disable 断点号 //将断点设定为无效的&#xff0c;不…

冒泡排序 简单选择排序 插入排序 快速排序

bubblesort 两个for循环&#xff0c;从最右端开始一个一个逐渐有序 #include <stdio.h> #include <string.h> #include <stdlib.h>void bubble(int *arr, int len); int main(int argc, char *argv[]) {int arr[] {1, 2, 3, 4, 5, 6, 7};int len sizeof(…

学习Linux,要把握哪些重点?

不知道有没有想学习Linux&#xff0c;但又把握不住学习重点&#xff0c;找不到合适的学习方法的小伙伴&#xff0c;反正我刚开始学习Linux时就像无头苍蝇似的“乱撞”&#xff0c;没有把握住学习重点&#xff0c;不知道怎么去学&#xff0c;差点要放弃了&#xff0c;还好在慢慢…

栈和队列详解(1)

目录 一、什么是栈&#xff1f; 二、创建一个我们自己的栈 1.前置准备 1.1需要的三个文件 1.2结构体的创建和头文件的引用 2.接口的实现 2.1初始化栈结构体 2.2尾插(压栈) 2.3栈存放的元素个数和判断栈是否为空 2.4获取栈顶元素 2.5出栈 2.6摧毁栈 2.7测试接口 三、…

【Freertos基础入门】freertos任务的优先级

文章目录 前言一、任务优先级1.Tick2.修改任务优先级 总结 前言 本系列基于stm32系列单片机来使用freerots 任务管理是实时操作系统&#xff08;RTOS&#xff09;的核心功能之一&#xff0c;它允许开发者以并发的方式组织和管理多个任务。FreeRTOS 是一个流行的开源RTOS&…

数学建模学习(9):模拟退火算法

模拟退火算法(Simulated Annealing, SA)的思想借 鉴于固体的退火原理&#xff0c;当固体的温度很高的时候&#xff0c;内能比 较大&#xff0c;固体的内部粒子处于快速无序运动&#xff0c;当温度慢慢降 低的过程中&#xff0c;固体的内能减小&#xff0c;粒子的慢慢趋于有序&a…

LVS-DR模式集群构建过程演示

一、工作原理 LVS的工作原理 1.当用户向负载均衡调度器&#xff08;Director Server&#xff09;发起请求&#xff0c;调度器将请求发往至内核空间 2.PREROUTING链首先会接收到用户请求&#xff0c;判断目标IP确定是本机IP&#xff0c;将数据包发往INPUT链 3.IPVS是工作在IN…

WPF上位机9——Lambda和Linq

Lambda Linq 操作集合 使用类sql形式查询 Linq To SQL

【maven】常见命令

文章目录 1. 打包编译时跳过测试2.显示maven依赖树3. 显示maven依赖列表4. 下载依赖包的源码5. 安装本地jar到本地仓库 1. 打包编译时跳过测试 mvn clean install -DskipTests mvn clean install -Dmaven.test.skiptrueDskipTests&#xff0c;不执行测试用例&#xff0c;但编译…

Java、Android 之 TCP / IP

TCP、IP是一系列协议组成的网络分层模型 客户端向服务端发送请求可能会走N条链路&#xff0c;这个过程叫路由 TCP传输 一般在1--1024端口 必须连接以后才能传输数据 UDP协议通常只是发送数据 TCP连接 TCP需要建立连接才能通信&#xff0c;建立连接需要端口&#xff0c;Sock…

【Terraform学习】本地变量(Terraform配置语言学习)

背景&#xff1a; 关于如何在机器上拉terraform代码&#xff0c;初始化就不重复了&#xff0c;需要的可以查看前面的文章&#xff1a; 【Terraform学习】Terraform-AWS部署快速入门&#xff08;快速入门&#xff09;_向往风的男子的博客-CSDN博客 使用本地变量命名资源 将每…

centos7安装redis6

centos7安装redis6 https://blog.csdn.net/xiaotiaoza/article/details/130107822 允许访问的地址&#xff0c;默认是127.0.0.1&#xff0c;会导致只能在本地访问。修改为0.0.0.0则可以在任意IP访问&#xff0c;生产环境不要设置为0.0.0.0 bind 0.0.0.0 守护进程&#xff0…