react-native flexbox布局屬性

最近剛接觸react-native肃续,之前我從事iOS方面,接觸到之后發(fā)現(xiàn)這兩種語言編程方面還是有區(qū)別的,開始很不適應割去,而且國內目前關于react-native的詳細介紹都很少,即使是官網也是泛泛而談昼丑,還得自己不斷摸索呻逆,通過翻墻的話,資源會豐富些菩帝。開始對于react-native的布局方式一直都很不理解咖城,每個屬性代表的含義是什么茬腿,都有區(qū)別,導致組件在布局上遇到阻礙宜雀,后來就好些了切平。好了,不扯淡了辐董。至于marginTop,marginBottom等就不說了揭绑,談談幾個常用重要屬性的含義:

flex: 表示是否可以伸縮

flexDirection: 指定了主軸伸縮的方法 row 為水平column 為垂直

justifyContent: 定義伸縮組件沿主軸線的對齊方式flex-start、flex-end郎哭、center他匪、space-between、space-around

alignItems: 該屬性定義了伸縮項目在伸縮容器的交叉軸上的對齊方式flex-start夸研、flex-end邦蜜、center、baseline亥至、stretch

alignContent:這個屬性主要用來調整伸縮項目出現(xiàn)換行后在交叉軸上的對齊方式悼沈,類似伸縮項目在主軸上使用justifyContent

order:這個屬性用于定義項目的排列順序,數(shù)值越小姐扮,排列越靠前絮供,默認值為0

alignSelf: 設置單獨的伸縮項目在交叉上的對齊方式

padding: 距離邊距的距離

PS:只要將這些重要的屬性掌握了,react-native 布局這塊你就掌握了茶敏。

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末壤靶,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子惊搏,更是在濱河造成了極大的恐慌贮乳,老刑警劉巖,帶你破解...
    沈念sama閱讀 219,366評論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件恬惯,死亡現(xiàn)場離奇詭異向拆,居然都是意外死亡,警方通過查閱死者的電腦和手機酪耳,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,521評論 3 395
  • 文/潘曉璐 我一進店門浓恳,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人碗暗,你說我怎么就攤上這事颈将。” “怎么了讹堤?”我有些...
    開封第一講書人閱讀 165,689評論 0 356
  • 文/不壞的土叔 我叫張陵吆鹤,是天一觀的道長。 經常有香客問我洲守,道長疑务,這世上最難降的妖魔是什么沾凄? 我笑而不...
    開封第一講書人閱讀 58,925評論 1 295
  • 正文 為了忘掉前任,我火速辦了婚禮知允,結果婚禮上撒蟀,老公的妹妹穿的比我還像新娘。我一直安慰自己温鸽,他們只是感情好保屯,可當我...
    茶點故事閱讀 67,942評論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著涤垫,像睡著了一般姑尺。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上蝠猬,一...
    開封第一講書人閱讀 51,727評論 1 305
  • 那天切蟋,我揣著相機與錄音,去河邊找鬼榆芦。 笑死柄粹,一個胖子當著我的面吹牛,可吹牛的內容都是我干的匆绣。 我是一名探鬼主播驻右,決...
    沈念sama閱讀 40,447評論 3 420
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼崎淳!你這毒婦竟也來了堪夭?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 39,349評論 0 276
  • 序言:老撾萬榮一對情侶失蹤凯力,失蹤者是張志新(化名)和其女友劉穎茵瘾,沒想到半個月后礼华,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體咐鹤,經...
    沈念sama閱讀 45,820評論 1 317
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 37,990評論 3 337
  • 正文 我和宋清朗相戀三年圣絮,在試婚紗的時候發(fā)現(xiàn)自己被綠了祈惶。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 40,127評論 1 351
  • 序言:一個原本活蹦亂跳的男人離奇死亡扮匠,死狀恐怖捧请,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情棒搜,我是刑警寧澤疹蛉,帶...
    沈念sama閱讀 35,812評論 5 346
  • 正文 年R本政府宣布,位于F島的核電站力麸,受9級特大地震影響可款,放射性物質發(fā)生泄漏育韩。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 41,471評論 3 331
  • 文/蒙蒙 一闺鲸、第九天 我趴在偏房一處隱蔽的房頂上張望筋讨。 院中可真熱鬧,春花似錦摸恍、人聲如沸悉罕。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,017評論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽壁袄。三九已至,卻和暖如春媚媒,著一層夾襖步出監(jiān)牢的瞬間然想,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,142評論 1 272
  • 我被黑心中介騙來泰國打工欣范, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留变泄,地道東北人。 一個月前我還...
    沈念sama閱讀 48,388評論 3 373
  • 正文 我出身青樓恼琼,卻偏偏與公主長得像妨蛹,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子晴竞,可洞房花燭夜當晚...
    茶點故事閱讀 45,066評論 2 355

推薦閱讀更多精彩內容

  • 前言 學習本系列內容需要具備一定 HTML 開發(fā)基礎蛙卤,沒有基礎的朋友可以先轉至 HTML快速入門(一) 學習 本人...
    珍此良辰閱讀 4,524評論 2 19
  • flexbox是Flexible Box的縮寫, 彈性盒子布局, 主流的瀏覽器都支持 flexbox布局是伸縮容器...
    hophia閱讀 1,104評論 1 2
  • H5移動端知識點總結 閱讀目錄 移動開發(fā)基本知識點 calc基本用法 box-sizing的理解及使用 理解dis...
    Mx勇閱讀 4,510評論 0 26
  • 寫給每一個在爸媽身邊的你,請懂得珍惜噩死;寫給每一個不在爸媽身邊的你颤难,請學會珍惜。 ...
    夢槿馨閱讀 1,128評論 0 0
  • 目錄:那時花正開 想到那晚已维,江錦瑟眼眶有些濕潤了行嗤,那些情景歷歷在目。那段相識的時間雖短垛耳,卻是那么的快樂栅屏,自在,充實...
    土立土及閱讀 407評論 0 4