react-native-easy-app 是一款為React Native App快速開發(fā)提供基礎(chǔ)服務(wù)的純JS庫(支持 IOS & Android)瘟滨，特別是在從0到1的項目搭建初期弥锄，至少可以為開發(fā)者減少30%的工作量柠偶。
react-native-easy-app 主要做了這些工作：
1. 對AsyncStorage進(jìn)行封裝惫恼，開發(fā)者只需幾行代碼即可實現(xiàn)一個持久化數(shù)據(jù)管理器泣矛。
2. 對fetch進(jìn)行封裝真慢，使得開發(fā)者只需關(guān)注當(dāng)前App的前后臺交互邏輯和協(xié)議灾挨，定義好參數(shù)設(shè)置及解析邏輯即可少孝。
3. 重新封裝了RN的View继低、Text、Image稍走、FlatList 使用得這些控件在適當(dāng)?shù)臅r候支持事件或支持icon與文本袁翁，能有效減少布局中的嵌套邏輯。
4. 通過設(shè)置一個屏幕參考尺寸婿脸，重置XView粱胜、XText、XImage的尺寸狐树，實現(xiàn)自動多屏適配
可能有人覺得焙压，RN的適配一般不都是根據(jù)目標(biāo)屏幕的尺寸對當(dāng)前UI尺寸進(jìn)行一定比例的縮放么，直接定義一個獲取縮放比例的方法不就可以了么抑钟？
一千個人心中涯曲，有一千個哈姆雷特，也許我的封裝思路能給你帶來不一樣的啟發(fā)也未可知呢在塔？
UI多屏幕適配
RN平臺默認(rèn)的尺寸就是不帶單位的幻件，使用的是設(shè)備獨立像素，但由于手機的尺寸也越來越多蛔溃，比如說相同尺寸绰沥，像素密不同結(jié)果導(dǎo)致UI的物理尺寸也不同，所以通常來說城榛，我們們需要根據(jù)屏幕的尺寸對UI的尺寸進(jìn)行一定比例的縮放揪利。
但UI的尺寸屬性太多了，每次都調(diào)用相應(yīng)的尺寸比例方法去計算狠持，不僅看著代碼不雅觀而且代碼量也明顯增多疟位，那有沒有更好的辦法呢？
當(dāng)前開發(fā)庫的實現(xiàn)思路是喘垂，通過XView甜刻、XText绍撞、XImage的重定義，將傳入組件的style屬性做一次重置（將所有涉及尺寸的屬性值重置為乘以縮放比例后的值）得院。至于UI的尺寸屬性傻铣，在React Native源代碼中就可以找到（目前以白名單的形式定義）。這樣祥绞，在使用以上X系列UI組件的時候不需要做任何特別處理非洲，即可自動實現(xiàn)多屏幕適配。
當(dāng)然蜕径，要想X系列組件支持的前提還是：得設(shè)置一個參考屏幕尺寸（設(shè)計同學(xué)做UI的時候使用的參考屏幕尺寸）两踏，代碼如下：
XWidget.initReferenceScreen(375, 667); //iphone 6 屏幕
我們找個UI看看適配前后的區(qū)別（sample項目的列表頁面，適配前后）：
可以看到兜喻，適配后在5S屏幕上UI比較明顯（相應(yīng)的UI尺寸縮小了一些）梦染。
UI布局頁面適配如下（sample項目的UI組件頁面，適配前后）：
依然在5S上表現(xiàn)比較明顯朴皆，適配前UI組件高帕识、寬不太協(xié)調(diào)，特別是Image組件相對比較擁擠遂铡，但適配后就自然多了肮疗。在Xs Max上，UI組件由之前偏小扒接，后適配后族吻，相對應(yīng)的都放大了也顯得自然了(大屏、高分辨率屏幕上UI尺寸太小看著比較吃力)
可能有同學(xué)想珠增，X系列組件都做了屏幕適配但一些特別情況下超歌，可能不需要作適配怎么辦，比如說外層容器組件（有的時候會設(shè)置一個定值）蒂教，這時候有兩種辦法：
- 改用系統(tǒng)原生組件
- 設(shè)置X系列組件屬性 raw = {true}巍举，設(shè)置了此屬性，當(dāng)前UI尺寸就不會做任何縮放
**所以當(dāng)大家需要對app的用UI做多屏適配的情況下凝垛，盡可能多的使用X系列組件就行了（記得設(shè)置參考屏幕哦） **
想進(jìn)一步了解懊悯，請移步至 npm 或github查看 react-native-easy-app，有源碼及使用示例梦皮，待大家一探究竟炭分，歡迎朋友們 Star！
