From 0b40f0ab0c270a8fb478ad3dfbeb30d8c8fadf22 Mon Sep 17 00:00:00 2001 From: kblny Date: Fri, 22 Apr 2016 12:46:25 +0200 Subject: [PATCH] - property 'avatarUrl' renamed to 'avatar' for clarity purpose. You can use a remote file using its URL, like `avatar: 'http://urlToYourRemoteImage.extension'`, or a local file using `avatar: require('')` --- AppTest.js | 6 +++--- CustomChildComponent.js | 2 +- MessageBar.js | 6 +++--- README.md | 4 ++-- package.json | 2 +- 5 files changed, 10 insertions(+), 10 deletions(-) diff --git a/AppTest.js b/AppTest.js index fe784a9..a5d486e 100644 --- a/AppTest.js +++ b/AppTest.js @@ -78,7 +78,7 @@ class MessageBar extends Component { MessageBarManager.showAlert({ title: "John Doe", message: "Hello, how are you?", - avatarUrl: "https://image.freepik.com/free-icon/super-simple-avatar_318-1018.jpg", + avatar: "https://image.freepik.com/free-icon/super-simple-avatar_318-1018.jpg", alertType: 'info', }); } @@ -88,7 +88,7 @@ class MessageBar extends Component { MessageBarManager.showAlert({ title: "This is an alert with a callback function", message: "Tap on the alert to execute the callback you passed in parameter", - avatarUrl: "http://www.icon100.com/up/4250/128/83-circle-error.png", + avatar: "http://www.icon100.com/up/4250/128/83-circle-error.png", alertType: 'error', duration: 5000, onTapped: this.customCallback.bind(this), @@ -147,7 +147,7 @@ class MessageBar extends Component { // /* Cusomisation of the alert: Title, Message, Icon URL, Alert Type (error, success, warning, info), Duration for Alert keep shown */ // title={this.state.alertTitle} // Title of the alert // message={this.state.alertMessage} // Message of the alert - // avatarUrl={this.state.alertIconUrl} // Avatar/Icon URL of the alert + // avatar={this.state.alertIconUrl} // Avatar/Icon URL of the alert // type={this.state.alertType} // Alert Type: you can select one of 'success', 'error', 'warning', 'error', or 'custom' (use custom if you use a 5th stylesheet, all are customizable). Default is 'info' // duration={this.state.alertDuration} // Number of ms the alert is displayed. Default is 3000 ms (3 seconds) // diff --git a/CustomChildComponent.js b/CustomChildComponent.js index 7b7aa51..f3d0a94 100644 --- a/CustomChildComponent.js +++ b/CustomChildComponent.js @@ -32,7 +32,7 @@ class CustomChildComponent extends Component { MessageBarManager.showAlert({ title: 'Alert triggered from child component', message: "You can show an alert which is located on its parent's page. You can then declare only one MessageBar. This is useful to fix absolute position in child component", - avatarUrl: null, + avatar: null, alertType: 'success', }); } diff --git a/MessageBar.js b/MessageBar.js index d28fc5a..1f17a81 100644 --- a/MessageBar.js +++ b/MessageBar.js @@ -59,7 +59,7 @@ class MessageBar extends Component { /* Cusomisation of the alert: Title, Message, Icon URL, Alert alertType (error, success, warning, info), Duration for Alert keep shown */ title: props.title, message: props.message, - avatarUrl: props.avatarUrl, + avatar: props.avatar, alertType: props.alertType || 'info', duration: props.duration || 3000, @@ -376,9 +376,9 @@ class MessageBar extends Component { } renderImage() { - if (this.state.avatarUrl != null) { + if (this.state.avatar != null) { return ( - + ); } } diff --git a/README.md b/README.md index 0091fb5..2a2c31c 100644 --- a/README.md +++ b/README.md @@ -137,7 +137,7 @@ MessageBarManager.showAlert({ title: "John Doe", // Title of the alert message: "Hello, any suggestions?", // Message of the alert - avatarUrl: "", // Avatar/Icon URL of the alert + avatar: "') of your icon/avatar>", // Avatar/Icon URL of the alert or enter require('LOCALPATH') for local image /* Number of Lines for Title and Message */ titleNumberOfLines: 1, @@ -195,7 +195,7 @@ Prop | Type | Default | Description --------------------- | -------- | -------------------- | ----------- title | String | | Title of the alert message | String | | Message of the alert -avatarUrl | String | | Avatar/Icon URL of the alert +avatar | String | | Avatar/Icon source/URL of the alert alertType | String | info | Alert Type: you can select one of 'success', 'error', 'warning', 'error', or 'custom' (use custom if you use a 5th stylesheet, all are customizable). duration | Number | 3000 | Number of ms the alert is displayed shouldHideAfterDelay | Bool | true | Tell the MessageBar whether or not it should hide after a delay defined in the `duration` property. If `false`, the MessageBar remain shown diff --git a/package.json b/package.json index de7395a..f6f0484 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-native-message-bar", - "version": "1.4.2", + "version": "1.5.0", "description": "A message bar alert displayed at the top of the screen for react-native", "main": "index.js", "private": false,