type
status
date
slug
summary
tags
category
icon
password
📝 核心组件
Stack（堆栈）
使用后当前页面顶部会出现title以及返回按钮
SafeAreaView
简单来说，
SafeAreaView 的作用是确保你的内容显示在设备屏幕的“安全”范围内。观察你上传的 NFT 设计图，你会发现：
- 状态栏位置：中间页面的“9:41”时间和电量图标下方，需要留出足够的空间，否则搜索框会顶到最上面。
- 底部间距：右侧详情页的 "Place Bid" 按钮下方有一块空白区域。这不仅是为了美观，更是为了避开 iPhone 底部的 Home Indicator。
zustand库（仓库）
安装命令：大小写：永远记得
npm i zustand注意：在 React Native 环境中，浏览器的
localStorage 不可用，所以我们需要使用 AsyncStorage 作为持久化存储的后端。GestureHandlerRootView（手势接管）
在开发你图中的 NFT 应用时，
GestureHandlerRootView 是实现流畅交互（如下拉刷新、滑动切换 NFT 卡片、侧滑返回等）的基石。它是
react-native-gesture-handler 库提供的一个必备组件。1. 它的核心作用：手势接管
React Native 原生的手势处理系统在面对复杂的交互（尤其是手势嵌套，比如在一个滚动的列表里还有一个滑块）时，性能往往不够理想，甚至会产生冲突。
GestureHandlerRootView 的作用是：在原生层（Native Side）创建一个手势监听的“根容器”。它会接管所有子组件的手势信号，并利用原生性能进行高效分发，从而避免 JavaScript 线程卡顿时导致的手势延迟。TouchableOpacity（点击反馈）
它主要用于包裹任何你想要变成“可点击”的内容（如文字、图片或视图）。
进阶：它与 Pressable 的区别
虽然
TouchableOpacity 很经典，但在现代 React Native 开发中，你可能会看到另一个组件：Pressable。特性 | TouchableOpacity | Pressable |
反馈效果 | 仅限透明度变化（内置好） | 无默认效果（需手动编写样式） |
灵活性 | 较低，样式单一 | 极高，可以根据点击状态改变颜色、缩放等 |
推荐场景 | 快速开发、标准的 iOS 风格按钮 | 需要复杂的动效（如点击时按钮变大） |
lucide-react-native图标库
BlurView（毛玻璃效果）
它是由
expo-blur 库提供的，专门用于实现 iOS 风格的毛玻璃（半透明模糊）效果。在 Android 上，它通过半透明颜色进行回退处理（在较新的版本中也支持了实验性的模糊效果）。Gesture.Pan()（拖拽识别）
Gesture.Pan() 用于监听手指在屏幕上按下、移动并抬起的全过程。它会实时提供手指移动的物理数据。RefreshControl（顶部下拉刷新）
- Author:Ashland
- URL:http://preview.tangly1024.com/article/2decccc0-3782-80e1-b23a-e792aaca5fbe
- Copyright:All articles in this blog, except for special statements, adopt BY-NC-SA agreement. Please indicate the source!
