首页
学习
活动
专区
圈层
工具
发布

如何在React Native中添加自定义字体

要跟上进度,你应该熟悉 React Native 或 Expo SDK 的基础知识,包括 JSX、组件(类和函数式)和样式。...一旦项目成功安装,你将会看到下面的图片: 在你喜欢的IDE中打开你的项目以开始。在这个教程中,我们将使用VS Code。 一旦项目已经启动,我们将继续获取我们想要使用的字体。...我们将讨论如何导入它们并在我们的项目中使用它们。...让我们看看输出: 在Expo中使用自定义字体的React Native 在这一部分,我们将学习如何在Expo中使用自定义字体。...在我们的模拟器中看看这是什么样子: 使用自定义字体 假设你正在构建一个个人的 React Native 项目,并且你得到了一些自定义字体,这些字体并不在 Expo 支持的 Google 字体库中。

5K10

React Native推送通知:完整的操作指南

我们首先导入了客户端模块,该模块也在 api 目录中。...稍后,我们可以使用这些令牌向所有注册的设备发送通知。 在服务器上发送通知 要向服务器发送推送通知,我们需要使用Expo提供的一个SDK。...你可以查看这个GitHub仓库,这是我在这个教程中使用的服务器源代码。我们将访问服务器中的 utilities 目录,并在其中包含 Expo SDK。...解决设置推送通知时的常见问题 开发人员在使用 Expo 通知和 Notifee 时常常会遇到一些常见的问题。...让我们看看这些问题的原因以及如何解决它们: 我无法在裸 React Native 应用中运行 Expo 通知:这是因为 Expo 通知库依赖于其他 Expo 库。

