Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[Android] Some images are not shown #17784

Closed
ozgurrgul opened this issue Jan 30, 2018 · 4 comments
Closed

[Android] Some images are not shown #17784

ozgurrgul opened this issue Jan 30, 2018 · 4 comments
Labels
Ran Commands One of our bots successfully processed a command. Resolution: Locked This issue was locked by the bot.

Comments

@ozgurrgul
Copy link

ozgurrgul commented Jan 30, 2018 •
edited
Loading

Is this a bug report?

Yes.

Have you read the Contributing Guidelines?

Yes.

Environment

OS:  macOS Sierra 10.12.6
Node:  9.3
npm:  5.6.0
Watchman:  4.7.0
Xcode:  Xcode 9.2
Android Studio:  2

Packages: (wanted => installed)
react-native:0.52.0
react: 16.2.0

Target Platform: Android

Steps to Reproduce

When I create images with following code, they are not shown sometimes:

<Image source={LogoIcon} style={styles.logo} />

// style:
const styles = StyleSheet.create({
    logo: {
        width: size(42),
        height: size(42),
        resizeMode: 'contain',
        justifyContent: 'center',
        alignItems: 'center',
    }
});

It's not related to it, but here is size function

function size(px) {

    let calculatedScale;

    if(isIOs()) {

        switch (getDeviceWidth()) {
            case 320: // iPhone 4, 4S, 5, 5S
                calculatedScale = 0.77;
                break;
            case 375: // iPhone 6, 6S
                calculatedScale = 0.902;
                break;
            case 414: // iPhone 6 plus, 6S plus
                calculatedScale = 1;
                break;
            default:
                calculatedScale = 1;
        }

        return Math.ceil(px * calculatedScale);
    }

    if(isAndroid()) {

        if (getDeviceWidth() <= 414) { // Android smart phones
            calculatedScale = getDeviceWidth() / 414;
        } else { // Android tablets
            calculatedScale = 1;
        }

        return Math.ceil(px * calculatedScale);
    }

    return px;
}

Expected Behavior

Images must show every time.

Actual Behavior

Images are not showing, only a transparent section. This problem occurs when I use Images in FlatList's renderItem method but sometimes all application images are not showing.

I did encounter this problem when testing with a Huawei device. I successfully tested with:

  • Iphone Emulator
  • Genymotion 4.1.1 Emulator
  • Xiaomi Mi5s
@react-native-bot
Copy link
Collaborator

Thanks for posting this! It looks like you may not be using the latest version of React Native, v0.53.0, released on January 2018. Can you make sure this issue can still be reproduced in the latest version?

I am going to close this, but please feel free to open a new issue if you are able to confirm that this is still a problem in v0.53.0 or newer.

How to Contribute • What to Expect from Maintainers

@react-native-bot react-native-bot added Ran Commands One of our bots successfully processed a command. Stale There has been a lack of activity on this issue and it may be closed soon. labels Feb 24, 2018
@stale stale bot removed the Stale There has been a lack of activity on this issue and it may be closed soon. label Feb 24, 2018
@salmanwaheed
Copy link

salmanwaheed commented Feb 24, 2018 via email

@ghost
Copy link

ghost commented Mar 26, 2018 •
edited by ghost
Loading

Having the same issue with the same specs, but react native .54.2!

@ImagineZzf
Copy link

I hava the same issue ,but react native 0.55.0

@facebook facebook locked as resolved and limited conversation to collaborators Feb 24, 2019
@react-native-bot react-native-bot added the Resolution: Locked This issue was locked by the bot. label Feb 24, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
Ran Commands One of our bots successfully processed a command. Resolution: Locked This issue was locked by the bot.
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@salmanwaheed @ozgurrgul @ImagineZzf @react-native-bot