2016-08-18 70 views

回答

13

這裏的cheatsheet文件:

支持的樣式包括每個組件的官方文檔。下面是View鏈接和Text組件:

注意的地方說:視圖樣式道具...上的樣式頂部文本,這意味着它也支持(大部分)View支持的樣式。

+1

這並不總是存在的,如G。 [TouchableHighlight](https://facebook.github.io/react-native/docs/touchablehighlight.html#style)爲空。 –

4

我已經從反應原生日誌中提取了有效樣式列表。

下面的集合幫助我在日常工作中很多。

[ 
    "alignContent", 
    "alignItems", 
    "alignSelf", 
    "aspectRatio", 
    "backfaceVisibility", 
    "backgroundColor", 
    "borderBottomColor", 
    "borderBottomLeftRadius", 
    "borderBottomRightRadius", 
    "borderBottomWidth", 
    "borderColor", 
    "borderLeftColor", 
    "borderLeftWidth", 
    "borderRadius", 
    "borderRightColor", 
    "borderRightWidth", 
    "borderStyle", 
    "borderTopColor", 
    "borderTopLeftRadius", 
    "borderTopRightRadius", 
    "borderTopWidth", 
    "borderWidth", 
    "bottom", 
    "color", 
    "decomposedMatrix", 
    "direction", 
    "display", 
    "elevation", 
    "flex", 
    "flexBasis", 
    "flexDirection", 
    "flexGrow", 
    "flexShrink", 
    "flexWrap", 
    "fontFamily", 
    "fontSize", 
    "fontStyle", 
    "fontVariant", 
    "fontWeight", 
    "height", 
    "includeFontPadding", 
    "justifyContent", 
    "left", 
    "letterSpacing", 
    "lineHeight", 
    "margin", 
    "marginBottom", 
    "marginHorizontal", 
    "marginLeft", 
    "marginRight", 
    "marginTop", 
    "marginVertical", 
    "maxHeight", 
    "maxWidth", 
    "minHeight", 
    "minWidth", 
    "opacity", 
    "overflow", 
    "overlayColor", 
    "padding", 
    "paddingBottom", 
    "paddingHorizontal", 
    "paddingLeft", 
    "paddingRight", 
    "paddingTop", 
    "paddingVertical", 
    "position", 
    "resizeMode", 
    "right", 
    "rotation", 
    "scaleX", 
    "scaleY", 
    "shadowColor", 
    "shadowOffset", 
    "shadowOpacity", 
    "shadowRadius", 
    "textAlign", 
    "textAlignVertical", 
    "textDecorationColor", 
    "textDecorationLine", 
    "textDecorationStyle", 
    "textShadowColor", 
    "textShadowOffset", 
    "textShadowRadius", 
    "tintColor", 
    "top", 
    "transform", 
    "transformMatrix", 
    "translateX", 
    "translateY", 
    "width", 
    "writingDirection", 
    "zIndex" 
] 

實現細節在這裏: https://github.com/vhpoet/react-native-styling-cheat-sheet/blob/master/README.md

+0

-1;目前還不清楚這份清單是從哪裏來的(所以我們甚至無法確信它是正確的),再加上沒有跡象表明如何爲未來版本進行更新,再加上這個答案有點誤導新手,因爲它沒有注意到不同的樣式規則適用於不同的組件。 –

+0

@MarkAmery正如我已經明確提到,我從日誌中獲得列表,每個人都可以找到這些有效的樣式屬性。 一套規則可以在這裏找到: https://github.com/vhpoet/react-native-styling-cheat-sheet/blob/master/README.md – Ahsanwarsi

+0

*什麼*日誌?也許我錯過了一些明顯的東西,但我不知道你的意思。 –

相關問題