8K10
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    【Python】模块导入 ④ ( 自定义模块 | 制作自定义模块 | 使用 import from 导入并使用自定义模块中的函数 | 导入自定义模块功能名称冲突问题 )

    a + b 2、使用 import 导入并使用自定义模块 在另外的文件中 , 导入 my_module 模块 , 然后通过 my_module.add 调用 my_module 模块中的 add 函数...from 导入并使用自定义模块中的函数 代码示例 : """ 自定义模块 代码示例 """ # 导入自定义模块 from my_module import add num = add(1, 2)...1、导入自定义模块功能名称冲突问题 如果 两个模块中 , 都定义了 相同名称 的函数 , 同时使用 from module_name import specific_name 方式 , 到了两个模块中...相同名称 的函数 , 此时 , 就会出现 名称冲突 问题 , 这种情况下 后导入的 功能生效 , 先导入的功能被覆盖 ; 3、模块功能冲突代码示例 在 my_module.py 模块中 , 定义了 如下...如下 add 函数 ; def add(a, b): print("调用 my_module2 模块中的功能") return a + b + 1 在 主代码中 , 同时导入两个模块的

    2.4K20

    expo

    通过结合使用 React 和 JavaScript,开发者可以在一个统一的环境中构建跨平台的应用,而不需要切换不同的技术栈。...Expo 的核心优势之一就是它提供了一个完整的 SDK、模块 API、CLI 工具以及丰富的文档,极大简化了跨平台开发过程。...例如,Expo 应用服务 (EAS) 提供了一套集成的服务平台,能够帮助开发者在个人或团队环境中更轻松地管理和发布应用。...安装和使用 Expo 的安装过程非常简单,用户只需要按照官方文档中的步骤进行配置,就可以开始使用它进行应用开发。Expo CLI 提供了一套命令行工具,支持创建新项目、构建应用、发布到应用商店等操作。...在官方文档中,Expo 还提供了丰富的资源,包括教程、常见问题解答 (FAQ) 和开发指南,帮助开发者解决在使用过程中遇到的各种问题。 Expo 鼓励开发者为开源社区贡献代码。

    97710

    老板说,2 天开发一个 App,双端支持,我是怎么做到的

    而且,Expo SDK 每年都会发布几次更新,哦不好意思,每个月都会更新,奶奶的,我刚用就从 50 更新到 51 了,也够速度的,但是好在,是兼容的,好处是确保你能用上最新最酷的功能,比如 react...你也不用担心这些功能的性能问题。Expo 团队非常注重性能优化,确保你的应用能在各类设备上流畅运行。使用相机,使用数据库啥的,一个 import 搞定,兼容 API,双端几乎一致的体验简直爽大爆炸。...社区与支持最让人欣慰的是,Expo 背后有一个活跃的社区。你可以随时在GitHub上提出问题,或者浏览别人已经解决的类似问题。除此之外,Expo 的文档非常详细,新手也能很快上手。...docs: https://expo.dev/changelog/2024/05-07-sdk-516. 什么时候不该用Expo?当然,Expo 也并不是万能的。...如果你需要使用某些非常特殊的原生功能,Expo 可能并不能完全满足你的需求。在这种情况下,你可能需要“弹出”Expo(也就是所谓的“eject”),从而使用纯粹的 React Native 环境。

    1.4K10

    在React Native中构建启动屏

    此外,由于Expo很受欢迎,许多人常常选择使用它,我们也将探讨如何在Expo中构建启动屏幕。 什么是启动画面? 启动画面是用户访问应用程序其余功能之前出现的第一个屏幕。...首先,我们将之前安装的 RNSplashScreen 导入到 AppDeligate.m 中。...将内容模式设置为“aspect fit”,如下所示: 更改iOS启动屏幕颜色 你可能会问的下一个问题是“我如何在 React Native 中更改启动屏幕的背景颜色?”...使用 Expo,我们可以以简化和直接的方式做到这一点,因为 Expo 允许我们在 app.json 文件中配置我们的启动屏幕和图片。 我们将使用上述的 App.js 和 Login.js 文件。...文件中,我们导入并调用它: /* App.js */ import * as SplashScreen from 'expo-splash-screen'; SplashScreen.preventAutoHideAsync

    5.7K10

    React Native 开发心得分享

    但国内的社区好像并不是很好,很多问题我都是在国外论坛中解决的。 如果你学习它是为了扩展其他平台的开发能力,那么还是可以学习一番的,会有另一番的收获。...Expo​ Expo 是基于 React Native 并整合大量常用的 native module(Expo SDK),像原生的功能如相册,相机,蓝牙等功能,在 expo 都是直接集成的,相当于封装原生的...在浏览器打开 snack.expo.dev ,点击 MyDevice,扫码并在 Expo app 中查看。 会自动将该程序实时运行在你的移动端设备,意味着你更改代码也将会同步到Expo go 中。...总之如今开发 RN 请毫不犹豫的使用上 Expo。 开发中遇到的一些坑点​ 实际开发中所遇到的坑点远不止下述所说,这里只列举几个相对有代表,坑比较深的点。甚至有很多坑都不是前端方面的知识了。...,在 next 和 expo 中则直接通过 @xxx/app 子包来导入,具体可看代码,这里就不做过多介绍了。

    2K31

    安卓12+后的系统默认使用Splash配置(icon+背景色)导致重复启动Splash屏幕

    国内的设备大部分没有强制使用,所以不影响,不过有其他Splash问题本文也会给出解决方案,比如全屏幕,透明状态栏,避免home(主页)短暂的闪烁,一般是空的Header或者自定义了Header会出现这个问题...修复双重Splash的思路关于双重启动Splash可以参考安卓官方发布:将启动画面实现迁移到 Android 12 及更高版本,由于Expo53以前使用的还是老的自定义Activity作为Splash启动...,所以加上新SDK的默认Splash就出现两次Splash。...Prebuild项目 & Expo Bare项目如果你是Expo的项目,并且使用了Prebuild,那么需要按照上面RN原生方案改的基础上再修改如下配置,因为Expo Prebuild后会按照app.json...如果你使用Expo的app.json配置,有个很可惜的配置项就是Splash背景色不支持设置android的透明格式,Eas会报错,所以Bare工作流需要使用下面的插件自动替换修复这个色值。

    31010

    react native基本使用

    react native调试) yarn 安装包(npm会有些问题) rn 的android添加local.properties内容如下,指定android sdk存放位置 sdk.dir=D:.../ProgramFiles/Android/Android_SDK 调试是出错误提示,可以检查任务管理器,关闭所有执行中的node.exe程序,node端口占用可能导致调试连接失败,也可以关闭react...adb reverse tcp:8097 tcp:8097 浏览器中点击reload按钮连接 apk程序,设置toggle inspector后,选中控件,可以高亮react-devtools中的模块...native布局尺寸 react view设置flex占满剩余空间,view设置style大小才管用(其他空间,设置style好像不行,比较坑) react安装unimodules https://docs.expo.io...React native断开连接后重连,成功加载后才能有界面上的错误提示,否则只能在vscode中看到错误,app中没有call stack显示) 另一个调试工具占用,vscode调试退出 先启动

    3.4K20

    ​用expo,从0到1 轻松学react native

    如果我还想打包成Android,还要去配置Android的编译环境,装sdk,调试环境。 有可能就从入门到放弃了。。。...由于最近又要开始react native的开发,所以重新翻了下官方文档,发现rn已经迭代到46版本了,安装最新的版本,还需要额外的第三方编译库,还用上了yarn。...Expo 好处就是: 不用再去配置烦人的 iOS、Android 编译环境 可以用 Windows 开发 iOS 版的 RN 应用。...接下来使用 Expo 扫描这个二维码就可以打开你编写的 RN 应用了。 并且只要在 Expo 中打开过一次,就会在 App 中保留一个入口。 Expo相当于一个壳,你只需关注js层面的开发即可。...参考资料: https://docs.expo.io/versions/latest/introduction/index.html

    4.5K60

    资讯 | 扎克伯格被评为全球IT业最不谨慎的CEO;中国移动研发系留式无人机应急通信高空基站

    4 Expo SDK v18.0.0 发布 近日发布的 Expo SDK 18.0.0 版本基于 React Native 0.45,引入了一系列的新特性与性能提升。...在该版本中 exp.json 被合并到了 app.json 中,从而简化了 React Native 生态系统与 Expo 使用者之间的差异;并且新的项目不再使用 Expo.registerRootComponent...除此之外,Expo 响应的开发工具 XDE、exp、Snack 等也都得到了优化。...新版本中的特性包括了细粒度配置,即允许针对同一目录下的不同文件开启不同的配置、允许从 package.json 文件中设置忽略的文件、优化了 autofixes 的用法等等。...Prediction API的开发者们迁移到Cloud Machine Learning Engine,后者能使用Google云平台的数据分析、机器学习训练和预测。

    82220

    资讯 | 网易的狼人杀要来了;苹果停产iPod Nano和Shuffle;Facebook发布Messenger 2.1

    4 React 开源许可证风波 近日,Apache 基金会宣布禁止使用包括 React 在内的, Facebook 带附加条款的 BSD Licence的开源软件,引发了部分使用者的担忧;社区已经有很多人请愿修改...5 npm 5.3.0 发布 自 5.x 版本发布之后,npm 一直致力于提升版本迭代速度,尽可能地通过小的更新来修复 npm 存在的问题。...而本周发布的 5.3.0 版本为 npm ls 命令添加了 --link 参数,并且为 npx 添加了更多的支持语言版本;此外该版本还修复了一系列版本控制上的问题。...6 Expo SDK v19.0.0 发布 近日基于 React Native 0.46 版本的 Expo SDK v19.0.0 正式发布,其大幅度更新了 Android 中 JavaScriptCore...其中Facets Overview负责帮助您掌握数据中的每项具体特征,而Facets Dive则用于对个别数据组进行观察。

    98010

    Expo与Flutter:如何选择合适的移动框架

    在本文中,我将提出并回答十个可操作的问题,这些问题将帮助您确定适合您特定用例的技术,以便您自信地说:“我选择 Expo/Flutter 是因为 X、Y 和 Z。”...这就是为什么我们需要提出正确的问题来为您的项目选择合适的技术。 选择 Expo 和 Flutter 的 10 个问题 1. 您是否拥有 React/Dart 知识?...在 Expo 中,相机被抽象化,您可以使用 expo-camera 包来渲染原生 iOS 和 Android 相机视图。 虽然看起来是一个很小的区别,但它会影响某些项目的关键要求。...使用 Expo,您可以使用 EAS Update 将 JS 更新直接发送到应用程序的最终用户。此服务允许您替换应用程序中的非原生部分(JS、样式代码和资产),而无需向商店提交新版本。...我观察到的趋势是,公司使用 Flutter 来构建员工体验,在这种体验中,在多个设备上拥有视觉上相同的体验对于内部应用程序来说是有意义的,而公司使用 Expo 来构建消费者体验。这些显然不是绝对的。

    1.9K10

    React-native,我们一起走过的坑。

    your own native builds 但是,是男人的话怎么能那么快eject的,所以这时就该大名鼎鼎的’Expo’登场了,你只需要在你的手机或者模拟器上安装上这个最新版的’Expo’软件,然后在你的本地项目运行命令...StyleSheet.create({ view: { width:300, }, text:{ fontSize:10, } } 如果你想把这个view里面的text字体都设为...style={{width: 100, height: 100}} source={{uri: url}} /> 那么问题来了,我特么的怎么知道图片的尺寸是什么。...解决方法: 1、使用Image自带的getSize方法先获取宽高 2、使用别的大神的组件React Native Fit Image 等 资源超过400kb左右不显示 所以说原生组件, 推荐使用别的组件库.../xxx/') 点击事件尽量使用Touchable开头的 react-navigation 官方推荐的路由组件库 我使用StackNavigator方法 坑1:

    1.3K10

    几个好用的React-Native 开发工具

    传统的开发中,按照平台划分为 iOS , Android , Windows 和 Mac 。其中,随着移动设备的使用移动端应用的开发也越来越多。...通过使集成 SDK 的形式,开发者可以在 React Native 应用快速运行微信小程序、支付宝小程序等,同时利用小程序的生态优势,如丰富的 API 和庞大的用户群体。...还可以在开发和运维过程中降低成本,避免重复的代码编写和维护。不过,使用小程序容器技术需要开发者具备一定的小程序开发经验和技能,需要熟悉小程序生命周期、API 调用方式、组件等知识。...Expo 的使用非常简单,只需要安装 Expo CLI,就可以快速地创建和打包一个基于 Expo 的应用。...二、写在最后 好的技术和工具不仅可以提高应用的性能和开发效率,还可以让开发者更好地应对不同的开发场景和需求,希望可以和大家一起更好地理解和使用 React Native 中的新技术和工具。

    3.4K10

    React Native 开发工具推荐

    中的状态。...通过使集成 SDK 的形式,开发者可以在 React Native 应用快速运行微信小程序、支付宝小程序等,同时利用小程序的生态优势,如丰富的 API 和庞大的用户群体。...还可以在开发和运维过程中降低成本,避免重复的代码编写和维护。不过,使用小程序容器技术需要开发者具备一定的小程序开发经验和技能,需要熟悉小程序生命周期、API 调用方式、组件等知识。...Expo 的使用非常简单,只需要安装 Expo CLI,就可以快速地创建和打包一个基于 Expo 的应用。...图片二、写在最后好的技术和工具不仅可以提高应用的性能和开发效率,还可以让开发者更好地应对不同的开发场景和需求,希望可以和大家一起更好地理解和使用 React Native 中的新技术和工具。

    2.4K20

    移动开发者必备的 React Native 开发工具

    中的状态。...通过使集成 SDK 的形式,开发者可以在 React Native 应用快速运行微信小程序、支付宝小程序等,同时利用小程序的生态优势,如丰富的 API 和庞大的用户群体。...还可以在开发和运维过程中降低成本,避免重复的代码编写和维护。不过,使用小程序容器技术需要开发者具备一定的小程序开发经验和技能,需要熟悉小程序生命周期、API 调用方式、组件等知识。...Expo 的使用非常简单,只需要安装 Expo CLI,就可以快速地创建和打包一个基于 Expo 的应用。...二、写在最后好的技术和工具不仅可以提高应用的性能和开发效率,还可以让开发者更好地应对不同的开发场景和需求,希望可以和大家一起更好地理解和使用 React Native 中的新技术和工具。

    2.4K20

    深度测评 | 五大主流多端开发框架全面对比

    目前来看比较火的应该是 Flutter,次之 RN,具体还要看企业的应用场景和领域,AVM,Ionic,NativeScript 在不少企业和个人开发者中也使用率较高。 一,安装环境,开发工具对比。...首先是 Nodejs 的命令行工具安装: yarn global add expo-cli 这里不说配置源什么的了,如果慢的话,可以切换国内 yarn 源,安装完毕后,直接使用 expo init AwesomeProject...需要先下载 Flutter 的 SDK:https://docs.flutter.dev/development/tools/sdk/releases 解压缩 SDK 后设置对应的 SDK 环境变量地址...development unzip ~/Downloads/flutter_macos_vX.X.X-stable.zip export PATH="$PATH:`pwd`/flutter/bin" 如果过程中遇到问题可以使用...,需要使用真机安装 AppLoader 进行调试,类似 RN 的 Expo。

    6.6K30

    品牌设计 | PTX企鹅潮玩展2019

    本次潮玩展的slogan是PASSION FOR TRENDY X,X是eXpo(展览),是eXperience(体验),是eXcellent(最好的),希望大家在本次活动中尽情释放对潮玩的热爱与激情!...品牌字体的选择上,最终确定的中文字体方正锐正黑,与英文字体Arial都属于方正且边角切割明显的字体,视觉冲击力强同时和logo及辅助图形方块的感受一致。...而中文正文部分,选择的是普适的兰亭黑系列字体,便于阅读与传播。 B.辅助图形 经过多次尝试与调整,最终确定用标志PTX中的X延展出辅助图形。...现场搭建的过程需要不断与搭建的师傅们进行确认和监督,尽量缩小误差和控制整体搭建效果,出现最多的问题是设计与现实情况有冲突,如弱电的走线和隔板的位置需要考虑展方使用和流动用户安全,需要大量临场判断和处理,...2.从成本和实现效果上考虑,我们使用的是桁架+户外等布的处理方式,其中灯布是师傅手工安装,在夜晚搭建的过程中很容易出现误差,在预算充足的情况下建议使用木板/KT板/PVC板等方式进行场地搭建。

    90400

    跨平台开发框架到底哪家强?5款主流框架横向对比!

    目前来看比较火的应该是 Flutter,次之 RN,具体还要看企业的应用场景和领域,AVM,Ionic,NativeScript 在不少企业和个人开发者中也使用率较高。 一,安装环境,开发工具对比。...首先是 Nodejs 的命令行工具安装: yarn global add expo-cli 这里不说配置源什么的了,如果慢的话,可以切换国内 yarn 源,安装完毕后,直接使用 expo init AwesomeProject...需要先下载 Flutter 的 SDK:https://docs.flutter.dev/development/tools/sdk/releases 解压缩 SDK 后设置对应的 SDK 环境变量地址...developmentunzip ~/Downloads/flutter\_macos\_vX.X.X-stable.zipexport PATH="$PATH:`pwd`/flutter/bin" 如果过程中遇到问题可以使用...其他框架中 AVM和 Ionic 各有优势,但是从使用体验,上手难度,社区情况来看,国内的 AVM 肯定更适合国内开发者一些,毕竟有本土化,云端集成,而且debug体验也很惊艳。

    9.9K20
    领券