首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

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

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

25910

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

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

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

【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 在 主代码 , 同时导入两个模块

30720

在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

27210

React Native 开发心得分享

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

9710

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调试退出 先启动

2.5K20

​用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

3.6K60

详解Android studio如何导入jar包方法

下面我就总结一下Android studio大家在导入jar包时遇到一些问题和解决方法: 1,首先先说一下怎么在AS 中找到sdk,jdk,ndk安装路径,可能一部分人一开始找不到,下面贴出方法:...Androidstudio更改sdk路径,如下图,在右边红色方框更改sdk路径 ?...字体虽然好看但是不兼容汉字或者一些符号,有时候一些字体不合适也会出现乱码问题,是因为这些字体不兼容汉字或者一些符号,所以遇到汉字或一些符号时无法编码就会出现乱码,可以选择兼容字体如改为MicrosoftYaHei...6,向android studio导入jar包时,如果只把jar包复制粘贴到项目的libs目录,是不能使用jar包sdk,这点感觉没有eclipse好用,AS必须要找到复制进去jar包并导入才能用...只把jar包复制粘贴到项目的libs目录,是不能使用jar包sdk 2,右键module名称,本例子为app或者右键项目名称GGG也行,然后选中 Open Module Setting,在弹出框中选中下图红色框框住地方

3.2K30

资讯 | 扎克伯格被评为全球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云平台数据分析、机器学习训练和预测。

67620

资讯 | 网易狼人杀要来了;苹果停产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则用于对个别数据组进行观察。

78310

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:

83610

几个好用React-Native 开发工具

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

2.1K10

【Flutter】屏幕像素适配方案 ( flutter_screenutil 插件 )

文章目录 一、推荐使用 flutter_screenutil 插件 二、flutter_screenutil 插件使用 1、导入 flutter_screenutil 插件依赖 2、 flutter_screenutil...---- 1、导入 flutter_screenutil 插件依赖 在 pubspec.yaml 添加依赖 ; dependencies: flutter_screenutil: ^5.0.0+...2 点击右上角 " Pub get " 按钮 , 下载该依赖 ; 导入 Dart 包后 , 可以在文件中使用该插件包函数 ; import 'package:flutter_screenutil/...flutter_screenutil.dart'; 2、 flutter_screenutil 初始化 在 MyApp , 使用 ScreenUtilInit 作为最顶层组件 , 包裹 MaterialApp...API 用法 : 在 750 x 1337 设计稿 , 获取 540 对应宽度 ScreenUtil().setWidth(540) 也可以使用 540.w 获取相同值 ; API 参考 :

1K20

React Native 开发工具推荐

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

1.7K20

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

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

1.7K20

跨平台开发框架到底哪家强?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体验也很惊艳。

5.2K20

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

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

76200

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

目前来看比较火应该是 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

5K30

webpack打包原理分析和实现(一)

/expo.js" add(1,2) console.log("hello webpack") 执行命令 npx webpack,看到生成文件/dist/main.js: (function(modules...并对内容处理) 编译内容 生成bundle.js,代码可以直接在浏览器运行 自己实现一个bundle.js 模块分析:读取入口文件,分析代码 新建文件..../lib/webpack.js,其中利用了nodefs,读取文件内容,为了拿到文件依赖,不推荐使用字符串截取,引入模块名越多,就越麻烦,不灵活,推荐使用@babel/parser,这是babel7...callee: [Node], arguments: [Array] }, trailingComments: [ [Object] ] } ] 可以看到,index.js三行代码分别被解析成导入.../expo.js" //解析导入 add(1,2)解析成表达式 console.log("hello webpack")//解析成表达式

33120

React Native 导航:示例教程

在构建移动应用程序时,首要考虑是如何处理用户在应用程序导航问题,例如屏幕展示和屏幕之间切换。 React Navigation 是 React Native 最著名导航库之一。...注:在本文中,我们将在 React Native 应用程序中使用 Expo。...相反,我们使用了 npx expo install ,因为它会安装与我们项目软件包兼容依赖版本。...最后,运行应用程序 npx expo start 2.使用 TabNavigator 大多数移动应用程序都有一个以上屏幕。在此类移动应用程序,常见导航方式是基于标签导航。...要使用抽屉导航,请首先使用以下任一命令安装 @react-navigation/drawer 包: 接下来,我们将使用 npx expo install 安装依赖项: npx expo install

16210
领券