Skip to content

Commit a700044

Browse files
elicwhitefacebook-github-bot
elicwhite
authored and
facebook-github-bot
committed
Move Android's Image ViewConfig to JS
Reviewed By: sahrens Differential Revision: D9492683 fbshipit-source-id: 035aa00650ee4908452fe18384d953882bc2a8d8
1 parent daec505 commit a700044

File tree

3 files changed

+249
-4
lines changed

3 files changed

+249
-4
lines changed

‎Libraries/Image/Image.android.js

+3-4
Original file line numberDiff line numberDiff line change
@@ -18,16 +18,15 @@ const React = require('React');
1818
const ReactNative = require('ReactNative');
1919
const StyleSheet = require('StyleSheet');
2020
const StyleSheetPropType = require('StyleSheetPropType');
21+
const ImageViewNativeComponent = require('ImageViewNativeComponent');
2122
const TextAncestor = require('TextAncestor');
2223

2324
const flattenStyle = require('flattenStyle');
2425
const merge = require('merge');
25-
const requireNativeComponent = require('requireNativeComponent');
2626
const resolveAssetSource = require('resolveAssetSource');
2727

2828
const {ImageLoader} = NativeModules;
2929

30-
const RKImage = requireNativeComponent('RCTImageView');
3130
const TextInlineImageNativeComponent = require('TextInlineImageNativeComponent');
3231

