https://github.com/siuying/react-native-htmltext

Use HTML like markup to create stylized text in ReactNative.
https://github.com/siuying/react-native-htmltext

Last synced: about 2 months ago
JSON representation

Use HTML like markup to create stylized text in ReactNative.

• Host: GitHub
• URL: https://github.com/siuying/react-native-htmltext
• Owner: siuying
• Archived: true
• Created: 2015-03-30T14:13:15.000Z (almost 10 years ago)
• Default Branch: master
• Last Pushed: 2017-08-08T04:32:06.000Z (over 7 years ago)
• Last Synced: 2024-12-01T06:42:30.489Z (about 2 months ago)
• Language: JavaScript
• Size: 297 KB
• Stars: 138
• Watchers: 3
• Forks: 45
• Open Issues: 7
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

• awesome-react-native - react-native-htmltext ★132 - Use HTML like markup to create stylized text in react-native. (Components / Text & Rich Content)
• awesome-react-native - react-native-htmltext ★132 - Use HTML like markup to create stylized text in react-native. (Components / Text & Rich Content)
• awesome-react-native - react-native-htmltext ★132 - Use HTML like markup to create stylized text in react-native. (Components / Text & Rich Content)
• awesome-react-native - react-native-htmltext ★132 - Use HTML like markup to create stylized text in react-native. (Components / Text & Rich Content)
• awesome-react-native-ui - react-native-htmltext ★90 - Use HTML like markup to create stylized text in react-native. (Components / Text & Rich Content)

README

        
# react-native-htmltext

WIP: Experiment to use HTML like markup to create stylized text in react-native.

## Why?

React Native provide a Text element for stylized text. Instead of using ``NSAttributedString``, 

you creat nested Text:

```

  I am bold 

   and red 

```

While this approach is excellent for static interface text, what if we have dynamic text with format we 

do not know until we use it? ``HtmlText`` is a component to present a limited subset of HTML as

React Native views.

**Important**: This is not going to replace your ``WebView`` for HTML rendering, instead it use a

limited subset of HTML and try to present it using native ``Text`` elements in a reasonable way.

## Example 

### Input

```javascript

render: function() {

  var html = `
Hello world world foo bar hahh
`

  return (

    

      

    

  );

}

```



### Input 

```javascript

render: function() {

  var html = `


Hello world world foo 

bar hahh

`

  return (

    

      

    

  );

}

```