fumiyasac / LikeCustomTransition

NativeBaseをはじめReactNativeの便利ライブラリを使ったUIサンプル

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

LikeCustomTransition

NativeBaseをはじめReactNativeの便利ライブラリを使ったUIサンプル

ReactNative等のクロスプラットフォームを用いてのアプリ開発の際に頭を悩ませる問題として「端末間のデザインの差異に対するアプローチ」があるかと思います。 今回はUIを作成する際に、iOS/Androidのネイティブアプリに近いUI部品を提供するUIコンポーネントライブラリである「NativeBase」を使用してできるだけアプリに近しい形でのUI実装を行なったサンプルになります。

また、その他サードパーティ製のUIライブラリとも組み合わせたUI表現に関してもモック程度のものではありますが実装を行なっています。

本サンプルの画面キャプチャ

キャプチャ画像その1:

sample_capture1.jpg

キャプチャ画像その2:

sample_capture2.jpg

画面に関するスケッチと遷移チャート

アイデアスケッチ:

idea_sketch.jpg

遷移チャート図:

flow_chart.jpg

使用ライブラリ

本サンプルでは下記のライブラリを使用しています。

詳細解説

このサンプル全体の詳細解説とポイントをまとめたものは下記に掲載しております。

About

NativeBaseをはじめReactNativeの便利ライブラリを使ったUIサンプル


Languages

Language:JavaScript 52.2%Language:Ruby 28.5%Language:HTML 7.9%Language:Objective-C 4.9%Language:Java 2.2%Language:CSS 2.1%Language:Python 1.9%Language:CoffeeScript 0.2%