Custom Text with cool heading & font family interaction for React Native.
npm install @freakycoder/react-native-custom-text
Custom Text with cool heading & font family interaction for React Native.


!Platform - Android and iOS
!expo-compatible



Add the dependency:
``ruby`
npm i @freakycoder/react-native-custom-text
Zero Dependency
`js
import Text from "@freakycoder/react-native-custom-text";
Hello Heading 1
`
`js
import Text from "@freakycoder/react-native-custom-text";
Heading 3 Bold Right Sided Custom Text
`
If you'are going to use Custom Text rather than Text component on your WHOLE project. I suggest that write a TextWrapper functional component and you can set and use it like original Text component
`jsx
import React from "react";
import Text from "@freakycoder/react-native-custom-text";
interface ITextWrapperProps {
color?: string;
fontFamily?: string;
children?: React.ReactNode;
}
const TextWrapper: React.FC
fontFamily = "Helvetica",
color = "#fff",
children,
...rest
}) => {
return (
{children}
);
};
export default TextWrapper;
`
Here is the example of how to use it, also you can check the example folder.
`js
// Important! Path will be change depends on your project structure tree
import Text from "../../shared/components/text/TextWrapper";
Example Text for TextWrapper
``
| Property | Type | Default | Description |
| ---------- | :--------: | :-----: | ---------------------------------------------------------------- |
| h1 | boolean | false | heading 1 prop |
| h2 | boolean | false | heading 2 prop |
| h3 | boolean | false | heading 3 prop |
| h4 | boolean | false | heading 4 prop |
| h5 | boolean | false | heading 5 prop |
| h6 | boolean | false | heading 7 prop |
| left | boolean | false | make the text left sided |
| center | boolean | false | make the text centered |
| right | boolean | false | make the text right sided |
| bold | boolean | false | make the text style bold (Compatible with Font Family) |
| color | color | "#fff" | change the text's color |
| fontFamily | FontFamily | default | set your own FontFamily directly to the Text component as a prop |
Any Text props are available like 'numberOfLines' or any other. There is no restriction.
- [x] ~~LICENSE~~
- [x] ~~Typescript~~
- [ ] Write an article about the lib on Medium
FreakyCoder, kurayogun@gmail.com
React Native Custom Text Library is available under the MIT license. See the LICENSE file for more info.