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.

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

adjustsFontSizeToFit not working #16087

Closed
jsaguiar opened this issue Sep 25, 2017 · 2 comments
Closed

adjustsFontSizeToFit not working #16087

jsaguiar opened this issue Sep 25, 2017 · 2 comments
Labels
Stale There has been a lack of activity on this issue and it may be closed soon.

Comments

@jsaguiar
Copy link

Is this a bug report?

Yes

Have you read the Contributing Guidelines?

Yes

Environment

Environment:
OS: macOS Sierra 10.12.6
Node: 7.10.1
Yarn: 0.27.5
npm: 4.2.0',
Watchman: 4.7.0
Xcode: 9.0 (9A235)

Packages: (wanted => installed)
react-native: 0.46.3
react: 16.0.0-alpha.12

Steps to Reproduce

import React, { Component } from 'react';
import { AppRegistry, Text } from 'react-native';

export default class BoldAndBeautiful extends Component {
  render() {
    return (
      <Text 
        style={{width:200}}
        numberOfLines={1}
        adjustsFontSizeToFit={true}
        minimumFontScale={0.1}
>
        I want this text to be smaller
      </Text>
    );
  }
}
AppRegistry.registerComponent('AwesomeProject', () => BoldAndBeautiful);

Expected Behavior

Text should be getting smaller.

Actual Behavior

Text is not getting smaller

Reproducible Demo

Use code above

@zachasme
Copy link

You need to apply to the Text element a fontSize, for example, this will fit each text to its width:

export default class App extends Component {
  render() {
    return (
      <View style={{flex: 1}}>
        <Text 
          style={{flex:1,width:200,fontSize:200}}
          adjustsFontSizeToFit={true}
          numberOfLines={1}
          minimumFontScale={0.01}
  >
          I want this text to be smaller
        </Text>
        <Text 
          style={{flex:1,width:400,fontSize:200}}
          adjustsFontSizeToFit={true}
          numberOfLines={1}
          minimumFontScale={0.01}
  >
          I want this text to be smaller
        </Text>
      </View>
    );
  }
}

@stale
Copy link

stale bot commented Jan 14, 2018

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Maybe the issue has been fixed in a recent release, or perhaps it is not affecting a lot of people. If you think this issue should definitely remain open, please let us know why. Thank you for your contributions.

@stale stale bot added the Stale There has been a lack of activity on this issue and it may be closed soon. label Jan 14, 2018
@stale stale bot closed this as completed Jan 21, 2018
@facebook facebook locked and limited conversation to collaborators May 15, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
Stale There has been a lack of activity on this issue and it may be closed soon.
Projects
None yet
Development

No branches or pull requests

2 participants