status-im/react-native
2
0
Fork 0
mirror of https://github.com/status-im/react-native.git synced 2025-02-26 16:10:58 +00:00
Code Issues Projects Releases Wiki Activity

Convert Image resizeMode contain to FIT_CENTER

Browse Source 
Summary:Convert from `CENTER_INSIDE` to `FIT_CENTER`.
The difference between those is that `CENTER_INSIDE` will not upscale if the image is too small.
See the Fresco docs: http://frescolib.org/javadoc/reference/com/facebook/drawee/drawable/ScalingUtils.ScaleType.html

Original issue: https://github.com/facebook/react-native/issues/4031
Closes https://github.com/facebook/react-native/pull/5738

Differential Revision: D2959473

Pulled By: mkonicek

fb-gh-sync-id: 8f76944e53b3d56fec0dc7303db339a71d0c389e
shipit-source-id: 8f76944e53b3d56fec0dc7303db339a71d0c389e
This commit is contained in:
Corentin Smith 2016-03-08 12:09:17 -08:00 committed by Facebook Github Bot 0
parent 10ad47a711
commit 2070efa019
4 changed files with 38 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

66
Examples/UIExplorer/ImageExample.js
View File

@ -381,37 +381,41 @@ exports.examples = [
'rendered within the frame.',
render: function() {
return (
<View style={styles.horizontal}>
<View>
<Text style={[styles.resizeModeText]}>
Contain
</Text>
<Image
style={styles.resizeMode}
resizeMode={Image.resizeMode.contain}
source={fullImage}
/>
</View>
<View style={styles.leftMargin}>
<Text style={[styles.resizeModeText]}>
Cover
</Text>
<Image
style={styles.resizeMode}
resizeMode={Image.resizeMode.cover}
source={fullImage}
/>
</View>
<View style={styles.leftMargin}>
<Text style={[styles.resizeModeText]}>
Stretch
</Text>
<Image
style={styles.resizeMode}
resizeMode={Image.resizeMode.stretch}
source={fullImage}
/>
</View>
<View>
{[smallImage, fullImage].map((image, index) => {
return <View style={styles.horizontal} key={index}>
<View>
<Text style={[styles.resizeModeText]}>
Contain
</Text>
<Image
style={styles.resizeMode}
resizeMode={Image.resizeMode.contain}
source={image}
/>
</View>
<View style={styles.leftMargin}>
<Text style={[styles.resizeModeText]}>
Cover
</Text>
<Image
style={styles.resizeMode}
resizeMode={Image.resizeMode.cover}
source={image}
/>
</View>
<View style={styles.leftMargin}>
<Text style={[styles.resizeModeText]}>
Stretch
</Text>
<Image
style={styles.resizeMode}
resizeMode={Image.resizeMode.stretch}
source={image}
/>
</View>
</View>;
})}
</View>
);
},

2
ReactAndroid/src/main/java/com/facebook/react/uimanager/UIManagerModuleConstants.java
View File

@ -87,7 +87,7 @@ import com.facebook.react.uimanager.events.TouchEventType;
"ContentMode",
MapBuilder.of(
"ScaleAspectFit",
ImageView.ScaleType.CENTER_INSIDE.ordinal(),
ImageView.ScaleType.FIT_CENTER.ordinal(),
"ScaleAspectFill",
ImageView.ScaleType.CENTER_CROP.ordinal())));

2
ReactAndroid/src/main/java/com/facebook/react/views/image/ImageResizeMode.java
View File

@ -25,7 +25,7 @@ public class ImageResizeMode {
*/
public static ScalingUtils.ScaleType toScaleType(@Nullable String resizeModeValue) {
if ("contain".equals(resizeModeValue)) {
return ScalingUtils.ScaleType.CENTER_INSIDE;
return ScalingUtils.ScaleType.FIT_CENTER;
}
if ("cover".equals(resizeModeValue)) {
return ScalingUtils.ScaleType.CENTER_CROP;

2
ReactAndroid/src/test/java/com/facebook/react/views/image/ImageResizeModeTest.java
View File

@ -34,7 +34,7 @@ public class ImageResizeModeTest {
.isEqualTo(ScalingUtils.ScaleType.CENTER_CROP);
assertThat(ImageResizeMode.toScaleType("contain"))
.isEqualTo(ScalingUtils.ScaleType.CENTER_INSIDE);
.isEqualTo(ScalingUtils.ScaleType.FIT_CENTER);
assertThat(ImageResizeMode.toScaleType("cover"))
.isEqualTo(ScalingUtils.ScaleType.CENTER_CROP);