rn faded scrollview

rn-faded-scrollview

シンプルでカスタマイズ可能なReactネイティブコンポーネントにより、両端のScrollViewにフェードエフェクトを追加できます。

垂直スクロール	水平スクロール

スポンサー

インストール

このライブラリは、React-Native-Linear-radientに依存しています。線形勾配のセットアップ命令に従ってください。

そして、最後にプロジェクトディレクトリで実行されます。

npm install rn-faded-scrollview

または

yarn add rn-faded-scrollview

単純

 import RNFadedScrollView from 'rn-faded-scrollview' ;

// Within your render function
< RNFadedScrollView
        allowStartFade = { true }
        horizontal = { false }
        fadeSize = { 10 }
        style = { styles . backgroundStyle }
        bounces = { false }
      >
   //other views      
</ RNFadedScrollView >

// Later on in your styles..
var styles = StyleSheet . create ( {
  backgroundStyle : {
    flex : 1
  }
} ) ; 

ドキュメント

このライブラリは、Scrollviewのすべての小道具と追加の小道具を受け入れます。

小道具

名前	説明	デフォルト	タイプ
AllowStartFade	ScrollViewの開始時にフェードを追加します	間違い	ブール
AlowEndFade	ScrollViewの終わりにフェードを追加します	真実	ブール
フェードサイズ	フェードサイズIE（垂直スクロールビューの場合は水平と高さの場合）	20	番号
Fadecolors	フェード効果のための色	['rgba（229、229、229、0.18）'、 'rgba（206、201、0.6）、' rgba（206、201、201、0.9）]]]	配列
scrollthreshold	開始または終了に到達したときにフェードハイド/表示を制御するためのしきい値	10	番号
scrolleventthrottle	これにより、スクロール中にスクロールイベントが起動される頻度（MSの時間間隔として）を制御します	16	番号
AlowDivider	フェードエンドで仕切りを許可します。	間違い	ブール
ISRTL	RTLレイアウト用	間違い	ブール
incontentsizechange	incontentsizechangeコールバックが追加され、関数はcontentwidthとcontentheightを返します		関数

スタイリング

スタイリングはこれらの小道具を通過します。

containerStyle 、 startFadeStyle 、 endFadeStyle 、およびdividerStyle 。

イベント

名前	コールバックParam	説明
isclosetoend	ブール	スクロールが終了しているかどうかにかかわらず。
iscloseTostart	ブール	スクロールが開始するかどうかに近い場合。

ライセンス

MITライセンス

Copyright（c）2023 Malik Abdul Kawee

このソフトウェアと関連するドキュメントファイル（「ソフトウェア」）のコピーを入手して、制限なしにソフトウェアを扱うために、このソフトウェアを制限する権利を含め、ソフトウェアのコピーをコピー、変更、公開、配布、販売する、ソフトウェアのコピーを許可する人を許可する人を許可することを含めて、許可が無料で許可されます。

上記の著作権通知とこの許可通知は、ソフトウェアのすべてのコピーまたはかなりの部分に含まれるものとします。

このソフトウェアは、商品性、特定の目的への適合性、および非侵害の保証を含むがこれらに限定されない、明示的または黙示的なものを保証することなく、「現状のまま」提供されます。いかなる場合でも、著者または著作権所有者は、契約、不法行為、またはその他の訴訟、ソフトウェアまたはソフトウェアの使用またはその他の取引に関連する、またはその他の契約、またはその他の請求、またはその他の責任について責任を負いません。