Add support to ellipsizeMode (#240)

Kureev · Oct 30, 2017 · 6102e5f · 6102e5f
1 parent 304d8eb
commit 6102e5f
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 1 deletion.
diff --git a/.gitignore b/.gitignore
@@ -2,3 +2,4 @@ node_modules
 **/xcuserdata
 .DS_Store
 **/.DS_Store
+**/*.swp
diff --git a/README.md b/README.md
@@ -83,6 +83,8 @@ That's it, you're ready to go!
   - **title** - (String) - Button's title
   - **style** - (Object, Array, Number) - Style object or array of style objects
   - **tintColor** - (String) - Title's text color
+  - **ellipsizeMode** - ('head', 'middle', 'tail', 'clip') - How to [display](https://facebook.github.io/react-native/docs/text.html#ellipsizemode) the text
+  - **numberOfLines** - (Number) - How to [truncate](https://facebook.github.io/react-native/docs/text.html#numberoflines) the text
 
 ### Usage with Webpack
 This module uses JSX syntax and requires a compiler such as [babel](https://babeljs.io/).

diff --git a/index.js b/index.js
@@ -21,6 +21,8 @@ const ButtonShape = {
 const TitleShape = {
   title: PropTypes.string.isRequired,
   tintColor: PropTypes.string,
+  ellipsizeMode: PropTypes.string,
+  numberOfLines: PropTypes.number
 };
 
 const StatusBarShape = {
@@ -57,7 +59,7 @@ function getTitleElement(data) {
 
   return (
     <View style={styles.navBarTitleContainer}>
-      <Text style={[styles.navBarTitleText, data.style, colorStyle]}>
+      <Text ellipsizeMode={data.ellipsizeMode} numberOfLines={data.numberOfLines} style={[styles.navBarTitleText, data.style, colorStyle]}>
         {data.title}
       </Text>
     </View>