Git Product home page Git Product logo

neteasenews's Introduction

NeteaseNews

这是一个ReactNative仿网易新闻APP的Demo.

启动页:

Image text

首页:

Image text

图文新闻详情页:

Image text

视频半屏效果:

Image text

视频全屏效果:

Image text

视频:

Image text

我的:

Image text

热更新:

Image text

运行项目:

1、NeteaseNews目录下执行yarn或npm i 命令。
2、执行react-native run-android或npm run android命令。

基本功能:

1、使用react-native-tab-navigator实现APP底部菜单切换
2、首页和视频页使用FlatList实现下拉刷新/上拉加载功能
3、首页和视频页使用react-native-scrollable-tab-view实现选项卡切换栏目新闻功能
4、使用react-native-htmlview实现图文新闻详情页功能
5、使用react-native-video、react-native-orientation实现视频新闻详情页功能
6、安卓下添加了对GIF图片的支持(IOS默认支持)
7、使用react-native-splash-screen添加了APP启动页,避免APP启动白屏
8、"我的"页面添加了RN动画
9、添加了storage(数据存储)、elements(UI组件)、swiper(滑动)、vector-icons(图标)等常用库
10、使用CodePush实现了热更新功能,可静默更新或提示更新

项目中的问题:

1、路由页面切换时的自定义动画效果存在BUG
2、当页面存在FlatList组件时,在componentWillMount/componentDidMount里start一个无限循环的动画导致FlatList列表数据不显示。
3、borderRadius在android低版本(目前测试的4.1.2)下的绘制不完美
4、视频在全屏状态下,低版本android对StatusBar hidden的兼容问题

其它:

  • 由于接口权限原因,打开新闻详情页面、视频页面时可能出现空白,无法正常请求到新闻数据显示。
  • 直播和新闻评论功能尚未开发,有相关接口的童鞋可以私我共同开发学习。

neteasenews's People

Watchers

James Cloos avatar tao.xie avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.