Skip to content

FloMueh/react-native-rich-editor

 
 

Repository files navigation

react-native-pell-rich-editor with custom font face functionality

All Credits by wxik.

Changelog

1.6.8

fixed issue with onChange handler wxik#141

how to add custom font face from web source

const iOSCustomFontFace = `@font-face {
        font-family: 'SFPro';
        src: url('https://your-web-server.com/assets/fonts/SFPro/sf-pro-text-regular.ttf?raw=true'),
            url('https://your-web-server.com/assets/fonts/SFPro/sf-pro-text-regular.ttf?raw=true');
    }
    @font-face {
        font-family: 'SFProSemi';
        src: url('https://your-web-server.com/assets/fonts/SFPro/sf-pro-text-semibold.ttf?raw=true'),
            url('https://your-web-server.com/assets/fonts/SFPro/sf-pro-text-semibold.ttf?raw=true');
    }`;

<RichEditor
    editorStyle={{
        initialCSSText: iOSCustomFontFace,
        customFontFamily: 'SFPro',
    }}
/>;

how to add custom local font

The Richeditor does not support to add your local font files. But there is a workaround for that.

You can convert your font file to base 64 css style. Just go to https://transfonter.org/.

Important enable Base 64 Encode.

About

Lightweight React Native (JavaScript, H5) rich text editor

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 83.2%
  • HTML 14.8%
  • CSS 2.0%