Skip to content

Riglerr/react-native-hr

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

23 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

react-native-hr

========= react-native-hr brings htmls' <hr /> to react-native.
It also brings some extra functionality:

  • Overayling text onto the line.
  • Changing text style.
  • Changing line style.

Props

Name Type Description
lineStyle Object (Optional) The style object for line(View).
text string (Optional) The text to display on the line (centered)
textStyle Object (Optional) The color of the text

Usage

Solid Line

  <Hr />

Line with left margin

  <Hr marginLeft={50} />

Line with text

  <Hr text="react-native" />

Line with text and text style

  <Hr text="text style"
      textStyle={{
          color: "red", fontSize: 20,
          textDecorationLine: "underline",
          textDecorationStyle: "solid",
          textDecorationColor: "#000"
       }}
   />

Line with line style

  <Hr text="line style"
      lineStyle={{
          backgroundColor: "blue",
          height: 4
       }}
   />

Line style and text style

  <Hr lineColor='red' text='line style and text style'
      lineStyle={{
          backgroundColor: "blue",
          height: 2
       }}
       textStyle={{
          color: "green",
          fontSize: 20,
          textDecorationLine: "underline",
          textDecorationStyle: "solid",
          textDecorationColor: "#000"
       }}
    />

[Imgur

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published