Nativescript Template

https://leevikopakkala.github.io/nativecript-template/

nativeScript- angularとdidedideRawerとtabview

これは、最初のアプリまたは顧客プロジェクトをすぐに立ち上げるのに役立つ構造が改善された究極のテンプレートです。

概要

私たちは皆、機能を追加する前に、プロジェクトをセットアップし、機能ベースを作成するゆっくりとしたプロセスを知っています。このテンプレートを使用すると、DideDrawerとTabviewを使用して、完全に機能するアプリケーションを箱から出します。

初心者も専門家にも最適です。

ベストプラクティスを使用して、最初の実際のモバイルアプリケーションをすぐに開発します。

NativeScriptのSidedideRawerとTabviewコンポーネントで構成されるNativeScriptテンプレート：

このテンプレートで使用される個々のプラグインへの参照：

• https://market.nativecript.org/plugins/tns-template-drawer-navigation-ng
• https://market.nativescript.org/plugins/tns-template-blank-ng
• https://market.nativecript.org/plugins/tns-template-tab-navigation-ng

インストール：

素早い：

1. node.js https://nodejs.org/をインストールする

2. nativeScript cli npm install -g nativescriptインストールします

3. NativeScriptCLIがtnsしていることを確認してください

4. Android Studio（またはiOS同等）https://developer.android.com/studio/をインストールする

• 4.1 Android Studioを開く - > AVDマネージャー - >エミュレータを作成する

5. （オプションが便利）https://www.nativecript.org/nativecript-sidekickをインストールします

走る：

1. git clone https://github.com/LeeviKopakkala/Nativescript-Template

2. cd Nativescript-Template

3. tns device android --available-devicesまたはtns device ios --available-devices

4. tns run android / tns run android --device {device name}またはtns run ios / `tns run ios - device {device name}

Sidekickを使用する場合

4. オープンサイドキック

• 4.1プロジェクトを追加します

• 4.2エミュレータを選択します

• 4.3実行

建築

RadsideDidedRawerコンポーネントは、以下のアプリケーションの開始点として設定されています。

• /app-component.ts -Component.TS-サイドドロワーコンテンツをセットアップし、ページのページルーターアウトレットを定義します。

RadsideDrawerには次のコンポーネント構造があります。

• RadSideDrawerページに引き出しを表示するコンポーネント。
• tkDrawerContentディレクティブ - 引き出しコンテンツを保持するコンポーネントをマークします。
• tkMainContentディレクティブ - アプリのメインコンテンツを保持するコンポーネントをマークします。

これらのフォルダーには5つの空白コンポーネントがあります。

• /browse
• /featured
• /home
• /search
• /settings

スタイリング

このテンプレートは、スタイリングにSASSを使用するように設定されています。使用されるすべてのクラスは{n}コアテーマに基づいています。ドキュメントを参照して、カスタマイズ方法を理解してください。それをチェックして、どのコンポーネントで使用できるかを確認してください。

アプリフォルダーのルートにある4つのグローバルスタイルファイルがあります。

• _app-variables.scss各コンポーネントのスタイルにインポートされるグローバルSASS変数を保持します。
• _app-common.scssグローバル共通スタイルシート。これらのスタイルルールは、AndroidとiOSの両方に適用されます。
• app.android.scss -Global Androidスタイルシート。これらのスタイルのルールは、Androidのみに適用されます。
• app.ios.scssグローバルIOSスタイルシート。これらのスタイルのルールは、iOSのみに適用されます。