3332
import type {ImageProps as ImagePropsType} from 'ImageProps';
@@ -182,7 +181,7 @@ declare class ImageComponentType extends ReactNative.NativeComponent<
182181
*/
183182
let Image = (
184183
props: ImagePropsType,
185-
forwardedRef: ?React.Ref<'RCTTextInlineImage' | 'RKImage'>,
184+
forwardedRef: ?React.Ref<'RCTTextInlineImage' | 'ImageViewNativeComponent'>,
186185
) => {
187186
let source = resolveAssetSource(props.source);
188187
const defaultSource = resolveAssetSource(props.defaultSource);
@@ -252,7 +251,7 @@ let Image = (
252251
hasTextAncestor ? (
253252
<TextInlineImageNativeComponent {...nativeProps} />
254253
) : (
255-
<RKImage {...nativeProps} />
254+
<ImageViewNativeComponent {...nativeProps} />
256255
)
257256
}
258257
</TextAncestor.Consumer>

‎Libraries/Image/ImageViewNativeComponent.js

+34
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
/**
2+
* Copyright (c) 2015-present, Facebook, Inc.
3+
*
4+
* This source code is licensed under the MIT license found in the
5+
* LICENSE file in the root directory of this source tree.
6+
*
7+
* @format
8+
* @flow
9+
*/
10+
11+
'use strict';
12+
13+
const AndroidConfig = require('ImageViewNativeComponentAndroidConfig');
14+
const Platform = require('Platform');
15+
16+
const verifyComponentAttributeEquivalence = require('verifyComponentAttributeEquivalence');
17+
const requireNativeComponent = require('requireNativeComponent');
18+
const ReactNativeViewConfigRegistry = require('ReactNativeViewConfigRegistry');
19+
20+
let ImageViewNativeComponent;
21+
if (Platform.OS === 'android') {
22+
if (__DEV__) {
23+
verifyComponentAttributeEquivalence('RCTImageView', AndroidConfig);
24+
}
25+
26+
ImageViewNativeComponent = ReactNativeViewConfigRegistry.register(
27+
'RCTImageView',
28+
() => AndroidConfig,
29+
);
30+
} else {
31+
ImageViewNativeComponent = requireNativeComponent('RCTImageView');
32+
}
33+
34+
module.exports = ImageViewNativeComponent;

‎Libraries/Image/ImageViewNativeComponentAndroidConfig.js

+212
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,212 @@
1+
/**
2+
* Copyright (c) 2015-present, Facebook, Inc.
3+
*
4+
* This source code is licensed under the MIT license found in the
5+
* LICENSE file in the root directory of this source tree.
6+
*
7+
* @format
8+
* @flow
9+
*/
10+
11+
const ReactNativeStyleAttributes = require('ReactNativeStyleAttributes');
12+
13+
const processColor = require('processColor');
14+
15+
const colorHandler = {diff: null, process: processColor};
16+
17+
const viewConfig = {
18+
directEventTypes: {
19+
topError: {registrationName: 'onError'},
20+
topLoad: {registrationName: 'onLoad'},
21+
topLoadEnd: {registrationName: 'onLoadEnd'},
22+
topLoadStart: {registrationName: 'onLoadStart'},
23+
},
24+
NativeProps: {
25+
accessibilityComponentType: 'String',
26+
accessibilityHint: 'String',
27+
accessibilityLabel: 'String',
28+
accessibilityLiveRegion: 'String',
29+
accessibilityRole: 'String',
30+
accessibilityStates: 'Array',
31+
alignContent: 'String',
32+
alignItems: 'String',
33+
alignSelf: 'String',
34+
aspectRatio: 'number',
35+
backgroundColor: 'Color',
36+
blurRadius: 'number',
37+
borderBottomLeftRadius: 'number',
38+
borderBottomRightRadius: 'number',
39+
borderBottomWidth: 'number',
40+
borderColor: 'Color',
41+
borderEndWidth: 'number',
42+
borderLeftWidth: 'number',
43+
borderRadius: 'number',
44+
borderRightWidth: 'number',
45+
borderStartWidth: 'number',
46+
borderTopLeftRadius: 'number',
47+
borderTopRightRadius: 'number',
48+
borderTopWidth: 'number',
49+
borderWidth: 'number',
50+
bottom: 'Dynamic',
51+
defaultSrc: 'String',
52+
display: 'String',
53+
elevation: 'number',
54+
end: 'Dynamic',
55+
fadeDuration: 'number',
56+
flex: 'number',
57+
flexBasis: 'Dynamic',
58+
flexDirection: 'String',
59+
flexGrow: 'number',
60+
flexShrink: 'number',
61+
flexWrap: 'String',
62+
headers: 'Map',
63+
height: 'Dynamic',
64+
importantForAccessibility: 'String',
65+
justifyContent: 'String',
66+
left: 'Dynamic',
67+
loadingIndicatorSrc: 'String',
68+
margin: 'Dynamic',
69+
marginBottom: 'Dynamic',
70+
marginEnd: 'Dynamic',
71+
marginHorizontal: 'Dynamic',
72+
marginLeft: 'Dynamic',
73+
marginRight: 'Dynamic',
74+
marginStart: 'Dynamic',
75+
marginTop: 'Dynamic',
76+
marginVertical: 'Dynamic',
77+
maxHeight: 'Dynamic',
78+
maxWidth: 'Dynamic',
79+
minHeight: 'Dynamic',
80+
minWidth: 'Dynamic',
81+
nativeID: 'String',
82+
onLayout: 'boolean',
83+
opacity: 'number',
84+
overflow: 'String',
85+
overlayColor: 'number',
86+
padding: 'Dynamic',
87+
paddingBottom: 'Dynamic',
88+
paddingEnd: 'Dynamic',
89+
paddingHorizontal: 'Dynamic',
90+
paddingLeft: 'Dynamic',
91+
paddingRight: 'Dynamic',
92+
paddingStart: 'Dynamic',
93+
paddingTop: 'Dynamic',
94+
paddingVertical: 'Dynamic',
95+
position: 'String',
96+
progressiveRenderingEnabled: 'boolean',
97+
renderToHardwareTextureAndroid: 'boolean',
98+
resizeMethod: 'String',
99+
resizeMode: 'String',
100+
right: 'Dynamic',
101+
rotation: 'number',
102+
scaleX: 'number',
103+
scaleY: 'number',
104+
shouldNotifyLoadEvents: 'boolean',
105+
src: 'Array',
106+
start: 'Dynamic',
107+
testID: 'String',
108+
tintColor: 'Color',
109+
top: 'Dynamic',
110+
transform: 'Array',
111+
translateX: 'number',
112+
translateY: 'number',
113+
width: 'Dynamic',
114+
zIndex: 'number',
115+
},
116+
uiViewClassName: 'RCTImageView',
117+
validAttributes: {
118+
accessibilityComponentType: true,
119+
accessibilityHint: true,
120+
accessibilityLabel: true,
121+
accessibilityLiveRegion: true,
122+
accessibilityRole: true,
123+
accessibilityStates: true,
124+
alignContent: true,
125+
alignItems: true,
126+
alignSelf: true,
127+
aspectRatio: true,
128+
backgroundColor: colorHandler,
129+
blurRadius: true,
130+
borderBottomLeftRadius: true,
131+
borderBottomRightRadius: true,
132+
borderBottomWidth: true,
133+
borderColor: colorHandler,
134+
borderEndWidth: true,
135+
borderLeftWidth: true,
136+
borderRadius: true,
137+
borderRightWidth: true,
138+
borderStartWidth: true,
139+
borderTopLeftRadius: true,
140+
borderTopRightRadius: true,
141+
borderTopWidth: true,
142+
borderWidth: true,
143+
bottom: true,
144+
defaultSrc: true,
145+
display: true,
146+
elevation: true,
147+
end: true,
148+
fadeDuration: true,
149+
flex: true,
150+
flexBasis: true,
151+
flexDirection: true,
152+
flexGrow: true,
153+
flexShrink: true,
154+
flexWrap: true,
155+
headers: true,
156+
height: true,
157+
importantForAccessibility: true,
158+
justifyContent: true,
159+
left: true,
160+
loadingIndicatorSrc: true,
161+
margin: true,
162+
marginBottom: true,
163+
marginEnd: true,
164+
marginHorizontal: true,
165+
marginLeft: true,
166+
marginRight: true,
167+
marginStart: true,
168+
marginTop: true,
169+
marginVertical: true,
170+
maxHeight: true,
171+
maxWidth: true,
172+
minHeight: true,
173+
minWidth: true,
174+
nativeID: true,
175+
onLayout: true,
176+
opacity: true,
177+
overflow: true,
178+
overlayColor: true,
179+
padding: true,
180+
paddingBottom: true,
181+
paddingEnd: true,
182+
paddingHorizontal: true,
183+
paddingLeft: true,
184+
paddingRight: true,
185+
paddingStart: true,
186+
paddingTop: true,
187+
paddingVertical: true,
188+
position: true,
189+
progressiveRenderingEnabled: true,
190+
renderToHardwareTextureAndroid: true,
191+
resizeMethod: true,
192+
resizeMode: true,
193+
right: true,
194+
rotation: true,
195+
scaleX: true,
196+
scaleY: true,
197+
shouldNotifyLoadEvents: true,
198+
src: true,
199+
start: true,
200+
testID: true,
201+
tintColor: colorHandler,
202+
top: true,
203+
transform: true,
204+
translateX: true,
205+
translateY: true,
206+
width: true,
207+
zIndex: true,
208+
style: ReactNativeStyleAttributes,
209+
},
210+
};
211+
212+
module.exports = viewConfig;

0 commit comments

Comments
 (0)