react-native-banner-lite：RN 的一個開源的帶有分頁效果的半屏 Banner 組件

react-native-banner-lite

A banner component with adsorption. Compatible with iOS and Android.

Roadmap

see:ROADMAP.md

Preview

Getting Started

Installation

$ npm i react-native-banner-lite --save

Usage

• Install react-native first

$ npm i react-native -g

• Initialization of a react-native project

$ react-native init myproject

• Import react-native-banner-lite in the index.ios.js or index.android.js

import BannerLite from 'react-native-banner-lite';

• Add the BannerLite component in your code

<BannerLite
  items={[
    {
      title: "Hello",
      subtitle: "World",
      imageURL: "http://h.hiphotos.baidu.com/image/h%3D200/sign=3a225a4129a4462361caa262a8227246/30adcbef76094b36fbaf3bd6aacc7cd98d109dcf.jpg",
      onPress:(index)=>{console.log("tap"+index)}
    },
    {
      title: "How",
      subtitle: "R U",
      imageURL: "http://a4.att.hudong.com/35/64/01300000276819133197645554930.jpg",
      onPress:(index)=>{console.log("tap"+index)}
    },
    {
      title: ":dog::dog::dog:",
      subtitle: "呵呵呵呵呵",
      imageURL: "http://pic69.nipic.com/file/20150610/21067407_235515103000_2.jpg",
      onPress:(index)=>{console.log("tap"+index)}
    },
  ]}
/>

• Run the project

$ react-native run-ios

or

$ react-native run-android

See the example code in the Example folder.

Parameters

Name	Type	Description
items	array	banner items array

The items is an array of objects. The object contains 4 props.

Name	Type	Description
title	string	title of the banner item
subtitle	string	subtitle of the banner item
imageURL	string	background image of the banner item
onPress	func	callback of the banner item tap event

Contribution

• @talisk

Questions

Welcome to send Email to me, or open issue on the repository.

The project follow to the MIT license. Welcome contributions.