kylefang/react-native
1
0
Fork 0
mirror of https://github.com/zhigang1992/react-native.git synced 2026-04-24 04:16:00 +08:00
Code Issues Packages Projects Releases Wiki Activity

Added support for width & height for text images

Browse Source 
Summary:
public

Previously, `<Image>` elements embedded inside `<Text>` ignored all style attributes and props apart from `source`. Now, the `width`, `height` and `resizeMode` styles are observed. I've also added a transparent placeholder to be displayed while the image is loading, to prevent the layout from changing after the image has loaded.

Reviewed By: javache

Differential Revision: D2838659

fb-gh-sync-id: c27f9685b6976705ac2b24075922b2bf247e06ba
This commit is contained in:
Nick Lockwood
2016-01-22 11:31:40 -08:00
committed by facebook-github-bot-4
parent f20453baee
commit 2cbc912756
9 changed files with 160 additions and 43 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
Examples/UIExplorer/TextExample.ios.js
View File

@@ -419,7 +419,7 @@ exports.examples = [
return (
<View>
<Text>
This text contains an inline image <Image source={require('./flux.png')}/>. Neat, huh?
This text contains an inline image <Image source={require('./flux.png')} style={{width: 30, height: 11, resizeMode: 'cover'}}/>. Neat, huh?
</Text>
</View>
);

48
Examples/UIExplorer/UIExplorerUnitTests/RCTImageUtilTests.m
View File

@@ -133,4 +133,52 @@ RCTAssertEqualSizes(a.size, b.size); \
RCTAssertEqualRects(expected, result);
}
- (void)testPlaceholderImage
{
CGSize size = {45, 22};
CGFloat expectedScale = 1.0;
UIImage *image = RCTGetPlaceholderImage(size, nil);
RCTAssertEqualSizes(size, image.size);
XCTAssertEqual(expectedScale, image.scale);
}
- (void)testPlaceholderNonintegralSize
{
CGSize size = {3.0/2, 7.0/3};
CGFloat expectedScale = 6;
CGSize pixelSize = {
round(size.width * expectedScale),
round(size.height * expectedScale)
};
UIImage *image = RCTGetPlaceholderImage(size, nil);
RCTAssertEqualSizes(size, image.size);
XCTAssertEqual(pixelSize.width, CGImageGetWidth(image.CGImage));
XCTAssertEqual(pixelSize.height, CGImageGetHeight(image.CGImage));
XCTAssertEqual(expectedScale, image.scale);
}
- (void)testPlaceholderSquareImage
{
CGSize size = {333, 333};
CGFloat expectedScale = 1.0/333;
CGSize pixelSize = {1, 1};
UIImage *image = RCTGetPlaceholderImage(size, nil);
RCTAssertEqualSizes(size, image.size);
XCTAssertEqual(pixelSize.width, CGImageGetWidth(image.CGImage));
XCTAssertEqual(pixelSize.height, CGImageGetHeight(image.CGImage));
XCTAssertEqual(expectedScale, image.scale);
}
- (void)testPlaceholderNonsquareImage
{
CGSize size = {640, 480};
CGFloat expectedScale = 1.0/160;
CGSize pixelSize = {4, 3};
UIImage *image = RCTGetPlaceholderImage(size, nil);
RCTAssertEqualSizes(size, image.size);
XCTAssertEqual(pixelSize.width, CGImageGetWidth(image.CGImage));
XCTAssertEqual(pixelSize.height, CGImageGetHeight(image.CGImage));
XCTAssertEqual(expectedScale, image.scale);
}
@end