Skip to content

islate/react-native-eupage

Repository files navigation

react-native-eupage


A react-native component to show html/image/video fullscreen pages.

Screenshots


This is a screencapture of a demo. Screenshots

Add to your project

  1. run npm install react-native-eupage --save
  2. Open your project in XCode, right click on Libraries and click Add eupage project Files to "Your Project Name"
  3. copy Podfile to your project then run 'pod install' to install needed pods.

Usage

/*
*   A base page model is format with a "url" and "type".
*   Current supported types are "html", "image" and "video".
*/
var EUPageExample = React.createClass({
  getInitialState: function() 
  {
    return {
      data:[{"url":"http://www.bing.com", "type":"html"},
          {"url":"http://www.yahoo.com", "type":"html"},
          {"url":"http://s.cn.bing.net/az/hprichbg/rb/WaterliliesYuanmingyuan_ZH-CN10533925188_1920x1080.jpg", "type":"image"},
          {"url":"http://7b1gcw.com1.z0.glb.clouddn.com/20150529120500960.mp4", "type":"video"}]

    }
              
  }, 
  render: function() 
  {
    return (
      <EUPageView style={styles.eupage} dataArray={this.state.data}>
      </EUPageView>
    );
  } 
});

Example

  1. git clone https://github.com/mmslate/react-native-eupage
  2. cd react-native-eupage/Examples/EUPageExample
  3. pod install
  4. npm install
  5. npm start
  6. Open EUPageExample.xcworkspace, build and run the project in the simulator.

License


MIT Licensed

About

A react-native component to show html/image/video fullscreen pages.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published