海之飞燕

Menu
  • IOS
  • Swift
  • 前端开发
  • Flutter
  • ReactNative
  • Other
Menu

ReactNative-屏幕适配

Posted on 2020年2月14日2020年12月14日 by Herriat
import {Dimensions} from 'react-native'

//app 只有竖屏模式,所以可以只获取一次width
const deviceWidthDp = Dimensions.get('window').width;
//UI 默认给图是375
const uiWidthPx = 375;

function pxSize(uiElementPx){
    return uiElementPx * deviceWidthDp / uiWidthPx;
}

export default pxSize;

使用方式
导入文件
import pxSize from './public/pxSize';

width:pxSize(160),

发表评论 取消回复

邮箱地址不会被公开。 必填项已用*标注

近期文章

  • WKWebView加载H5页面,退出时视频继续播放
  • Swift基础知识总结
  • ReactNative-Linking的基本使用
  • ReactNative进度条ProgressViewIOS
  • ReactNative中react-native-webview与js交互
  • ReactNative-SectionList

近期评论

  • Herriat发表在《curl、wget命令下载文件》
  • smm provider panel发表在《curl、wget命令下载文件》
  • www.scoop.it发表在《curl、wget命令下载文件》
  • 金玉游龙发表在《iOS9 Universal Links》
  • 十一岁的加重发表在《iOS-判断字符串是否是空字符串的方法》

文章归档

功能

  • 登录
  • 条目feed
  • 评论feed
  • WordPress.org

友情链接

金玉游龙 为吾优
©2021 海之飞燕 | WordPress Theme by Superbthemes.com