From c9b4674af45f01c9035e8dc8eb6b5c20e68ede19 Mon Sep 17 00:00:00 2001 From: NickIliev Date: Mon, 1 Jul 2019 14:35:11 +0300 Subject: [PATCH 01/15] initial article --- .migration_backup/package.json | 58 +++++++++++++++++++ .migration_backup/tsconfig.tns.json | 7 +++ .../bottom-navigation/basics/article.md | 0 .../bottom-navigation/basics/basics-page.xml | 0 .../bottom-navigation-page.js | 24 ++++++++ .../bottom-navigation-page.xml | 10 ++++ .../bottom-navigation/end.md | 7 +++ .../bottom-navigation/metadata.md | 6 ++ .../bottom-navigation/overview.md | 35 +++++++++++ package.json | 14 +++-- 10 files changed, 155 insertions(+), 6 deletions(-) create mode 100644 .migration_backup/package.json create mode 100644 .migration_backup/tsconfig.tns.json create mode 100644 app/ns-ui-widgets-category/bottom-navigation/basics/article.md create mode 100644 app/ns-ui-widgets-category/bottom-navigation/basics/basics-page.xml create mode 100644 app/ns-ui-widgets-category/bottom-navigation/bottom-navigation-page.js create mode 100644 app/ns-ui-widgets-category/bottom-navigation/bottom-navigation-page.xml create mode 100644 app/ns-ui-widgets-category/bottom-navigation/end.md create mode 100644 app/ns-ui-widgets-category/bottom-navigation/metadata.md create mode 100644 app/ns-ui-widgets-category/bottom-navigation/overview.md diff --git a/.migration_backup/package.json b/.migration_backup/package.json new file mode 100644 index 0000000..a4c5b38 --- /dev/null +++ b/.migration_backup/package.json @@ -0,0 +1,58 @@ +{ + "name": "nativescript-sdk-examples-js", + "description": "NativeScript SDK Examples", + "author": "Telerik ", + "version": "0.1.0", + "homepage": "https://github.com/NativeScript/nativescript-sdk-examples-js", + "repository": { + "type": "git", + "url": "https://github.com/NativeScript/nativescript-sdk-examples-js" + }, + "bugs": { + "url": "https://github.com/NativeScript/nativescript-sdk-examples-js/issues" + }, + "keywords": [ + "NativeScript", + "JavaScript", + "SDK", + "example", + "documentation" + ], + "license": "Apache-2.0", + "nativescript": { + "id": "org.nativescript.nativescriptsdkexamplesjs", + "tns-android": { + "version": "5.4.0" + } + }, + "dependencies": { + "nativescript-theme-core": "~1.0.4", + "tns-core-modules": "^5.3.1" + }, + "devDependencies": { + "eslint": "~5.9.0", + "fs-extra": "^0.30.0", + "markdown-snippet-injector": "^0.2.4", + "nativescript-dev-typescript": "~0.9.0", + "nativescript-dev-webpack": "^0.21.0", + "tar.gz": "^1.0.7", + "tns-platform-declarations": "^5.3.1", + "tslint": "5.11.0", + "typescript": "~3.1.6" + }, + "scripts": { + "lint": "eslint \"app/**/*.js\"", + "tslint": "tslint -p tsconfig.json", + "tsc": "tsc", + "build": "node scripts/build.js", + "archive": "node scripts/archive.js", + "inject": "mdinject --root=app --docsroot=dist/cookbook --sourceext=\".js|.ts|.css|.xml\" --snippettitles=\"JavaScript|TypeScript|CSS|XML\"", + "pretsc": "npm install", + "pretslint": "npm run tsc", + "prelint": "npm run tslint", + "prebuild": "npm run lint", + "postbuild": "npm run inject && npm run archive", + "e2e": "mocha --opts ./e2e/config/mocha.opts", + "update-webpack": "./node_modules/.bin/update-ns-webpack --deps --configs" + } +} diff --git a/.migration_backup/tsconfig.tns.json b/.migration_backup/tsconfig.tns.json new file mode 100644 index 0000000..95f2ece --- /dev/null +++ b/.migration_backup/tsconfig.tns.json @@ -0,0 +1,7 @@ +{ + "extends": "./tsconfig", + "compilerOptions": { + "module": "es2015", + "moduleResolution": "node" + } +} diff --git a/app/ns-ui-widgets-category/bottom-navigation/basics/article.md b/app/ns-ui-widgets-category/bottom-navigation/basics/article.md new file mode 100644 index 0000000..e69de29 diff --git a/app/ns-ui-widgets-category/bottom-navigation/basics/basics-page.xml b/app/ns-ui-widgets-category/bottom-navigation/basics/basics-page.xml new file mode 100644 index 0000000..e69de29 diff --git a/app/ns-ui-widgets-category/bottom-navigation/bottom-navigation-page.js b/app/ns-ui-widgets-category/bottom-navigation/bottom-navigation-page.js new file mode 100644 index 0000000..f022872 --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/bottom-navigation-page.js @@ -0,0 +1,24 @@ +const ListViewLinksModel = require("../../links-view-model"); +const link = require("../../link"); +const navigationLinks = [ + new link("Basics", "ns-ui-widgets-category/bottom-navigation/basics/basics-page") + // new link("Styling", "ns-ui-widgets-category/tab-view/styling/styling-page"), + // new link("Title Icon Fonts", "ns-ui-widgets-category/tab-view/title-icon-fonts/title-icon-fonts-page"), + // new link("Code Behind", "ns-ui-widgets-category/tab-view/code-behind/code-behind-page"), + // new link("Navigation", "ns-ui-widgets-category/tab-view/navigation/navigation") +]; +const navigationLinksTsc = [ + // new link("Code Behind", "ns-ui-widgets-category/tab-view/code-behind/code-behind-ts-page"), + // new link("Navigation", "ns-ui-widgets-category/tab-view/navigation/navigation-ts-page") +]; +function onNavigatingTo(args) { + const page = args.object; + + page.bindingContext = new ListViewLinksModel({ + links: navigationLinks, + actionBarTitle: args.context.title, + showTypeScriptExamples:false, + tsclinks: navigationLinksTsc + }); +} +exports.onNavigatingTo = onNavigatingTo; diff --git a/app/ns-ui-widgets-category/bottom-navigation/bottom-navigation-page.xml b/app/ns-ui-widgets-category/bottom-navigation/bottom-navigation-page.xml new file mode 100644 index 0000000..a69b8be --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/bottom-navigation-page.xml @@ -0,0 +1,10 @@ + + + + + + + diff --git a/app/ns-ui-widgets-category/bottom-navigation/end.md b/app/ns-ui-widgets-category/bottom-navigation/end.md new file mode 100644 index 0000000..8a3983a --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/end.md @@ -0,0 +1,7 @@ +**API Reference for the** [BottomNavigation Class](http://docs.nativescript.org/api-reference/classes/_ui_bottom_navigation_.button.html) + +**Native Component** + +| Android | iOS | +|:----------------------|:---------| +| [FrameLayout](https://developer.android.com/reference/android/widget/FrameLayout) | [UITabViewController](https://developer.apple.com/documentation/uikit/uitabbarcontroller?language=objc) | diff --git a/app/ns-ui-widgets-category/bottom-navigation/metadata.md b/app/ns-ui-widgets-category/bottom-navigation/metadata.md new file mode 100644 index 0000000..353920d --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/metadata.md @@ -0,0 +1,6 @@ +--- +title: BottomNavigation +description: The NativeScript's BottomNavigation component provides a simple way to navigate between different views while providing common UI for both iOS and Android platforms. The recommended scenario suitable for BottomNavigation is a high level navigaiton with 3 to 5 tabs each with separate function. +position: 190 +slug: bottom-navigation +--- diff --git a/app/ns-ui-widgets-category/bottom-navigation/overview.md b/app/ns-ui-widgets-category/bottom-navigation/overview.md new file mode 100644 index 0000000..11d0625 --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/overview.md @@ -0,0 +1,35 @@ + +The `BottomNavigation` component provides a simple way to navigate between different views while providing common UI for both iOS and Android platforms. The recommended scenario suitable for `BottomNavigation` is a high level navigaiton with 3 to 5 tabs each with separate function. For additional information and details about bottom navigation refer to [the Material Design guidelines](https://material.io/design/components/bottom-navigation.html#usage). + +Component Primary Objectives: +- Used for High Level navigation. +- Greater UX a structure with 3 to 5 different options. + +Limitations +- No support for navigation transitions. +- No navigation gestures (e.g., swipe to navigate). +- No support for content preloading. + + + + \ No newline at end of file diff --git a/package.json b/package.json index a4c5b38..593e7f6 100644 --- a/package.json +++ b/package.json @@ -21,24 +21,26 @@ "license": "Apache-2.0", "nativescript": { "id": "org.nativescript.nativescriptsdkexamplesjs", + "tns-ios": { + "version": "6.0.0-2019-06-27-154632-01" + }, "tns-android": { - "version": "5.4.0" + "version": "6.0.0-2019-06-28-082007-01" } }, "dependencies": { "nativescript-theme-core": "~1.0.4", - "tns-core-modules": "^5.3.1" + "tns-core-modules": "next" }, "devDependencies": { "eslint": "~5.9.0", "fs-extra": "^0.30.0", "markdown-snippet-injector": "^0.2.4", - "nativescript-dev-typescript": "~0.9.0", - "nativescript-dev-webpack": "^0.21.0", + "nativescript-dev-webpack": "next", "tar.gz": "^1.0.7", - "tns-platform-declarations": "^5.3.1", + "tns-platform-declarations": "next", "tslint": "5.11.0", - "typescript": "~3.1.6" + "typescript": "3.4.1" }, "scripts": { "lint": "eslint \"app/**/*.js\"", From 97f3a2ed57a6a6ba13d3ff0033ee90f8ca0f821e Mon Sep 17 00:00:00 2001 From: NickIliev Date: Tue, 2 Jul 2019 13:59:51 +0300 Subject: [PATCH 02/15] docs: article about BottomNavigation init --- .../baseline_account_balance_black_18pt.png | Bin 0 -> 312 bytes .../baseline_account_balance_black_24pt.png | Bin 0 -> 296 bytes .../baseline_account_balance_black_36pt.png | Bin 0 -> 378 bytes .../baseline_account_balance_black_48pt.png | Bin 0 -> 455 bytes .../baseline_home_black_18pt.png | Bin 0 -> 259 bytes .../baseline_home_black_24pt.png | Bin 0 -> 291 bytes .../baseline_home_black_36pt.png | Bin 0 -> 374 bytes .../baseline_home_black_48pt.png | Bin 0 -> 465 bytes .../baseline_search_black_18pt.png | Bin 0 -> 562 bytes .../baseline_search_black_24pt.png | Bin 0 -> 636 bytes .../baseline_search_black_36pt.png | Bin 0 -> 988 bytes .../baseline_search_black_48pt.png | Bin 0 -> 1206 bytes ...baseline_account_balance_black_18pt@1x.png | Bin 0 -> 182 bytes ...baseline_account_balance_black_18pt@2x.png | Bin 0 -> 216 bytes ...baseline_account_balance_black_18pt@3x.png | Bin 0 -> 312 bytes .../iOS/baseline_home_black_18pt@1x.png | Bin 0 -> 156 bytes .../iOS/baseline_home_black_18pt@2x.png | Bin 0 -> 208 bytes .../iOS/baseline_home_black_18pt@3x.png | Bin 0 -> 259 bytes .../iOS/baseline_search_black_18pt@1x.png | Bin 0 -> 220 bytes .../iOS/baseline_search_black_18pt@2x.png | Bin 0 -> 386 bytes .../iOS/baseline_search_black_18pt@3x.png | Bin 0 -> 562 bytes app/main-page.js | 3 +- .../bottom-navigation/basics/article.md | 5 +++ .../bottom-navigation/basics/basics-page.js | 4 +++ .../bottom-navigation/basics/basics-page.xml | 31 ++++++++++++++++++ .../basics/basics-ts-page.ts | 3 ++ .../basics/basics-ts-page.xml | 29 ++++++++++++++++ .../bottom-navigation-page.js | 4 +-- .../bottom-navigation/metadata.md | 2 +- .../bottom-navigation/overview.md | 9 +++-- 30 files changed, 83 insertions(+), 7 deletions(-) create mode 100755 app/App_Resources/Android/drawable-xxhdpi/baseline_account_balance_black_18pt.png create mode 100755 app/App_Resources/Android/drawable-xxhdpi/baseline_account_balance_black_24pt.png create mode 100755 app/App_Resources/Android/drawable-xxhdpi/baseline_account_balance_black_36pt.png create mode 100755 app/App_Resources/Android/drawable-xxhdpi/baseline_account_balance_black_48pt.png create mode 100755 app/App_Resources/Android/drawable-xxhdpi/baseline_home_black_18pt.png create mode 100755 app/App_Resources/Android/drawable-xxhdpi/baseline_home_black_24pt.png create mode 100755 app/App_Resources/Android/drawable-xxhdpi/baseline_home_black_36pt.png create mode 100755 app/App_Resources/Android/drawable-xxhdpi/baseline_home_black_48pt.png create mode 100755 app/App_Resources/Android/drawable-xxhdpi/baseline_search_black_18pt.png create mode 100755 app/App_Resources/Android/drawable-xxhdpi/baseline_search_black_24pt.png create mode 100755 app/App_Resources/Android/drawable-xxhdpi/baseline_search_black_36pt.png create mode 100755 app/App_Resources/Android/drawable-xxhdpi/baseline_search_black_48pt.png create mode 100755 app/App_Resources/iOS/baseline_account_balance_black_18pt@1x.png create mode 100755 app/App_Resources/iOS/baseline_account_balance_black_18pt@2x.png create mode 100755 app/App_Resources/iOS/baseline_account_balance_black_18pt@3x.png create mode 100755 app/App_Resources/iOS/baseline_home_black_18pt@1x.png create mode 100755 app/App_Resources/iOS/baseline_home_black_18pt@2x.png create mode 100755 app/App_Resources/iOS/baseline_home_black_18pt@3x.png create mode 100755 app/App_Resources/iOS/baseline_search_black_18pt@1x.png create mode 100755 app/App_Resources/iOS/baseline_search_black_18pt@2x.png create mode 100755 app/App_Resources/iOS/baseline_search_black_18pt@3x.png create mode 100644 app/ns-ui-widgets-category/bottom-navigation/basics/basics-page.js create mode 100644 app/ns-ui-widgets-category/bottom-navigation/basics/basics-ts-page.ts create mode 100644 app/ns-ui-widgets-category/bottom-navigation/basics/basics-ts-page.xml diff --git a/app/App_Resources/Android/drawable-xxhdpi/baseline_account_balance_black_18pt.png b/app/App_Resources/Android/drawable-xxhdpi/baseline_account_balance_black_18pt.png new file mode 100755 index 0000000000000000000000000000000000000000..80fc185051d466676c0da9140fef542aa3892cda GIT binary patch literal 312 zcmeAS@N?(olHy`uVBq!ia0vp^W+2SL0wmRZ7KH(+|DG<6Ar*{C4b6cHM=l(naQ1*# zb$5m2E5^6i7*m`AMcO~+&z^bkh(u3i4$lT&i8gM74hILP1_g%$%uNi94GusS2Zw;5 z0H=tGN>>rnj*8gzRns5+v12$cucznDlIYVHy{B@)5t)rrlMXgpbNNi{`1NPv0_jaX z0`9VP9!Kn%Rory#EKlp(s+3tv?J1n3f9u4>+!Y@W1=?jOsc&C&NOYGaz-Bn zxf+DszroZKda8Em9&Q6Uub1)vFC8yABT%K`5WCe@sf6e9&NXT5z@T98boFyt=akR{ E0896KO#lD@ literal 0 HcmV?d00001 diff --git a/app/App_Resources/Android/drawable-xxhdpi/baseline_account_balance_black_24pt.png b/app/App_Resources/Android/drawable-xxhdpi/baseline_account_balance_black_24pt.png new file mode 100755 index 0000000000000000000000000000000000000000..6fe82607fe34d45e8b4d76fd6b564b4e9059c73a GIT binary patch literal 296 zcmeAS@N?(olHy`uVBq!ia0vp^9w5xY0wn)GsXhaw-g~+@hEy=VImpO%h(UzmLOM@r z2aAgX#|_0-OuHRq7xZoBzQXv5k6F-wv9#l-pn&ILvn}8M%s+U;FExKjeULQ&$Exj9 zUj-_a3+HR^bkPr6_vmr=*1lA)kENQICoY}*FyH!rngqg zNUBEbQrRBc?^1KNt$Xg){P(NvcBwb(U+=t_Q0#VoaSey!7js316)L-y-uvOiq1Yk- mCjx944tVo}L{`W!R4`HiM{)@%er{~PdROz~zlOMk8B+s3K|J%#`-pfZuMrvxf z_e-r@eVFgzxj9@bHI>{htoP9rtjWE0;&S>i5sqzY-cO#ow>{xpXT>e_?rSG=@Qw9$g$Z20la=&Aa!L7I?5q9f%y8QN9VGYr zNT;UE50|E&7uU&3GcYt62*jMdxM`=KL+^{)tghFb5irE*NJxk^ yzzQ}@iT)ctN#$?gv7E}etjsVlS;f=5oI&=NQSsDcUv+?C%HZkh=d#Wzp$P!ab(o0& literal 0 HcmV?d00001 diff --git a/app/App_Resources/Android/drawable-xxhdpi/baseline_account_balance_black_48pt.png b/app/App_Resources/Android/drawable-xxhdpi/baseline_account_balance_black_48pt.png new file mode 100755 index 0000000000000000000000000000000000000000..2b9f84132feae504f827ef7ce46189fe760dcc27 GIT binary patch literal 455 zcmeAS@N?(olHy`uVBq!ia0vp^6F``Q1xWh(YZ)^zF!p)6IEGX(zB#DNaVS8f;bQ;6 zCN{%N;n@k%8`h@3-N1M2V&9F6e6JVC@_yT-a^uJ{&u)(9LQ@H`wm15F%g;M%E}ar2 zS}C*N)@X%d^po=A4I)?7RUCtaovJhzoSr3dQeyMM=Bu}KDwXT^MO-}O<@?NLqKv#w zMuO;c&GID&q>W?NJP;^w_1YuwAYq4L`jSJ!!aYxg6-|3S7@q5}4SIaI{kD}F6GKCy z!jt$?>thG}Wz=qLU#qPCE%(`py|uTkit_It>yx>;{iw40x7?2>Ce}vV6lDU1Vs35U zsLcQ6?XMGmw;xpge*anDoqB0YqYrQYoVc|8x3cs7cl|uIyX}p>zWsON0#G3NzTLGN z>v9iZxEwY(v;S56p$tc>Isry@77hUghXy8Q2))R2l8Wb~y!G|$AW;TJCWtU`43Jip kub&rjW7P|iUE;v+6?JOapM=b4phFluUHx3vIVCg!0E<1YQ2+n{ literal 0 HcmV?d00001 diff --git a/app/App_Resources/Android/drawable-xxhdpi/baseline_home_black_18pt.png b/app/App_Resources/Android/drawable-xxhdpi/baseline_home_black_18pt.png new file mode 100755 index 0000000000000000000000000000000000000000..52ac80e7bedab3c42cc826032a1ba1d1e1a701fa GIT binary patch literal 259 zcmV+e0sQ`nP)5j{32THI#u(y;xyL@v)3$EMpnVSdt`vz#R+}f$dZ>*Zcqg002ov JPDHLkV1oI{ZiD~; literal 0 HcmV?d00001 diff --git a/app/App_Resources/Android/drawable-xxhdpi/baseline_home_black_24pt.png b/app/App_Resources/Android/drawable-xxhdpi/baseline_home_black_24pt.png new file mode 100755 index 0000000000000000000000000000000000000000..bcbeb199c0fe9ebb10f1617c49acc051f7302607 GIT binary patch literal 291 zcmeAS@N?(olHy`uVBq!ia0vp^9w5xY0wn)GsXhawUU|AWhEy=Vow88yP=Eldc;msv znT>oanv^bivy@(76}`YDB`;iD)0iM}Xii0p(c#;<30ISP44;|Lnbn4h3!22o7)XgFg2J7Y!Kd^}C zW)Z&td+)z2+-Z_kCm$=YTV^!ba}`Z!mU#kXpK# My85}Sb4q9e05FAaVgLXD literal 0 HcmV?d00001 diff --git a/app/App_Resources/Android/drawable-xxhdpi/baseline_home_black_36pt.png b/app/App_Resources/Android/drawable-xxhdpi/baseline_home_black_36pt.png new file mode 100755 index 0000000000000000000000000000000000000000..aac69f8785ce472c61f199f76e9f92f82c7376c4 GIT binary patch literal 374 zcmeAS@N?(olHy`uVBq!ia0vp^IUvlz0wh)Q=esd5Fxq;$IEGX(zB#y1(jh>k?csWj zT{;m5*p?Zz#QG$0Nk=$d%isBQhvTOPr8&R4#HU3tx?8w3{*6N)B4}H#d)$Ry-f8{D8CxfDh z!^YLw+{`y_u2x|FVI!8bwdcLGN442w^T(Oa$M~0BZtFS7mD1ydQd`ei zhg%aiO8ZG0=`G=v6bA}0165|R8o4c>Y`7%$bi`%8lr@>`M%T75OJ?6{>`{H|aBM=E zLh=SB$>z%#vYJp?k7}*Q4!3^qZvOUtyL~$-P&gX??f=$vRK+I2?Txw`2!ur(JAxGe bRW~psO=Wv)bP0l+XkKibbGj literal 0 HcmV?d00001 diff --git a/app/App_Resources/Android/drawable-xxhdpi/baseline_home_black_48pt.png b/app/App_Resources/Android/drawable-xxhdpi/baseline_home_black_48pt.png new file mode 100755 index 0000000000000000000000000000000000000000..2eb968bf2fe760d987559acfed7c861afa310ff0 GIT binary patch literal 465 zcmeAS@N?(olHy`uVBq!ia0vp^6F``Q1xWh(YZ)^zFwXFFaSW+od~znc?=BUe_IV)zIT${|qmL$>8xKLW}*&L}u*{=$O zI-7Stul*sn#q#~*=0yg3DpUd`;%p{q@aW5VinNLMi*fz#cIR&WdvtN@p?{A8ofH3O zX}sa@bQ0`mY*mso=CYQv6e+VQ(s)zxB;dx!6AL#yhNRn!*d` k6K0rjdqBb%NCq*SJpTUuOf7LKU{o=9y85}Sb4q9e0DMEPrT_o{ literal 0 HcmV?d00001 diff --git a/app/App_Resources/Android/drawable-xxhdpi/baseline_search_black_18pt.png b/app/App_Resources/Android/drawable-xxhdpi/baseline_search_black_18pt.png new file mode 100755 index 0000000000000000000000000000000000000000..e225a47593754b79bedc30b24db25fc50fe89d30 GIT binary patch literal 562 zcmV-20?qx2P)Dm{q!s7{JqL7@t zlpsES6_x5N<`YWiE^FvQ4ty>e?YM{fXAV&bA1cC4REXJ5Jba=BpHZecLvmbeg!(O) z=tDCq(Td?5!azx`kOWr>AtwZ1SwtCrmzk9)$qC}PIW6SB;xUEzw`P2mso6NzRTgE z{`6xcPf@?+4*lpu0(W&UQKs3?W4RH#s>^Be-e@q8DD*@5rY<@i{_{rsj`3s#K+4?L zK@>{Sm+f5O8DF^1F{V?C*q~+Lwv9U1(r`VHbt$+M$hxF~t~(dVxCYeR-<&cn!?0Y z1x_QU&QO84smD#^+)e5c7j=1vi1wHz^rjJ&$WJ92(vL+vK}35%eY`8djU<0&5cxpewqQ<(S2>VpTfkhKyR}I5B4D|0e1<=+J^^skkt%#&5(5$58fiHD(n$F9M^<6n6++gxto8^!!h^fW zYL2_+$hv?B2awf2#&_9HJeZBF^|)J)tm$~rFQ!lGBD_adS3D@eXJie<%}`{0p%7lI zMb=x&l73})hpg>*(*D1H4{bwObitd0$o-|sbcDrGJZg&~O(1RKP^6A{wKB=6qX;Q0 zlH}AeBO}gb15-Gc4NP*RyhK5~tIvaEPp*9WNimHQ;WcZ{FdL=y}*<37n|wPeKKTiEYB=L*MJ zKu?MiRg1fhll;qulftAhDNG8JDrbR7S?MvdNm*r%P0A{BY?95%B5MCE8w-LU2z~%Z Wwf?8PY)cOS0000!K)%q9}@@ zXbR?IHMV4bPT?qaVO^GFW-6FyP060z%YRtOns|$|S(%B|ZWu4guKZ3#ZZx>P-9QcW&Zb2%+oihg88a%WaP#!}bFq2$W)^uPjjAC=_9_B3Dt zdyA>bfo-vNYUTqj=d4jZ%Kun9eL@`>TaJ1xu`juT&6%7DEyj^N%>XR1rzs;tGx8sn z(7P;4+v+%-L0Cd(lbLef#7g!LyU{VT@-SAiR@NpXXC%BpH#0e%u{M8TXg!&p3@kzu zhPFGMHzi+VXb<78j1MrhgXx;-6TZXT9A`UXXa~@B)A1!HeMuRP%1XX|?;@S~XuzcH zakMce{lyfdbpj^6hoc8DX&ut5;5|&54=1$@k>k%2#&TJHsoolsRwk5}<=LO%-PlU5<5SLFHU;b2iYJA_I?I!!J-ii54>?1zN4c{ZOu z_LZ{_64nB8;SU@fC1Ogs>)&3-vfSRL09@L(n0b@~S>ZpFib;2n-n=yE zFS;qm&CE1l(x#+S&ij~jKCW)Wr2m+fG)~5(M&`iPoYZ5|S1G0)Oe-c`gS*o(w4a!V zt~eV*>&G;>tK>@ztrx4)IW;_lm259Eu_!|@v}R7Cl8#y=@jpbKAv61834O~3v~LQo zraAHdbS5K1w_}Mt%l1q~X=NGZ)8Ta-*y@g_!cEquf!Y|3O~1}(}FJVtMvX+1pP3lT@;I%G?RdWvqdsFlY8hXBZl;Mvxs;#V{cLwHs{(4HoJ|w+axhnL zAFuHVf6;_t)bkOyaVRTMi}Ii5CQggf;xq?w+G<6eHYiTZUYr)E#cAH+v>wzIW}3dm ziZ-pj0JCIT0lsgPX+@bO(+V?7ruAhV3TY~eBZ{IZilQirqG%{I(YZcf&%V+C0000< KMNUMnLSTaZcGKtp literal 0 HcmV?d00001 diff --git a/app/App_Resources/Android/drawable-xxhdpi/baseline_search_black_48pt.png b/app/App_Resources/Android/drawable-xxhdpi/baseline_search_black_48pt.png new file mode 100755 index 0000000000000000000000000000000000000000..9a5c0bf5d766aff1dfe926f51cbdb5aeb46b3675 GIT binary patch literal 1206 zcmV;n1WEgeP)BMpj%v)V1nwNhA`TnF`2_5479fsWz}*Du6~t4o5uk4ok9|X6 z-bNDFjZb)rn>dSu*@CS(h;z7+C;5zSNaEfmAWt9(nnf)hWOw51&Lh-f4w9g!3B;8N z4nb$~G24;U4t&h41c$X(5`ev#jKsE(-`RtWwFkem5Q%Lvdt+PyosihNawH{nG+mL{ zI#GaWZy>SNU<*oPE9xS#y@_G_=J-1OlG2O#5{YRJ`(jo-B&Jt9{RORyQCA`{JxQ9L zL}I!MlX@U(&yu!h5w-3ZbOWMR4j0NHYS)MK{u#w~xUe0g5Tza%a}uItWs>S4uUxOAv`_%VhEGtNPj{=>EZ5T$c4<6T7Q5L`P1QF<3MS}P;A z!iQGMqqoM0V&*F&K8g>IDvv&&EimCcL}>?n*a=ZO-}VXCp7^3&^M4!@zEQ^e7GJ)# zeXXORGTvkO@|ZF~15D_xjCTRPT%azLF=2=@-a+_spfbT=Owg9o?TRnEDich=1nnx= zmiV%zdL(GVJY~Ehd?`{Un1>0Il<{`Pmz|XfCSk%bvtQD~F`-}PKl2x=i-t{Tpp5rK z<_9~qZ7-GjF7pY##e^p_KUnRlOz=D=T!1L;mg(O_;XF*(BI6TgkEwqXx3GT7wGBSB zQ69ZBX1s?e9h%`u`>!$MTtw*~T>BSMIu|n{#;D%|hvL#9>V?CJL>TfFqSOSJ^o=q< zV#=wREMB-VW=Zhj7}L$v@|U`pa~+~q5f>^UY8PQpcSP+uuS@XSVbW!07IB`0Q8kg6 zUL-9qA~98hP#2Pa8GdkwnK6fM~btK)9*s5UOJ{fL@ z8p1XN;3^g-+EBLxN$tQ#%tmrFkK+i$!>Mk`tjTO7L4DbRV7!GSt~;Od6gP1u2eY-Z zsW({-DIgeMBboL#=Dmhw+AElMKMN7Z&8KC^PtjS7K^!)Tv)G*4AwNaC(im~n01g0P zi?Bav5zjIMNx3<^LlG;4{#^w7PzOn|h8)Zq418T1y2;xhZeU%KA5T%l&856eU@sn_ znDt4%JVg+3PKjACWy1lLj)bxi$en~wx1J^X-u*-pNi-#rNFs?O zl1L(nz9NxC5=kVHL=qJe4T)^1B$B6yJWb?jB2N=vM-zFP$kP)o5qKT|000008?!3y Uc9w`2ZU6uP07*qoM6N<$f@vfmH~;_u literal 0 HcmV?d00001 diff --git a/app/App_Resources/iOS/baseline_account_balance_black_18pt@1x.png b/app/App_Resources/iOS/baseline_account_balance_black_18pt@1x.png new file mode 100755 index 0000000000000000000000000000000000000000..8f7c90413c331c9220ca98d0773623361b4d73a5 GIT binary patch literal 182 zcmeAS@N?(olHy`uVBq!ia0vp^LLkh+0wn(&ce?|mYCT;XLn;`P4=@z*urzQTE^7PF z^IS5gKyyOcjH4geSFkXBH;`DQEs*vi@dx8nw*y~!UU8__@ytKiG~41OfyE#uZL4Pc!g|tXvV$FrSHzBXum?NX>yltK+AJaryuD4JluY zIG~!9tm*MaMu8l=u%yEid1e9}Y8q7;r%N1)L!l3us@&-kIOAE~jGrB!zr`K>FU-Nm S$t8FI0000>rnj*8gzRns5+v12$cucznDlIYVHy{B@)5t)rrlMXgpbNNi{`1NPv0_jaX z0`9VP9!Kn%Rory#EKlp(s+3tv?J1n3f9u4>+!Y@W1=?jOsc&C&NOYGaz-Bn zxf+DszroZKda8Em9&Q6Uub1)vFC8yABT%K`5WCe@sf6e9&NXT5z@T98boFyt=akR{ E0896KO#lD@ literal 0 HcmV?d00001 diff --git a/app/App_Resources/iOS/baseline_home_black_18pt@1x.png b/app/App_Resources/iOS/baseline_home_black_18pt@1x.png new file mode 100755 index 0000000000000000000000000000000000000000..aa43ddae054f86dc91bd7e7f6fea14fb3b041592 GIT binary patch literal 156 zcmeAS@N?(olHy`uVBq!ia0vp^LLkh+0wn(&ce?|ml097xnHsNuPR?LaMI4N@CPmE)Xd8&cCUvBCE=Y(Nie-@{YOpKLV{|@O1TaS?83{ F1OV0II~V`} literal 0 HcmV?d00001 diff --git a/app/App_Resources/iOS/baseline_home_black_18pt@2x.png b/app/App_Resources/iOS/baseline_home_black_18pt@2x.png new file mode 100755 index 0000000000000000000000000000000000000000..a9e2993ebeaea19899781fcac3bd118f00f38e66 GIT binary patch literal 208 zcmeAS@N?(olHy`uVBq!ia0vp^Dj>|k0wldT1B8LpbWaz@kP61Pmlg^(J4m=Z6mLAZ zSkRNP#6eV~FgAc;>IGKO3rte=Y@0hBQj9qN$1)r|Q+s}W6yL-dIncC2Q> zkeYOEy`3{({8{*5j{32THI#u(y;xyL@v)3$EMpnVSdt`vz#R+}f$dZ>*Zcqg002ov JPDHLkV1oI{ZiD~; literal 0 HcmV?d00001 diff --git a/app/App_Resources/iOS/baseline_search_black_18pt@1x.png b/app/App_Resources/iOS/baseline_search_black_18pt@1x.png new file mode 100755 index 0000000000000000000000000000000000000000..70203acd1f6deedf3c198aaca97cafff391ce8b8 GIT binary patch literal 220 zcmV<203-j2P)OXZUDGG<+jTtDWWgIdL<;=`a7&=b4*4c*mS)rr6?$wIYtjz!Ry_hhmr6Ul z6>4%95Fzx=PNIbZiQ;q!4TyBkPQL39n%3g8D4|5>?CX-U!?g2~57USjc8`ZQHi(cFI=Uwzj(6Yui|=V2Q0MQ;a3HZGO**bDxVjzq8%%J?}M^b?T1| z=eW*37GT*z+^C|qX{B?Io|x2=$5d0>Zbh*I6M7M(HdYbBFCODTcGHo)81_?b@?ktE zT{usX94%o!hAdY#kLW^cGf0$)D~32p*ny5LRgZr;x`s%!k}-7bwG=%^*G>rrqQyq$ zq3F6I!MA7`Df4V}-IU-%wDggA1-ed3@DEyM%RCWXtJLqH<-E-8(MO6z_tTMXgv#^? z`nWC89H!9T3-zdbp^yHgNj!~BZ65Pm_03IJfS0MVC2^}S^xk507*qoM6N<$g1pDB-T(jq literal 0 HcmV?d00001 diff --git a/app/App_Resources/iOS/baseline_search_black_18pt@3x.png b/app/App_Resources/iOS/baseline_search_black_18pt@3x.png new file mode 100755 index 0000000000000000000000000000000000000000..e225a47593754b79bedc30b24db25fc50fe89d30 GIT binary patch literal 562 zcmV-20?qx2P)Dm{q!s7{JqL7@t zlpsES6_x5N<`YWiE^FvQ4ty>e?YM{fXAV&bA1cC4REXJ5Jba=BpHZecLvmbeg!(O) z=tDCq(Td?5!azx`kOWr>AtwZ1SwtCrmzk9)$qC}PIW6SB;xUEzw`P2mso6NzRTgE z{`6xcPf@?+4*lpu0(W&UQKs3?W4RH#s>^Be-e@q8DD*@5rY<@i{_{rsj`3s#K+4?L zK@>{Sm+f5O8DF^1F{V?C*q~+Lwv9U1(r`VHbt$+M$hxF~t~(dVx \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/basics/basics-page.js b/app/ns-ui-widgets-category/bottom-navigation/basics/basics-page.js new file mode 100644 index 0000000..e036615 --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/basics/basics-page.js @@ -0,0 +1,4 @@ +function onNavigatingTo(args) { + const page = args.object; +} +exports.onNavigatingTo = onNavigatingTo; diff --git a/app/ns-ui-widgets-category/bottom-navigation/basics/basics-page.xml b/app/ns-ui-widgets-category/bottom-navigation/basics/basics-page.xml index e69de29..7205eb7 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/basics/basics-page.xml +++ b/app/ns-ui-widgets-category/bottom-navigation/basics/basics-page.xml @@ -0,0 +1,31 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/basics/basics-ts-page.ts b/app/ns-ui-widgets-category/bottom-navigation/basics/basics-ts-page.ts new file mode 100644 index 0000000..70bc20b --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/basics/basics-ts-page.ts @@ -0,0 +1,3 @@ +export function onNavigatingTo(args) { + const page = args.object; +} \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/basics/basics-ts-page.xml b/app/ns-ui-widgets-category/bottom-navigation/basics/basics-ts-page.xml new file mode 100644 index 0000000..d97ee09 --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/basics/basics-ts-page.xml @@ -0,0 +1,29 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/bottom-navigation-page.js b/app/ns-ui-widgets-category/bottom-navigation/bottom-navigation-page.js index f022872..11ea5e8 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/bottom-navigation-page.js +++ b/app/ns-ui-widgets-category/bottom-navigation/bottom-navigation-page.js @@ -8,7 +8,7 @@ const navigationLinks = [ // new link("Navigation", "ns-ui-widgets-category/tab-view/navigation/navigation") ]; const navigationLinksTsc = [ - // new link("Code Behind", "ns-ui-widgets-category/tab-view/code-behind/code-behind-ts-page"), + new link("Basics", "ns-ui-widgets-category/bottom-navigation/basics/basics-ts-page") // new link("Navigation", "ns-ui-widgets-category/tab-view/navigation/navigation-ts-page") ]; function onNavigatingTo(args) { @@ -17,7 +17,7 @@ function onNavigatingTo(args) { page.bindingContext = new ListViewLinksModel({ links: navigationLinks, actionBarTitle: args.context.title, - showTypeScriptExamples:false, + showTypeScriptExamples: false, tsclinks: navigationLinksTsc }); } diff --git a/app/ns-ui-widgets-category/bottom-navigation/metadata.md b/app/ns-ui-widgets-category/bottom-navigation/metadata.md index 353920d..2df2829 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/metadata.md +++ b/app/ns-ui-widgets-category/bottom-navigation/metadata.md @@ -1,6 +1,6 @@ --- title: BottomNavigation description: The NativeScript's BottomNavigation component provides a simple way to navigate between different views while providing common UI for both iOS and Android platforms. The recommended scenario suitable for BottomNavigation is a high level navigaiton with 3 to 5 tabs each with separate function. -position: 190 +position: 416 slug: bottom-navigation --- diff --git a/app/ns-ui-widgets-category/bottom-navigation/overview.md b/app/ns-ui-widgets-category/bottom-navigation/overview.md index 11d0625..a9ea677 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/overview.md +++ b/app/ns-ui-widgets-category/bottom-navigation/overview.md @@ -1,14 +1,17 @@ + The `BottomNavigation` component provides a simple way to navigate between different views while providing common UI for both iOS and Android platforms. The recommended scenario suitable for `BottomNavigation` is a high level navigaiton with 3 to 5 tabs each with separate function. For additional information and details about bottom navigation refer to [the Material Design guidelines](https://material.io/design/components/bottom-navigation.html#usage). +> **Note:** NativeScript 6 introduced two new UI components called `BottomNavigation` and `Tabs`. The idea behind them is to provide more control when building tab based UI, while powering the CSS styling, the icon font support and other specific functionalities. Prior to NativeScript 6, we had the `TabView` component which had top and bottom implementations with different behavoirs for the different platofrms and some styling limitations. With `BottomNavigaiton` and `Tabs` coomponents available, the `TabView` can be considered obsolete. + Component Primary Objectives: - Used for High Level navigation. -- Greater UX a structure with 3 to 5 different options. +- Good for UX structure with 3 to 5 different options. Limitations -- No support for navigation transitions. +- No navigation transitions. - No navigation gestures (e.g., swipe to navigate). -- No support for content preloading. +- No content preloading. From 758bf629fcd2fa98e2518db14d71339c9b9663cc Mon Sep 17 00:00:00 2001 From: NickIliev Date: Thu, 4 Jul 2019 15:14:45 +0300 Subject: [PATCH 03/15] docs: BottomNavigation examples --- .eslintrc | 2 +- ...baseline_account_balance_black_24pt@1x.png | Bin 0 -> 157 bytes ...baseline_account_balance_black_24pt@2x.png | Bin 0 -> 237 bytes ...baseline_account_balance_black_24pt@3x.png | Bin 0 -> 296 bytes .../iOS/baseline_home_black_24pt@1x.png | Bin 0 -> 166 bytes .../iOS/baseline_home_black_24pt@2x.png | Bin 0 -> 235 bytes .../iOS/baseline_home_black_24pt@3x.png | Bin 0 -> 291 bytes .../iOS/baseline_search_black_24pt@1x.png | Bin 0 -> 236 bytes .../iOS/baseline_search_black_24pt@2x.png | Bin 0 -> 420 bytes .../iOS/baseline_search_black_24pt@3x.png | Bin 0 -> 636 bytes .../bottom-navigation/basics/article.md | 5 - .../bottom-navigation/basics/basics-page.js | 4 - .../bottom-navigation/basics/basics-page.xml | 31 --- .../basics/basics-ts-page.ts | 3 - .../basics/basics-ts-page.xml | 29 --- .../bottom-navigation-page.js | 16 +- .../bottom-navigation/events/article.md | 6 + .../bottom-navigation/events/events-page.js | 27 +++ .../bottom-navigation/events/events-page.xml | 29 +++ .../events/events-ts-page.ts | 29 +++ .../events/events-ts-page.xml | 29 +++ .../bottom-navigation/metadata.md | 1 + .../bottom-navigation/overview.md | 26 +-- .../bottom-navigation/properties/article.md | 14 ++ .../properties/properties-page.js | 87 +++++++ .../properties/properties-page.xml | 7 + .../properties/properties-ts-page.ts | 77 +++++++ .../properties/properties-ts-page.xml | 8 + .../bottom-navigation/styling/article.md | 0 .../styling/styling-page.xml | 34 +++ .../styling/styling-ts-page.xml | 34 +++ .../bottom-navigation/usage/article.md | 7 + .../bottom-navigation/usage/usage-page.xml | 34 +++ .../bottom-navigation/usage/usage-ts-page.xml | 34 +++ package.json | 4 +- scripts/build.js | 216 +++++++++--------- 36 files changed, 578 insertions(+), 215 deletions(-) create mode 100755 app/App_Resources/iOS/baseline_account_balance_black_24pt@1x.png create mode 100755 app/App_Resources/iOS/baseline_account_balance_black_24pt@2x.png create mode 100755 app/App_Resources/iOS/baseline_account_balance_black_24pt@3x.png create mode 100755 app/App_Resources/iOS/baseline_home_black_24pt@1x.png create mode 100755 app/App_Resources/iOS/baseline_home_black_24pt@2x.png create mode 100755 app/App_Resources/iOS/baseline_home_black_24pt@3x.png create mode 100755 app/App_Resources/iOS/baseline_search_black_24pt@1x.png create mode 100755 app/App_Resources/iOS/baseline_search_black_24pt@2x.png create mode 100755 app/App_Resources/iOS/baseline_search_black_24pt@3x.png delete mode 100644 app/ns-ui-widgets-category/bottom-navigation/basics/article.md delete mode 100644 app/ns-ui-widgets-category/bottom-navigation/basics/basics-page.js delete mode 100644 app/ns-ui-widgets-category/bottom-navigation/basics/basics-page.xml delete mode 100644 app/ns-ui-widgets-category/bottom-navigation/basics/basics-ts-page.ts delete mode 100644 app/ns-ui-widgets-category/bottom-navigation/basics/basics-ts-page.xml create mode 100644 app/ns-ui-widgets-category/bottom-navigation/events/article.md create mode 100644 app/ns-ui-widgets-category/bottom-navigation/events/events-page.js create mode 100644 app/ns-ui-widgets-category/bottom-navigation/events/events-page.xml create mode 100644 app/ns-ui-widgets-category/bottom-navigation/events/events-ts-page.ts create mode 100644 app/ns-ui-widgets-category/bottom-navigation/events/events-ts-page.xml create mode 100644 app/ns-ui-widgets-category/bottom-navigation/properties/article.md create mode 100644 app/ns-ui-widgets-category/bottom-navigation/properties/properties-page.js create mode 100644 app/ns-ui-widgets-category/bottom-navigation/properties/properties-page.xml create mode 100644 app/ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page.ts create mode 100644 app/ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page.xml create mode 100644 app/ns-ui-widgets-category/bottom-navigation/styling/article.md create mode 100644 app/ns-ui-widgets-category/bottom-navigation/styling/styling-page.xml create mode 100644 app/ns-ui-widgets-category/bottom-navigation/styling/styling-ts-page.xml create mode 100644 app/ns-ui-widgets-category/bottom-navigation/usage/article.md create mode 100644 app/ns-ui-widgets-category/bottom-navigation/usage/usage-page.xml create mode 100644 app/ns-ui-widgets-category/bottom-navigation/usage/usage-ts-page.xml diff --git a/.eslintrc b/.eslintrc index 12c201f..a6bbbc8 100644 --- a/.eslintrc +++ b/.eslintrc @@ -100,7 +100,7 @@ "no-multi-str": "error", "no-multiple-empty-lines": "error", "no-negated-condition": "off", - "no-nested-ternary": "error", + "no-nested-ternary": "off", "no-new": "error", "no-new-func": "error", "no-new-object": "error", diff --git a/app/App_Resources/iOS/baseline_account_balance_black_24pt@1x.png b/app/App_Resources/iOS/baseline_account_balance_black_24pt@1x.png new file mode 100755 index 0000000000000000000000000000000000000000..384f82dbb01c454fa6b3b178e4a195270551307e GIT binary patch literal 157 zcmeAS@N?(olHy`uVBq!ia0vp^5+KaM0wlfaz7_+i6i*k&kP61+1#AzJRwV2=A8_)3 zXHQaCTTa__p8p3wusZWi=w~-DJYs0WqV0O%w}YYDn^VjZc@0w&4z1>Ce9@IFagJH_ z!@(o{=Rqm@Pvn^az$nZmX5 zMvsM}rj^k#HNkF1b`|I9wumDyHaZt=S$f`G&n`(pe!54Jo@~eZ2UGTVRbOY6y#Pdw k{{wziyma`+<$9OVRKw`g)MllHK=(6vy85}Sb4q9e0P_T19smFU literal 0 HcmV?d00001 diff --git a/app/App_Resources/iOS/baseline_account_balance_black_24pt@3x.png b/app/App_Resources/iOS/baseline_account_balance_black_24pt@3x.png new file mode 100755 index 0000000000000000000000000000000000000000..6fe82607fe34d45e8b4d76fd6b564b4e9059c73a GIT binary patch literal 296 zcmeAS@N?(olHy`uVBq!ia0vp^9w5xY0wn)GsXhaw-g~+@hEy=VImpO%h(UzmLOM@r z2aAgX#|_0-OuHRq7xZoBzQXv5k6F-wv9#l-pn&ILvn}8M%s+U;FExKjeULQ&$Exj9 zUj-_a3+HR^bkPr6_vmr=*1lA)kENQICoY}*FyH!rngqg zNUBEbQrRBc?^1KNt$Xg){P(NvcBwb(U+=t_Q0#VoaSey!7js316)L-y-uvOiq1Yk- mCjx944tVo}L{`W!R4`SlQ=%z%MzijW2GLcov$O0vx|U_mR@2~k|K+3H?bywIvWjI^QeR{=N-j9xJ@~0TM3+>Q=Zc_59|is#ZjbTE*yy^`rrii= OF@vY8pUXO@geCy$(K~bi literal 0 HcmV?d00001 diff --git a/app/App_Resources/iOS/baseline_home_black_24pt@2x.png b/app/App_Resources/iOS/baseline_home_black_24pt@2x.png new file mode 100755 index 0000000000000000000000000000000000000000..e20865ab0b15605d8c51d2386cecfaf674080a89 GIT binary patch literal 235 zcmeAS@N?(olHy`uVBq!ia0vp^1|ZDA0wn)(8}b0DO`a}}Ar*{C3#=tr7bh?YT;kba zv?l2Xf6M9y9VrIAwq~CH3qL4Ka8Fg>%9!8NE78)(u#9KoEYTYcni5U1H+n^5F7ICW zbBksCp_e_Ur?Um9@;y4;Y|cDW!zDQ}Nx)eB&b=;`TVenJ literal 0 HcmV?d00001 diff --git a/app/App_Resources/iOS/baseline_home_black_24pt@3x.png b/app/App_Resources/iOS/baseline_home_black_24pt@3x.png new file mode 100755 index 0000000000000000000000000000000000000000..bcbeb199c0fe9ebb10f1617c49acc051f7302607 GIT binary patch literal 291 zcmeAS@N?(olHy`uVBq!ia0vp^9w5xY0wn)GsXhawUU|AWhEy=Vow88yP=Eldc;msv znT>oanv^bivy@(76}`YDB`;iD)0iM}Xii0p(c#;<30ISP44;|Lnbn4h3!22o7)XgFg2J7Y!Kd^}C zW)Z&td+)z2+-Z_kCm$=YTV^!ba}`Z!mU#kXpK# My85}Sb4q9e05FAaVgLXD literal 0 HcmV?d00001 diff --git a/app/App_Resources/iOS/baseline_search_black_24pt@1x.png b/app/App_Resources/iOS/baseline_search_black_24pt@1x.png new file mode 100755 index 0000000000000000000000000000000000000000..87e74ffbf9f97879b5aa6122fa14ddde56ffb66c GIT binary patch literal 236 zcmVh%+a+GO9(f7Nf2Nv!arMj4p4wWCTeOYl4)IQi3%RCxUJtbqh{JWCWEyst{yF z97iggidg+-hAF|8h(19^r#GE4g5KZmF!_9kNmqjP|6Dq6S8$+)xM4H)+`6@>9S4z+ msCp-b8*-@HKQyRTxb6VVc~sxTM4g5J0000;$stM*R0?>{ZH_N^ zn|B*NS_y~nMJl4UbC=EBr5#aI@j(otHgL+}12!OPES|~G)IrYS#5o2vDg%#PN7N_m z#4|*_fhS&TS~e!KH1f5-50rq31b-i?Mbn}&5v7qWcw$o1j$z`MMo!>~aZNjdi6a_0 zi6`1LEeaEn8rf_6Cl}#~SFVd`wnqNL6E|E|v?qxA&`wh^q)|0^CLU26IqT5aH6rQ@ ze2`*jt~(GlZMQm{Tb$$sw|P%7g32_PY<8I=y8dOO(-;180Z~8WlX!<=OFhp4kl?p~ zXmsGkI4z{}i>E034t@(0iF@@H;VoX5WLqg_9GXMYuIaIR*xsq7` O0000CYeR-<&cn!?0Y z1x_QU&QO84smD#^+)e5c7j=1vi1wHz^rjJ&$WJ92(vL+vK}35%eY`8djU<0&5cxpewqQ<(S2>VpTfkhKyR}I5B4D|0e1<=+J^^skkt%#&5(5$58fiHD(n$F9M^<6n6++gxto8^!!h^fW zYL2_+$hv?B2awf2#&_9HJeZBF^|)J)tm$~rFQ!lGBD_adS3D@eXJie<%}`{0p%7lI zMb=x&l73})hpg>*(*D1H4{bwObitd0$o-|sbcDrGJZg&~O(1RKP^6A{wKB=6qX;Q0 zlH}AeBO}gb15-Gc4NP*RyhK5~tIvaEPp*9WNimHQ;WcZ{FdL=y}*<37n|wPeKKTiEYB=L*MJ zKu?MiRg1fhll;qulftAhDNG8JDrbR7S?MvdNm*r%P0A{BY?95%B5MCE8w-LU2z~%Z Wwf?8PY)cOS0000 \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/basics/basics-page.js b/app/ns-ui-widgets-category/bottom-navigation/basics/basics-page.js deleted file mode 100644 index e036615..0000000 --- a/app/ns-ui-widgets-category/bottom-navigation/basics/basics-page.js +++ /dev/null @@ -1,4 +0,0 @@ -function onNavigatingTo(args) { - const page = args.object; -} -exports.onNavigatingTo = onNavigatingTo; diff --git a/app/ns-ui-widgets-category/bottom-navigation/basics/basics-page.xml b/app/ns-ui-widgets-category/bottom-navigation/basics/basics-page.xml deleted file mode 100644 index 7205eb7..0000000 --- a/app/ns-ui-widgets-category/bottom-navigation/basics/basics-page.xml +++ /dev/null @@ -1,31 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/basics/basics-ts-page.ts b/app/ns-ui-widgets-category/bottom-navigation/basics/basics-ts-page.ts deleted file mode 100644 index 70bc20b..0000000 --- a/app/ns-ui-widgets-category/bottom-navigation/basics/basics-ts-page.ts +++ /dev/null @@ -1,3 +0,0 @@ -export function onNavigatingTo(args) { - const page = args.object; -} \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/basics/basics-ts-page.xml b/app/ns-ui-widgets-category/bottom-navigation/basics/basics-ts-page.xml deleted file mode 100644 index d97ee09..0000000 --- a/app/ns-ui-widgets-category/bottom-navigation/basics/basics-ts-page.xml +++ /dev/null @@ -1,29 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/bottom-navigation-page.js b/app/ns-ui-widgets-category/bottom-navigation/bottom-navigation-page.js index 11ea5e8..569b2a0 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/bottom-navigation-page.js +++ b/app/ns-ui-widgets-category/bottom-navigation/bottom-navigation-page.js @@ -1,16 +1,18 @@ const ListViewLinksModel = require("../../links-view-model"); const link = require("../../link"); const navigationLinks = [ - new link("Basics", "ns-ui-widgets-category/bottom-navigation/basics/basics-page") - // new link("Styling", "ns-ui-widgets-category/tab-view/styling/styling-page"), - // new link("Title Icon Fonts", "ns-ui-widgets-category/tab-view/title-icon-fonts/title-icon-fonts-page"), - // new link("Code Behind", "ns-ui-widgets-category/tab-view/code-behind/code-behind-page"), - // new link("Navigation", "ns-ui-widgets-category/tab-view/navigation/navigation") + new link("Usage", "ns-ui-widgets-category/bottom-navigation/usage/usage-page"), + new link("Usage", "ns-ui-widgets-category/bottom-navigation/styling/styling-page"), + new link("Events", "ns-ui-widgets-category/bottom-navigation/events/events-page"), + new link("Properties", "ns-ui-widgets-category/bottom-navigation/properties/properties-page") ]; const navigationLinksTsc = [ - new link("Basics", "ns-ui-widgets-category/bottom-navigation/basics/basics-ts-page") - // new link("Navigation", "ns-ui-widgets-category/tab-view/navigation/navigation-ts-page") + new link("Usage", "ns-ui-widgets-category/bottom-navigation/usage/usage-ts-page"), + new link("Usage", "ns-ui-widgets-category/bottom-navigation/styling/styling-ts-page"), + new link("Events", "ns-ui-widgets-category/bottom-navigation/events/events-ts-page"), + new link("Properties", "ns-ui-widgets-category/bottom-navigation/properties/properties-page") ]; + function onNavigatingTo(args) { const page = args.object; diff --git a/app/ns-ui-widgets-category/bottom-navigation/events/article.md b/app/ns-ui-widgets-category/bottom-navigation/events/article.md new file mode 100644 index 0000000..a34e2a9 --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/events/article.md @@ -0,0 +1,6 @@ +- `selectedIndexChanged` - Event used to track the tabs interaction though the change of `selectedIndex` property of `BottomNavigation` component. The event data is of type `SelectedIndexChangedEventData` extends `EventData` with two new properties: + - `oldIndex` - Provides the old selected index. + - `newIndwex` - Provides the new selected index. + + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/events/events-page.js b/app/ns-ui-widgets-category/bottom-navigation/events/events-page.js new file mode 100644 index 0000000..f76d1cb --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/events/events-page.js @@ -0,0 +1,27 @@ +const fromObject = require("tns-core-modules/data/observable").fromObject; + +exports.onNavigatingTo = (args) => { + const page = args.object; + const vm = fromObject({ + selectedIndex: 1 + }); + + page.bindingContext = vm; +}; + +// >> bottom-navigation-events-js +exports.onBottomNavLoaded = (args) => { + // Using the loaded event to ger a reference to the BottomNavigation + const bottomNavigation = args.object; + + // Using selectedIndexChanged + bottomNavigation.on("selectedIndexChanged", (args) => { + // args is of type SelectedIndexChangedEventData + const oldIndex = args.oldIndex; + const newIndex = args.newIndex; + console.log(`oldIndex: ${oldIndex}; newIndex: ${newIndex}`); + + args.object.page.bindingContext.set("selectedIndex", newIndex); + }); +}; +// << bottom-navigation-events-js diff --git a/app/ns-ui-widgets-category/bottom-navigation/events/events-page.xml b/app/ns-ui-widgets-category/bottom-navigation/events/events-page.xml new file mode 100644 index 0000000..f486778 --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/events/events-page.xml @@ -0,0 +1,29 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/events/events-ts-page.ts b/app/ns-ui-widgets-category/bottom-navigation/events/events-ts-page.ts new file mode 100644 index 0000000..53c444a --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/events/events-ts-page.ts @@ -0,0 +1,29 @@ +// >> bottom-navigation-events-tsc +import { EventData, fromObject } from "tns-core-modules/data/observable"; +import { BottomNavigation, SelectedIndexChangedEventData } from "tns-core-modules/ui/bottom-navigation"; +// >> (hide) +import { Page } from "tns-core-modules/ui/page"; + +export function onNavigatingTo(args: EventData) { + const page = args.object as Page; + const vm = fromObject({ + selectedIndex: 1 + }) + + page.bindingContext = vm; +} +// << (hide) +export function onBottomNavLoaded(args: EventData) { + // Using the loaded event to ger a reference to the BottomNavigation + const bottomNavigation = args.object as BottomNavigation; + + // Using selectedIndexChanged + bottomNavigation.on(BottomNavigation.selectedIndexChangedEvent , (args: SelectedIndexChangedEventData) => { + const oldIndex: number = args.oldIndex; + const newIndex: number = args.newIndex; + console.log(`oldIndex: ${oldIndex}; newIndex: ${newIndex}`); + + (args.object).page.bindingContext.set("selectedIndex", newIndex); + }); +}; +// << bottom-navigation-events-tsc \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/events/events-ts-page.xml b/app/ns-ui-widgets-category/bottom-navigation/events/events-ts-page.xml new file mode 100644 index 0000000..054416e --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/events/events-ts-page.xml @@ -0,0 +1,29 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/metadata.md b/app/ns-ui-widgets-category/bottom-navigation/metadata.md index 2df2829..877a767 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/metadata.md +++ b/app/ns-ui-widgets-category/bottom-navigation/metadata.md @@ -4,3 +4,4 @@ description: The NativeScript's BottomNavigation component provides a simple way position: 416 slug: bottom-navigation --- +example-order: usage, styling, properties, events, tips-and-tricks \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/overview.md b/app/ns-ui-widgets-category/bottom-navigation/overview.md index a9ea677..8168ebc 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/overview.md +++ b/app/ns-ui-widgets-category/bottom-navigation/overview.md @@ -1,4 +1,4 @@ - +> **Disclaimer:** The `BottomNavigation` component is currently in **Beta** version. The component is being actively developed - use [the tracking issue](https://github.com/NativeScript/NativeScript/issues/6967) for details about the ongoing implementation. The `BottomNavigation` component provides a simple way to navigate between different views while providing common UI for both iOS and Android platforms. The recommended scenario suitable for `BottomNavigation` is a high level navigaiton with 3 to 5 tabs each with separate function. For additional information and details about bottom navigation refer to [the Material Design guidelines](https://material.io/design/components/bottom-navigation.html#usage). @@ -12,27 +12,3 @@ Limitations - No navigation transitions. - No navigation gestures (e.g., swipe to navigate). - No content preloading. - - - - \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/properties/article.md b/app/ns-ui-widgets-category/bottom-navigation/properties/article.md new file mode 100644 index 0000000..7dba1fe --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/properties/article.md @@ -0,0 +1,14 @@ + +- `items: Array;` - Gets or sets the items of the BottomNavigation. + +- `tabStrip: TabStrip;` - Gets or sets the tab strip of the BottomNavigation. + +- `selectedIndex: number;` - Gets or sets the selectedIndex of the BottomNavigation. + +- `android: any` /* android.view.View */; - Gets the native [android widget](http://developer.android.com/reference/android/support/v4/view/ViewPager.html) that represents the user interface for this component. Valid only when running on Android OS. + +- `ios: any` /* UITabBarController */; - Gets the native iOS [UITabBarController](https://developer.apple.com/library/ios/documentation/UIKit/Reference/UITabBarController_Class/) that represents the user interface for this component. Valid only when running on iOS. + + + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/properties/properties-page.js b/app/ns-ui-widgets-category/bottom-navigation/properties/properties-page.js new file mode 100644 index 0000000..1226d9e --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/properties/properties-page.js @@ -0,0 +1,87 @@ +const Label = require("tns-core-modules/ui/label").Label; +const StackLayout = require("tns-core-modules/ui/layouts/stack-layout").StackLayout; +const Color = require("tns-core-modules/color/color").Color; +// >> bottom-navigation-events-js +const TabStrip = require("tns-core-modules/ui/bottom-navigation").TabStrip; +const TabStripItem = require("tns-core-modules/ui/bottom-navigation").TabStripItem; +const TabContentItem = require("tns-core-modules/ui/bottom-navigation").TabContentItem; + +exports.onBottomNavLoaded = (args) => { + // BottomNavigation + const bottomNav = args.object; + /* + Using the items property to assign array of TabContentItem components (with content) + Note: The number of TabContentItem components should be equal to the number of TabStripItem components + */ + const tabContentItemsArray = createTabsContentArray(); + bottomNav.items = tabContentItemsArray; + + /* + Using the tabStrip property to createa a TabStrip with multiple TabStripItems (tabs) + Note: The number of TabStripItem components should be equal to the number of TabContentItem components + */ + const tabStrip = createTabStrip(); + bottomNav.tabStrip = tabStrip; + + /* + Using the selectedIndex property + */ + bottomNav.selectedIndex = 1; + + /* + Using the nativeView property (correspnding to bottomNav.ios or bottomNav.android depending on the used platform) + */ + console.log("bottomNav.nativeView: ", bottomNav.nativeView); +}; +// << bottom-navigation-events-js + +function createTabStrip() { + // TabStrip + const tabStrip = new TabStrip(); + tabStrip.iosIconRenderingMode = "automatic"; // iOS only (automatic is the default value) + + // An array of TabStripItem + const tabStripItems = []; + for (let index = 0; index < 3; index++) { + // Each item is of type TabStripItem + const item = new TabStripItem(); + /* + Using TabStripItem title property + */ + item.title = `${index === 0 ? "Home" : (index === 1 ? "Account" : "Search")}`; + /* + Using TabStripItem title property + */ + item.iconSource = index === 0 ? "res://baseline_home_black_24pt" : (index === 1 ? "res://baseline_account_balance_black_24pt" : "res://baseline_search_black_24pt"); + tabStripItems.push(item); + } + tabStrip.items = tabStripItems; + + return tabStrip; +} + +function createTabsContentArray() { + // array of TabContentItem + const arr = []; + for (let index = 0; index < 3; index++) { + // item is of type TabContentItem + const item = new TabContentItem(); + // The createContent is a custom method that returns a StackLayout with a Label as a chils + item.view = createContent(index); + arr.push(item); + } + + return arr; +} + +function createContent(index) { + const label = new Label(); + label.text = `${index === 0 ? "Home" : (index === 1 ? "Account" : "Search")}`; + label.className = "h2 text-center"; + label.color = new Color("red"); + const stack = new StackLayout(); + stack.verticalAlignment = "middle"; + stack.addChild(label); + + return stack; +} diff --git a/app/ns-ui-widgets-category/bottom-navigation/properties/properties-page.xml b/app/ns-ui-widgets-category/bottom-navigation/properties/properties-page.xml new file mode 100644 index 0000000..00bec78 --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/properties/properties-page.xml @@ -0,0 +1,7 @@ + + + + + + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page.ts b/app/ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page.ts new file mode 100644 index 0000000..e153035 --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page.ts @@ -0,0 +1,77 @@ +import { Label } from "tns-core-modules/ui/label"; +import { StackLayout } from "tns-core-modules/ui/layouts/stack-layout"; +import { Color } from "tns-core-modules/color/color"; +// >> bottom-navigation-events-tsc +import { EventData } from "tns-core-modules/data/observable"; +import { BottomNavigation, TabStrip, TabStripItem, TabContentItem } from "tns-core-modules/ui/bottom-navigation"; + +export function onBottomNavLoaded(args: EventData) { + const bottomNav = args.object as BottomNavigation; + + /* + Using the items property to assign array of TabContentItem componentns + Note: The number of TabContentItem components should be equal to the number of TabStripItem components + */ + const tabContentItemsArray: Array = createTabsContentArray(); + bottomNav.items = tabContentItemsArray; + + /* + Using the tabStrip property to createa a TabStrip with multiple TabStripItems (tabs) + Note: The number of TabStripItem components should be equal to the number of TabContentItem components + */ + const tabStrip = createTabStrip(); + bottomNav.tabStrip = tabStrip; + + /* + Using the selectedIndex property + */ + bottomNav.selectedIndex = 1; + + console.log(bottomNav.nativeView); +} +// << bottom-navigation-events-tsc + +function createTabStrip() { + const tabStrip: TabStrip = new TabStrip(); + tabStrip.iosIconRenderingMode = "automatic"; // iOS only (automatic is the default value) + const tabStripItems: Array = []; + for (let index = 0; index < 3; index++) { + const item: TabStripItem = new TabStripItem(); + /* + Using TabStripItem title property + */ + item.title = `Tab ${index === 0 ? "res://baseline_home_black_24pt" : (index === 1 ? "res://baseline_account_balance_black_24pt" : "res://baseline_search_black_24pt" )}`; + /* + Using TabStripItem title property + */ + item.iconSource = index === 0 ? "res://baseline_home_black_24pt" : (index === 1 ? "res://baseline_account_balance_black_24pt" : "res://baseline_search_black_24pt" ); + tabStripItems.push(item); + } + tabStrip.items = tabStripItems; + + return tabStrip; +} + +function createTabsContentArray() { + const arr: Array = []; + for (let index = 0; index < 3; index++) { + const item: TabContentItem = new TabContentItem(); + // The createContent is a custom method that returns a StackLayout with a Label as a chils + item.view = createContent(index); + arr.push(item); + } + + return arr; +} + +function createContent(index: number) { + const label = new Label(); + label.text = `${index === 0 ? "Home" : (index === 1 ? "Account" : "Search")}`; + label.className = "h2 text-center"; + label.color = new Color("red"); + const stack = new StackLayout(); + stack.verticalAlignment = "middle"; + stack.addChild(label); + + return stack; +} \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page.xml b/app/ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page.xml new file mode 100644 index 0000000..dd4a7ff --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page.xml @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/styling/article.md b/app/ns-ui-widgets-category/bottom-navigation/styling/article.md new file mode 100644 index 0000000..e69de29 diff --git a/app/ns-ui-widgets-category/bottom-navigation/styling/styling-page.xml b/app/ns-ui-widgets-category/bottom-navigation/styling/styling-page.xml new file mode 100644 index 0000000..ac4e642 --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/styling/styling-page.xml @@ -0,0 +1,34 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/styling/styling-ts-page.xml b/app/ns-ui-widgets-category/bottom-navigation/styling/styling-ts-page.xml new file mode 100644 index 0000000..b452564 --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/styling/styling-ts-page.xml @@ -0,0 +1,34 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/usage/article.md b/app/ns-ui-widgets-category/bottom-navigation/usage/article.md new file mode 100644 index 0000000..ad0dc20 --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/usage/article.md @@ -0,0 +1,7 @@ +The `BottomNavigation` component contains two sub-components: +- The `TabStrip` which defines and rendres the bottom bar and its `TabStripItem` components. +- Multiple `TabContentItem` components which total number should be equal to the number of the tabs (`TabStripItem` components). Each `TabContentItem` acts as a container for your tab content. + + + +> **Note:** The number of `TabStripItem` components must be equal to the number of `tabContentItem` components. \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/usage/usage-page.xml b/app/ns-ui-widgets-category/bottom-navigation/usage/usage-page.xml new file mode 100644 index 0000000..ac4e642 --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/usage/usage-page.xml @@ -0,0 +1,34 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/usage/usage-ts-page.xml b/app/ns-ui-widgets-category/bottom-navigation/usage/usage-ts-page.xml new file mode 100644 index 0000000..b452564 --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/usage/usage-ts-page.xml @@ -0,0 +1,34 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/package.json b/package.json index 593e7f6..2b819bf 100644 --- a/package.json +++ b/package.json @@ -30,13 +30,13 @@ }, "dependencies": { "nativescript-theme-core": "~1.0.4", - "tns-core-modules": "next" + "tns-core-modules": "^6.0.0-rc-2019-07-03-223248-02" }, "devDependencies": { "eslint": "~5.9.0", "fs-extra": "^0.30.0", "markdown-snippet-injector": "^0.2.4", - "nativescript-dev-webpack": "next", + "nativescript-dev-webpack": "^1.0.0-next-2019-06-28-135258-05", "tar.gz": "^1.0.7", "tns-platform-declarations": "next", "tslint": "5.11.0", diff --git a/scripts/build.js b/scripts/build.js index e4e5cd0..8e096cb 100644 --- a/scripts/build.js +++ b/scripts/build.js @@ -33,15 +33,15 @@ function compareFiles(leftFile, rightFile) { // Example: // metadata.md - activity-indicator // example-order: styling, basics -function orderExamples (array, order, dirName) { +function orderExamples(array, order, dirName) { var customSortArray = []; - order.forEach(function(item){ - var index = array.indexOf(dirName+"/"+item+"/article.md"); - if(index >= 0){ + order.forEach(function (item) { + var index = array.indexOf(dirName + "/" + item + "/article.md"); + if (index >= 0) { customSortArray.push(array[index]); array.splice(index, 1); } - }); + }); array = array.sort(compareFiles); var resultArray = customSortArray.concat(array); return resultArray; @@ -84,7 +84,7 @@ function gatherArticles(cwd, appDir, articlesDir, jenkinsPosition) { var subDirPath = path.join(appDir, subDir); // Gather all component overviews in the subdirs - ns-ui-widgets-category, data-category - var components = glob.sync(subDirPath + "/*/overview.md").filter(function (file) { + var components = glob.sync(subDirPath + "/*/overview.md").filter(function (file) { return !path.parse(file).dir.endsWith(CATEGORY); }).sort(compareFiles); getComponents(cwd, components, currentDir, jenkinsPosition); @@ -106,116 +106,116 @@ function getComponents(cwd, components, currentDir, jenkinsPosition) { fs.mkdirSync(imgDir); } - components.forEach(function (overview) { - var componentDirName = path.dirname(overview); - var componentHeader = path.basename(componentDirName); - // Create the component article file, i.e. button.md - var componentArticleFile = path.join(currentDir, componentHeader + ".md"); - - var componentPrettyHeader = prettify(componentHeader); - - var componentArticlesOrder = []; - // Jenkins Header - // MetaData.md - var subDirPath = overview.replace("/overview.md", ""); - var pathExists = fs.existsSync(path.join(subDirPath, "metadata.md")); - - if (pathExists) { - var metadata = path.join(subDirPath, "metadata.md"); - var metadataContents = fs.readFileSync(metadata, { encoding: 'utf8' }); - var metadataSplit = metadataContents.split("---"); - fs.appendFileSync(componentArticleFile, "---\n", { encoding: 'utf8' }); - fs.appendFileSync(componentArticleFile, metadataSplit[1] , { encoding: 'utf8' }); - fs.appendFileSync(componentArticleFile, "---\n\n", { encoding: 'utf8' }); - - if(metadataSplit[2].indexOf("example-order") >=0){ - var exampleOrderString = metadataSplit[2].split(":"); - var orderString = exampleOrderString[1].replace(/\s/g,''); - componentArticlesOrder = orderString.split(","); - } - } - else { - fs.appendFileSync(componentArticleFile, "---\n", { encoding: 'utf8' }); - fs.appendFileSync(componentArticleFile, "title: " + componentPrettyHeader + "\n", { encoding: 'utf8' }); - fs.appendFileSync(componentArticleFile, "description: " + componentPrettyHeader + " SDK Examples" + "\n", { encoding: 'utf8' }); - fs.appendFileSync(componentArticleFile, "position: " + jenkinsPosition++ + "\n", { encoding: 'utf8' }); - fs.appendFileSync(componentArticleFile, "slug: " + componentHeader + "\n", { encoding: 'utf8' }); - fs.appendFileSync(componentArticleFile, "---\n\n", { encoding: 'utf8' }); + components.forEach(function (overview) { + var componentDirName = path.dirname(overview); + var componentHeader = path.basename(componentDirName); + // Create the component article file, i.e. button.md + var componentArticleFile = path.join(currentDir, componentHeader + ".md"); + + var componentPrettyHeader = prettify(componentHeader); + + var componentArticlesOrder = []; + // Jenkins Header + // MetaData.md + var subDirPath = overview.replace("/overview.md", ""); + var pathExists = fs.existsSync(path.join(subDirPath, "metadata.md")); + + if (pathExists) { + var metadata = path.join(subDirPath, "metadata.md"); + var metadataContents = fs.readFileSync(metadata, { encoding: 'utf8' }); + var metadataSplit = metadataContents.split("---"); + fs.appendFileSync(componentArticleFile, "---\n", { encoding: 'utf8' }); + fs.appendFileSync(componentArticleFile, metadataSplit[1], { encoding: 'utf8' }); + fs.appendFileSync(componentArticleFile, "---\n\n", { encoding: 'utf8' }); + + if (metadataSplit[2].indexOf("example-order") >= 0) { + var exampleOrderString = metadataSplit[2].split(":"); + var orderString = exampleOrderString[1].replace(/\s/g, ''); + componentArticlesOrder = orderString.split(","); } + } + else { + fs.appendFileSync(componentArticleFile, "---\n", { encoding: 'utf8' }); + fs.appendFileSync(componentArticleFile, "title: " + componentPrettyHeader + "\n", { encoding: 'utf8' }); + fs.appendFileSync(componentArticleFile, "description: " + componentPrettyHeader + " SDK Examples" + "\n", { encoding: 'utf8' }); + fs.appendFileSync(componentArticleFile, "position: " + jenkinsPosition++ + "\n", { encoding: 'utf8' }); + fs.appendFileSync(componentArticleFile, "slug: " + componentHeader + "\n", { encoding: 'utf8' }); + fs.appendFileSync(componentArticleFile, "---\n\n", { encoding: 'utf8' }); + } - // Component Markdown Header - fs.appendFileSync(componentArticleFile, "# " + componentPrettyHeader + "\n\n", {encoding:'utf8'}); + // Component Markdown Header + fs.appendFileSync(componentArticleFile, "# " + componentPrettyHeader + "\n\n", { encoding: 'utf8' }); - // Component Overview - var overviewContents = fs.readFileSync(overview, {encoding:'utf8'}); - fs.appendFileSync(componentArticleFile, overviewContents + "\n\n", {encoding:'utf8'}); + // Component Overview + var overviewContents = fs.readFileSync(overview, { encoding: 'utf8' }); + fs.appendFileSync(componentArticleFile, overviewContents + "\n\n", { encoding: 'utf8' }); - // Component Images - let componentImage = path.join(componentDirName, "image.png"); - if (fs.existsSync(componentImage)) { - let newImageFileName = componentHeader + "-" + "image.png"; - fs.copySync(componentImage, path.join(imgDir, newImageFileName)); + // Component Images + let componentImage = path.join(componentDirName, "image.png"); + if (fs.existsSync(componentImage)) { + let newImageFileName = componentHeader + "-" + "image.png"; + fs.copySync(componentImage, path.join(imgDir, newImageFileName)); - fs.appendFileSync(componentArticleFile, "![Image](img/" + newImageFileName + " \"Image\")\n\n", {encoding:'utf8'}); - } - var articles = []; - if(componentArticlesOrder.length >0){ - articles = orderExamples(glob.sync(componentDirName + "/**/article.md"), componentArticlesOrder, componentDirName); - } else{ - articles = glob.sync(componentDirName + "/**/article.md").sort(compareFiles); + fs.appendFileSync(componentArticleFile, "![Image](img/" + newImageFileName + " \"Image\")\n\n", { encoding: 'utf8' }); + } + var articles = []; + if (componentArticlesOrder.length > 0) { + articles = orderExamples(glob.sync(componentDirName + "/**/article.md"), componentArticlesOrder, componentDirName); + } else { + articles = glob.sync(componentDirName + "/**/article.md").sort(compareFiles); + } + + // Append each example to the big article file. + articles.forEach(function (article) { + var articleDirName = path.dirname(article); + var articleHeader = path.basename(articleDirName); + + // Header + var prettyArticleHeader = prettify(articleHeader); + prettyArticleHeader = prettyArticleHeader.replace(/Ios|IOS/, "iOS"); + fs.appendFileSync(componentArticleFile, "## " + prettyArticleHeader + "\n\n", { encoding: 'utf8' }); + + // Content + var articleContents = fs.readFileSync(article, { encoding: 'utf8' }); + fs.appendFileSync(componentArticleFile, articleContents + "\n\n", { encoding: 'utf8' }); + + // Article Images + let articleImage = path.join(articleDirName, "image.png"); + + if (fs.existsSync(articleImage)) { + let newArticleImageFileName = componentHeader + "-" + articleHeader + "-image.png"; + let joined = path.join(imgDir, newArticleImageFileName); + fs.copySync(articleImage, joined); + + fs.appendFileSync(componentArticleFile, "![Image](img/" + newArticleImageFileName + " \"Image\")\n\n", { encoding: 'utf8' }); } + let articleImages = glob.sync(articleDirName + "/*.png"); + articleImages.forEach(function (imagePath) { + let stringSplitResult = imagePath.split("/"); + let imageName = stringSplitResult[stringSplitResult.length - 1]; + let joined = path.join(imgDir, imageName); + fs.copySync(imagePath, joined); + }) + + // Links + var githubDirUrl = pjson.homepage + "/edit/master/" + path.relative(cwd, articleDirName).replace(/\\/g, "/"); - // Append each example to the big article file. - articles.forEach(function (article) { - var articleDirName = path.dirname(article); - var articleHeader = path.basename(articleDirName); - - // Header - var prettyArticleHeader = prettify(articleHeader); - prettyArticleHeader = prettyArticleHeader.replace(/Ios|IOS/, "iOS"); - fs.appendFileSync(componentArticleFile, "## " + prettyArticleHeader + "\n\n", {encoding:'utf8'}); - - // Content - var articleContents = fs.readFileSync(article, {encoding:'utf8'}); - fs.appendFileSync(componentArticleFile, articleContents + "\n\n", {encoding:'utf8'}); - - // Article Images - let articleImage = path.join(articleDirName, "image.png"); - - if (fs.existsSync(articleImage)) { - let newArticleImageFileName = componentHeader + "-" + articleHeader + "-image.png"; - let joined = path.join(imgDir, newArticleImageFileName); - fs.copySync(articleImage, joined); - - fs.appendFileSync(componentArticleFile, "![Image](img/" + newArticleImageFileName + " \"Image\")\n\n", {encoding:'utf8'}); - } - let articleImages = glob.sync(articleDirName + "/*.png"); - articleImages.forEach(function(imagePath){ - let stringSplitResult = imagePath.split("/"); - let imageName = stringSplitResult[stringSplitResult.length - 1]; - let joined = path.join(imgDir, imageName); - fs.copySync(imagePath, joined); - }) - - // Links - var githubDirUrl = pjson.homepage + "/edit/master/" + path.relative(cwd, articleDirName).replace(/\\/g, "/"); - - var linkToDocument = "[Improve this document](" + githubDirUrl + "/" + path.basename(article) + ")" - fs.appendFileSync(componentArticleFile, linkToDocument + "\n\n", {encoding:'utf8'}); - - var linkToSource = "[Demo Source](" + githubDirUrl + ")" - fs.appendFileSync(componentArticleFile, linkToSource + "\n\n", {encoding:'utf8'}); - - // Horizontal Line - fs.appendFileSync(componentArticleFile, "---\n\n", {encoding:'utf8'}); - }); - - // End.md - var subDirPath = overview.replace("/overview.md", ""); - var end = path.join(subDirPath, "end.md"); - var endContents = fs.readFileSync(end, {encoding:'utf8'}); - fs.appendFileSync(componentArticleFile, endContents + "\n\n", {encoding:'utf8'}); + var linkToDocument = "[Improve this document](" + githubDirUrl + "/" + path.basename(article) + ")" + fs.appendFileSync(componentArticleFile, linkToDocument + "\n\n", { encoding: 'utf8' }); + + var linkToSource = "[Demo Source](" + githubDirUrl + ")" + fs.appendFileSync(componentArticleFile, linkToSource + "\n\n", { encoding: 'utf8' }); + + // Horizontal Line + fs.appendFileSync(componentArticleFile, "---\n\n", { encoding: 'utf8' }); }); + + // End.md + var subDirPath = overview.replace("/overview.md", ""); + var end = path.join(subDirPath, "end.md"); + var endContents = fs.readFileSync(end, { encoding: 'utf8' }); + fs.appendFileSync(componentArticleFile, endContents + "\n\n", { encoding: 'utf8' }); + }); } build(); \ No newline at end of file From e57fff2abba869ce6a4dade8637ef5ca0e0dd9d8 Mon Sep 17 00:00:00 2001 From: NickIliev Date: Thu, 4 Jul 2019 15:19:36 +0300 Subject: [PATCH 04/15] docs: BottomNav added styling and tips&tricks --- .../bottom-navigation-page.js | 6 ++-- .../bottom-navigation/styling/article.md | 1 + .../tips-and-tricks/article.md | 1 + .../tips-and-tricks/tips-and-tricks-page.xml | 34 +++++++++++++++++++ .../tips-and-tricks-ts-page.xml | 34 +++++++++++++++++++ package.json | 2 +- 6 files changed, 75 insertions(+), 3 deletions(-) create mode 100644 app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/article.md create mode 100644 app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-page.xml create mode 100644 app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-ts-page.xml diff --git a/app/ns-ui-widgets-category/bottom-navigation/bottom-navigation-page.js b/app/ns-ui-widgets-category/bottom-navigation/bottom-navigation-page.js index 569b2a0..2c862af 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/bottom-navigation-page.js +++ b/app/ns-ui-widgets-category/bottom-navigation/bottom-navigation-page.js @@ -4,13 +4,15 @@ const navigationLinks = [ new link("Usage", "ns-ui-widgets-category/bottom-navigation/usage/usage-page"), new link("Usage", "ns-ui-widgets-category/bottom-navigation/styling/styling-page"), new link("Events", "ns-ui-widgets-category/bottom-navigation/events/events-page"), - new link("Properties", "ns-ui-widgets-category/bottom-navigation/properties/properties-page") + new link("Properties", "ns-ui-widgets-category/bottom-navigation/properties/properties-page"), + new link("Tips & Tricks", "ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-page") ]; const navigationLinksTsc = [ new link("Usage", "ns-ui-widgets-category/bottom-navigation/usage/usage-ts-page"), new link("Usage", "ns-ui-widgets-category/bottom-navigation/styling/styling-ts-page"), new link("Events", "ns-ui-widgets-category/bottom-navigation/events/events-ts-page"), - new link("Properties", "ns-ui-widgets-category/bottom-navigation/properties/properties-page") + new link("Properties", "ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page"), + new link("Tips & Tricks", "ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-ts-page") ]; function onNavigatingTo(args) { diff --git a/app/ns-ui-widgets-category/bottom-navigation/styling/article.md b/app/ns-ui-widgets-category/bottom-navigation/styling/article.md index e69de29..a42b222 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/styling/article.md +++ b/app/ns-ui-widgets-category/bottom-navigation/styling/article.md @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/article.md b/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/article.md new file mode 100644 index 0000000..74eb414 --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/article.md @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-page.xml b/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-page.xml new file mode 100644 index 0000000..ac4e642 --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-page.xml @@ -0,0 +1,34 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-ts-page.xml b/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-ts-page.xml new file mode 100644 index 0000000..b452564 --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-ts-page.xml @@ -0,0 +1,34 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/package.json b/package.json index 2b819bf..3e521d4 100644 --- a/package.json +++ b/package.json @@ -30,7 +30,7 @@ }, "dependencies": { "nativescript-theme-core": "~1.0.4", - "tns-core-modules": "^6.0.0-rc-2019-07-03-223248-02" + "tns-core-modules": "^6.0.0-rc-2019-07-04-111808-02" }, "devDependencies": { "eslint": "~5.9.0", From 41e10aecdb69a3d664e501ca65345be475edf416 Mon Sep 17 00:00:00 2001 From: NickIliev Date: Thu, 4 Jul 2019 15:35:30 +0300 Subject: [PATCH 05/15] docs: bottom nav snippet IDs --- .../bottom-navigation/bottom-navigation-page.js | 4 ++-- app/ns-ui-widgets-category/bottom-navigation/metadata.md | 2 +- .../bottom-navigation/properties/properties-page.js | 4 ++-- .../bottom-navigation/properties/properties-ts-page.ts | 4 ++-- .../bottom-navigation/{styling => theming}/article.md | 0 .../{styling/styling-page.xml => theming/theming-page.xml} | 4 ++-- .../styling-ts-page.xml => theming/theming-ts-page.xml} | 4 ++-- .../tips-and-tricks/tips-and-tricks-page.xml | 4 ++-- .../tips-and-tricks/tips-and-tricks-ts-page.xml | 4 ++-- 9 files changed, 15 insertions(+), 15 deletions(-) rename app/ns-ui-widgets-category/bottom-navigation/{styling => theming}/article.md (100%) rename app/ns-ui-widgets-category/bottom-navigation/{styling/styling-page.xml => theming/theming-page.xml} (93%) rename app/ns-ui-widgets-category/bottom-navigation/{styling/styling-ts-page.xml => theming/theming-ts-page.xml} (92%) diff --git a/app/ns-ui-widgets-category/bottom-navigation/bottom-navigation-page.js b/app/ns-ui-widgets-category/bottom-navigation/bottom-navigation-page.js index 2c862af..a091834 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/bottom-navigation-page.js +++ b/app/ns-ui-widgets-category/bottom-navigation/bottom-navigation-page.js @@ -2,14 +2,14 @@ const ListViewLinksModel = require("../../links-view-model"); const link = require("../../link"); const navigationLinks = [ new link("Usage", "ns-ui-widgets-category/bottom-navigation/usage/usage-page"), - new link("Usage", "ns-ui-widgets-category/bottom-navigation/styling/styling-page"), + new link("Theming", "ns-ui-widgets-category/bottom-navigation/theming/theming-page"), new link("Events", "ns-ui-widgets-category/bottom-navigation/events/events-page"), new link("Properties", "ns-ui-widgets-category/bottom-navigation/properties/properties-page"), new link("Tips & Tricks", "ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-page") ]; const navigationLinksTsc = [ new link("Usage", "ns-ui-widgets-category/bottom-navigation/usage/usage-ts-page"), - new link("Usage", "ns-ui-widgets-category/bottom-navigation/styling/styling-ts-page"), + new link("Theming", "ns-ui-widgets-category/bottom-navigation/theming/theming-ts-page"), new link("Events", "ns-ui-widgets-category/bottom-navigation/events/events-ts-page"), new link("Properties", "ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page"), new link("Tips & Tricks", "ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-ts-page") diff --git a/app/ns-ui-widgets-category/bottom-navigation/metadata.md b/app/ns-ui-widgets-category/bottom-navigation/metadata.md index 877a767..1d315e4 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/metadata.md +++ b/app/ns-ui-widgets-category/bottom-navigation/metadata.md @@ -4,4 +4,4 @@ description: The NativeScript's BottomNavigation component provides a simple way position: 416 slug: bottom-navigation --- -example-order: usage, styling, properties, events, tips-and-tricks \ No newline at end of file +example-order: usage, theming, properties, events, tips-and-tricks \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/properties/properties-page.js b/app/ns-ui-widgets-category/bottom-navigation/properties/properties-page.js index 1226d9e..ea38b3b 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/properties/properties-page.js +++ b/app/ns-ui-widgets-category/bottom-navigation/properties/properties-page.js @@ -1,7 +1,7 @@ const Label = require("tns-core-modules/ui/label").Label; const StackLayout = require("tns-core-modules/ui/layouts/stack-layout").StackLayout; const Color = require("tns-core-modules/color/color").Color; -// >> bottom-navigation-events-js +// >> bottom-navigation-properties-js const TabStrip = require("tns-core-modules/ui/bottom-navigation").TabStrip; const TabStripItem = require("tns-core-modules/ui/bottom-navigation").TabStripItem; const TabContentItem = require("tns-core-modules/ui/bottom-navigation").TabContentItem; @@ -33,7 +33,7 @@ exports.onBottomNavLoaded = (args) => { */ console.log("bottomNav.nativeView: ", bottomNav.nativeView); }; -// << bottom-navigation-events-js +// << bottom-navigation-properties-js function createTabStrip() { // TabStrip diff --git a/app/ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page.ts b/app/ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page.ts index e153035..e637931 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page.ts +++ b/app/ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page.ts @@ -1,7 +1,7 @@ import { Label } from "tns-core-modules/ui/label"; import { StackLayout } from "tns-core-modules/ui/layouts/stack-layout"; import { Color } from "tns-core-modules/color/color"; -// >> bottom-navigation-events-tsc +// >> bottom-navigation-properties-tsc import { EventData } from "tns-core-modules/data/observable"; import { BottomNavigation, TabStrip, TabStripItem, TabContentItem } from "tns-core-modules/ui/bottom-navigation"; @@ -29,7 +29,7 @@ export function onBottomNavLoaded(args: EventData) { console.log(bottomNav.nativeView); } -// << bottom-navigation-events-tsc +// << bottom-navigation-properties-tsc function createTabStrip() { const tabStrip: TabStrip = new TabStrip(); diff --git a/app/ns-ui-widgets-category/bottom-navigation/styling/article.md b/app/ns-ui-widgets-category/bottom-navigation/theming/article.md similarity index 100% rename from app/ns-ui-widgets-category/bottom-navigation/styling/article.md rename to app/ns-ui-widgets-category/bottom-navigation/theming/article.md diff --git a/app/ns-ui-widgets-category/bottom-navigation/styling/styling-page.xml b/app/ns-ui-widgets-category/bottom-navigation/theming/theming-page.xml similarity index 93% rename from app/ns-ui-widgets-category/bottom-navigation/styling/styling-page.xml rename to app/ns-ui-widgets-category/bottom-navigation/theming/theming-page.xml index ac4e642..ab35901 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/styling/styling-page.xml +++ b/app/ns-ui-widgets-category/bottom-navigation/theming/theming-page.xml @@ -2,7 +2,7 @@ - + @@ -30,5 +30,5 @@ - + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/styling/styling-ts-page.xml b/app/ns-ui-widgets-category/bottom-navigation/theming/theming-ts-page.xml similarity index 92% rename from app/ns-ui-widgets-category/bottom-navigation/styling/styling-ts-page.xml rename to app/ns-ui-widgets-category/bottom-navigation/theming/theming-ts-page.xml index b452564..c23a0a8 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/styling/styling-ts-page.xml +++ b/app/ns-ui-widgets-category/bottom-navigation/theming/theming-ts-page.xml @@ -2,7 +2,7 @@ - + @@ -30,5 +30,5 @@ - + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-page.xml b/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-page.xml index ac4e642..c23a0a8 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-page.xml +++ b/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-page.xml @@ -2,7 +2,7 @@ - + @@ -30,5 +30,5 @@ - + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-ts-page.xml b/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-ts-page.xml index b452564..c23a0a8 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-ts-page.xml +++ b/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-ts-page.xml @@ -2,7 +2,7 @@ - + @@ -30,5 +30,5 @@ - + \ No newline at end of file From 6e500f3309e47779dde0c32ba90b75c3ace87038 Mon Sep 17 00:00:00 2001 From: NickIliev Date: Fri, 5 Jul 2019 10:59:28 +0300 Subject: [PATCH 06/15] docs: add Tabs examples --- app/main-page.js | 3 +- .../bottom-navigation/end.md | 2 +- .../events/events-ts-page.ts | 12 +-- .../bottom-navigation/overview.md | 4 +- .../properties/properties-ts-page.ts | 20 +++-- .../properties/properties-ts-page.xml | 2 +- app/ns-ui-widgets-category/tabs/end.md | 7 ++ .../tabs/events/article.md | 6 ++ .../tabs/events/events-page.js | 27 ++++++ .../tabs/events/events-page.xml | 29 ++++++ .../tabs/events/events-ts-page.ts | 29 ++++++ .../tabs/events/events-ts-page.xml | 29 ++++++ app/ns-ui-widgets-category/tabs/metadata.md | 7 ++ app/ns-ui-widgets-category/tabs/overview.md | 13 +++ .../tabs/properties/article.md | 20 +++++ .../tabs/properties/properties-page.js | 90 +++++++++++++++++++ .../tabs/properties/properties-page.xml | 7 ++ .../tabs/properties/properties-ts-page.ts | 88 ++++++++++++++++++ .../tabs/properties/properties-ts-page.xml | 8 ++ app/ns-ui-widgets-category/tabs/tabs-page.js | 28 ++++++ app/ns-ui-widgets-category/tabs/tabs-page.xml | 10 +++ .../tabs/theming/article.md | 1 + .../tabs/theming/theming-page.xml | 34 +++++++ .../tabs/theming/theming-ts-page.xml | 34 +++++++ .../tabs/tips-and-tricks/article.md | 1 + .../tips-and-tricks/tips-and-tricks-page.xml | 34 +++++++ .../tips-and-tricks-ts-page.xml | 34 +++++++ .../tabs/usage/article.md | 7 ++ .../tabs/usage/usage-page.xml | 34 +++++++ .../tabs/usage/usage-ts-page.xml | 34 +++++++ package.json | 11 +-- 31 files changed, 642 insertions(+), 23 deletions(-) create mode 100644 app/ns-ui-widgets-category/tabs/end.md create mode 100644 app/ns-ui-widgets-category/tabs/events/article.md create mode 100644 app/ns-ui-widgets-category/tabs/events/events-page.js create mode 100644 app/ns-ui-widgets-category/tabs/events/events-page.xml create mode 100644 app/ns-ui-widgets-category/tabs/events/events-ts-page.ts create mode 100644 app/ns-ui-widgets-category/tabs/events/events-ts-page.xml create mode 100644 app/ns-ui-widgets-category/tabs/metadata.md create mode 100644 app/ns-ui-widgets-category/tabs/overview.md create mode 100644 app/ns-ui-widgets-category/tabs/properties/article.md create mode 100644 app/ns-ui-widgets-category/tabs/properties/properties-page.js create mode 100644 app/ns-ui-widgets-category/tabs/properties/properties-page.xml create mode 100644 app/ns-ui-widgets-category/tabs/properties/properties-ts-page.ts create mode 100644 app/ns-ui-widgets-category/tabs/properties/properties-ts-page.xml create mode 100644 app/ns-ui-widgets-category/tabs/tabs-page.js create mode 100644 app/ns-ui-widgets-category/tabs/tabs-page.xml create mode 100644 app/ns-ui-widgets-category/tabs/theming/article.md create mode 100644 app/ns-ui-widgets-category/tabs/theming/theming-page.xml create mode 100644 app/ns-ui-widgets-category/tabs/theming/theming-ts-page.xml create mode 100644 app/ns-ui-widgets-category/tabs/tips-and-tricks/article.md create mode 100644 app/ns-ui-widgets-category/tabs/tips-and-tricks/tips-and-tricks-page.xml create mode 100644 app/ns-ui-widgets-category/tabs/tips-and-tricks/tips-and-tricks-ts-page.xml create mode 100644 app/ns-ui-widgets-category/tabs/usage/article.md create mode 100644 app/ns-ui-widgets-category/tabs/usage/usage-page.xml create mode 100644 app/ns-ui-widgets-category/tabs/usage/usage-ts-page.xml diff --git a/app/main-page.js b/app/main-page.js index 9f3dafc..0755626 100644 --- a/app/main-page.js +++ b/app/main-page.js @@ -51,7 +51,8 @@ const navigationLinks = [ new link("File System", "ns-framework-modules-category/file-system/file-system-page"), new link("Modal view", "ns-ui-category/modal-view/modal-view-examples-page"), new link("XML Parser", "ns-framework-modules-category/xml-parser/xml-parser-page"), - new link("BottomNavigation", "ns-ui-widgets-category/bottom-navigation/bottom-navigation-page") + new link("BottomNavigation", "ns-ui-widgets-category/bottom-navigation/bottom-navigation-page"), + new link("Tabs", "ns-ui-widgets-category/tabs/tabs-page") ]; function onNavigatingTo(args) { diff --git a/app/ns-ui-widgets-category/bottom-navigation/end.md b/app/ns-ui-widgets-category/bottom-navigation/end.md index 8a3983a..350673b 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/end.md +++ b/app/ns-ui-widgets-category/bottom-navigation/end.md @@ -1,4 +1,4 @@ -**API Reference for the** [BottomNavigation Class](http://docs.nativescript.org/api-reference/classes/_ui_bottom_navigation_.button.html) +**API Reference for the** [BottomNavigation Class](https://docs.nativescript.org/api-reference/classes/_ui_tab_navigation_bottom_navigation_.bottomnavigation) **Native Component** diff --git a/app/ns-ui-widgets-category/bottom-navigation/events/events-ts-page.ts b/app/ns-ui-widgets-category/bottom-navigation/events/events-ts-page.ts index 53c444a..17d33e8 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/events/events-ts-page.ts +++ b/app/ns-ui-widgets-category/bottom-navigation/events/events-ts-page.ts @@ -8,7 +8,7 @@ export function onNavigatingTo(args: EventData) { const page = args.object as Page; const vm = fromObject({ selectedIndex: 1 - }) + }); page.bindingContext = vm; } @@ -18,12 +18,12 @@ export function onBottomNavLoaded(args: EventData) { const bottomNavigation = args.object as BottomNavigation; // Using selectedIndexChanged - bottomNavigation.on(BottomNavigation.selectedIndexChangedEvent , (args: SelectedIndexChangedEventData) => { - const oldIndex: number = args.oldIndex; - const newIndex: number = args.newIndex; + bottomNavigation.on(BottomNavigation.selectedIndexChangedEvent, (data: SelectedIndexChangedEventData) => { + const oldIndex: number = data.oldIndex; + const newIndex: number = data.newIndex; console.log(`oldIndex: ${oldIndex}; newIndex: ${newIndex}`); (args.object).page.bindingContext.set("selectedIndex", newIndex); }); -}; -// << bottom-navigation-events-tsc \ No newline at end of file +} +// << bottom-navigation-events-tsc diff --git a/app/ns-ui-widgets-category/bottom-navigation/overview.md b/app/ns-ui-widgets-category/bottom-navigation/overview.md index 8168ebc..c74bbb2 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/overview.md +++ b/app/ns-ui-widgets-category/bottom-navigation/overview.md @@ -1,9 +1,11 @@ > **Disclaimer:** The `BottomNavigation` component is currently in **Beta** version. The component is being actively developed - use [the tracking issue](https://github.com/NativeScript/NativeScript/issues/6967) for details about the ongoing implementation. -The `BottomNavigation` component provides a simple way to navigate between different views while providing common UI for both iOS and Android platforms. The recommended scenario suitable for `BottomNavigation` is a high level navigaiton with 3 to 5 tabs each with separate function. For additional information and details about bottom navigation refer to [the Material Design guidelines](https://material.io/design/components/bottom-navigation.html#usage). +The `BottomNavigation` component provides a simple way to navigate between different views while providing common UI for both iOS and Android platforms. The recommended scenario suitable for `BottomNavigation` is a high level navigation with 3 to 5 tabs each with separate function. For additional information and details about bottom navigation refer to [the Material Design guidelines](https://material.io/design/components/bottom-navigation.html#usage). > **Note:** NativeScript 6 introduced two new UI components called `BottomNavigation` and `Tabs`. The idea behind them is to provide more control when building tab based UI, while powering the CSS styling, the icon font support and other specific functionalities. Prior to NativeScript 6, we had the `TabView` component which had top and bottom implementations with different behavoirs for the different platofrms and some styling limitations. With `BottomNavigaiton` and `Tabs` coomponents available, the `TabView` can be considered obsolete. +The `BottomNavigation` component roundup + Component Primary Objectives: - Used for High Level navigation. - Good for UX structure with 3 to 5 different options. diff --git a/app/ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page.ts b/app/ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page.ts index e637931..28f64dd 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page.ts +++ b/app/ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page.ts @@ -8,7 +8,7 @@ import { BottomNavigation, TabStrip, TabStripItem, TabContentItem } from "tns-co export function onBottomNavLoaded(args: EventData) { const bottomNav = args.object as BottomNavigation; - /* + /* Using the items property to assign array of TabContentItem componentns Note: The number of TabContentItem components should be equal to the number of TabStripItem components */ @@ -38,13 +38,21 @@ function createTabStrip() { for (let index = 0; index < 3; index++) { const item: TabStripItem = new TabStripItem(); /* - Using TabStripItem title property + Using TabStripItem title property */ - item.title = `Tab ${index === 0 ? "res://baseline_home_black_24pt" : (index === 1 ? "res://baseline_account_balance_black_24pt" : "res://baseline_search_black_24pt" )}`; + item.title = `Tab ${index === 0 + ? "res://baseline_home_black_24pt" + : (index === 1 + ? "res://baseline_account_balance_black_24pt" + : "res://baseline_search_black_24pt")}`; /* - Using TabStripItem title property + Using TabStripItem title property */ - item.iconSource = index === 0 ? "res://baseline_home_black_24pt" : (index === 1 ? "res://baseline_account_balance_black_24pt" : "res://baseline_search_black_24pt" ); + item.iconSource = index === 0 + ? "res://baseline_home_black_24pt" + : (index === 1 + ? "res://baseline_account_balance_black_24pt" + : "res://baseline_search_black_24pt"); tabStripItems.push(item); } tabStrip.items = tabStripItems; @@ -74,4 +82,4 @@ function createContent(index: number) { stack.addChild(label); return stack; -} \ No newline at end of file +} diff --git a/app/ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page.xml b/app/ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page.xml index dd4a7ff..f253aa1 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page.xml +++ b/app/ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page.xml @@ -4,5 +4,5 @@ - + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/tabs/end.md b/app/ns-ui-widgets-category/tabs/end.md new file mode 100644 index 0000000..8da8a14 --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/end.md @@ -0,0 +1,7 @@ +**API Reference for the** [Tabs Class](https://docs.nativescript.org/api-reference/classes/_ui_tab_view_.tabs) + +**Native Component** + +| Android | iOS | +|:----------------------|:---------| +| [ViewPager](https://developer.android.com/reference/android/support/v4/view/ViewPager) | [UIPageViewController](https://developer.apple.com/documentation/uikit/uipageviewcontroller?language=objc) | diff --git a/app/ns-ui-widgets-category/tabs/events/article.md b/app/ns-ui-widgets-category/tabs/events/article.md new file mode 100644 index 0000000..152b02e --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/events/article.md @@ -0,0 +1,6 @@ +- `selectedIndexChanged` - Event used to track the tabs interaction though the change of `selectedIndex` property of `Tabs` component. The event data is of type `SelectedIndexChangedEventData` extends `EventData` with two new properties: + - `oldIndex` - Provides the old selected index. + - `newIndwex` - Provides the new selected index. + + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/tabs/events/events-page.js b/app/ns-ui-widgets-category/tabs/events/events-page.js new file mode 100644 index 0000000..d0f6e26 --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/events/events-page.js @@ -0,0 +1,27 @@ +const fromObject = require("tns-core-modules/data/observable").fromObject; + +exports.onNavigatingTo = (args) => { + const page = args.object; + const vm = fromObject({ + selectedIndex: 1 + }); + + page.bindingContext = vm; +}; + +// >> tabs-events-js +exports.onTabsLoaded = (args) => { + // Using the loaded event to ger a reference to the Tabs + const tabs = args.object; + + // Using selectedIndexChanged + tabs.on("selectedIndexChanged", (args) => { + // args is of type SelectedIndexChangedEventData + const oldIndex = args.oldIndex; + const newIndex = args.newIndex; + console.log(`oldIndex: ${oldIndex}; newIndex: ${newIndex}`); + + args.object.page.bindingContext.set("selectedIndex", newIndex); + }); +}; +// << tabs-events-js diff --git a/app/ns-ui-widgets-category/tabs/events/events-page.xml b/app/ns-ui-widgets-category/tabs/events/events-page.xml new file mode 100644 index 0000000..a15a89b --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/events/events-page.xml @@ -0,0 +1,29 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/tabs/events/events-ts-page.ts b/app/ns-ui-widgets-category/tabs/events/events-ts-page.ts new file mode 100644 index 0000000..b0790cb --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/events/events-ts-page.ts @@ -0,0 +1,29 @@ +// >> tabs-events-tsc +import { EventData, fromObject } from "tns-core-modules/data/observable"; +import { Tabs, SelectedIndexChangedEventData } from "tns-core-modules/ui/tabs"; +// >> (hide) +import { Page } from "tns-core-modules/ui/page"; + +export function onNavigatingTo(args: EventData) { + const page = args.object as Page; + const vm = fromObject({ + selectedIndex: 1 + }); + + page.bindingContext = vm; +} +// << (hide) +export function onTabsLoaded(args: EventData) { + // Using the loaded event to ger a reference to the Tabs + const tabs = args.object as Tabs; + + // Using selectedIndexChanged + tabs.on(Tabs.selectedIndexChangedEvent, (data: SelectedIndexChangedEventData) => { + const oldIndex: number = data.oldIndex; + const newIndex: number = data.newIndex; + console.log(`oldIndex: ${oldIndex}; newIndex: ${newIndex}`); + + (args.object).page.bindingContext.set("selectedIndex", newIndex); + }); +} +// << tabs-events-tsc diff --git a/app/ns-ui-widgets-category/tabs/events/events-ts-page.xml b/app/ns-ui-widgets-category/tabs/events/events-ts-page.xml new file mode 100644 index 0000000..fd524cd --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/events/events-ts-page.xml @@ -0,0 +1,29 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/tabs/metadata.md b/app/ns-ui-widgets-category/tabs/metadata.md new file mode 100644 index 0000000..1cd1d3a --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/metadata.md @@ -0,0 +1,7 @@ +--- +title: Tabs +description: The NativeScript's Tabs component provides a simple way to navigate between different views while providing common UI for both iOS and Android platforms. The recommended scenario suitable for BottomNavigation is a mid level navigaiton with unlimited tabs and common functions.The component supports swipe gestures and preloading. +position: 418 +slug: tabs +--- +example-order: usage, theming, properties, events, tips-and-tricks \ No newline at end of file diff --git a/app/ns-ui-widgets-category/tabs/overview.md b/app/ns-ui-widgets-category/tabs/overview.md new file mode 100644 index 0000000..1f851f7 --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/overview.md @@ -0,0 +1,13 @@ +> **Disclaimer:** The `Tabs` component is currently in **Beta** version. The component is being actively developed - use [the tracking issue](https://github.com/NativeScript/NativeScript/issues/6967) for details about the ongoing implementation. + +The `Tabs` component provides a simple way to navigate between different views while providing common UI for both iOS and Android platforms. The recommended scenario suitable for `Tabs` is a mid level navigation. For additional information and details about bottom navigation refer to [the Material Design guidelines](https://material.io/design/components/tabs.html#usage). + +> **Note:** NativeScript 6 introduced two new UI components called `BottomNavigation` and `Tabs`. The idea behind them is to provide more control when building tab based UI, while powering the CSS styling, the icon font support and other specific functionalities. Prior to NativeScript 6, we had the `TabView` component which had top and bottom implementations with different behavoirs for the different platofrms and some styling limitations. With `BottomNavigaiton` and `Tabs` coomponents available, the `TabView` can be considered obsolete. + +The `Tabs` component roundup + +- Semantic: Mid Level Navigation +- Usage: Unlimited Tabs with common function +- Transitions: Slide Transition indicating the relative position to each other +- Gestures: Swipe Gesture +- Preloading: At least 1 to the sides (because of the swipe gesture) diff --git a/app/ns-ui-widgets-category/tabs/properties/article.md b/app/ns-ui-widgets-category/tabs/properties/article.md new file mode 100644 index 0000000..8aa8e9f --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/properties/article.md @@ -0,0 +1,20 @@ + +- `items: Array;` - Gets or sets the items of the BottomNavigation. + +- `tabStrip: TabStrip;` - Gets or sets the tab strip of the BottomNavigation. + +- `selectedIndex: number;` - Gets or sets the selectedIndex of the BottomNavigation. + +- `swipeEnabled: boolean;` - Gets or sets the swipe enabled state of the Tabs. + +- `offscreenTabLimit: number;` - Gets or sets the number of offscreen preloaded tabs of the Tabs. + +- `tabsPosition: "top" | "bottom";` - Gets or sets the position state of the Tabs. + +- `android: any` /* android.view.View */; - Gets the native [android widget](http://developer.android.com/reference/android/support/v4/view/ViewPager.html) that represents the user interface for this component. Valid only when running on Android OS. + +- `ios: any` /* UIPageViewController */; - Gets the native iOS [UIPageViewController](https://developer.apple.com/documentation/uikit/uipageviewcontroller?language=objc) that represents the user interface for this component. Valid only when running on iOS. + + + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/tabs/properties/properties-page.js b/app/ns-ui-widgets-category/tabs/properties/properties-page.js new file mode 100644 index 0000000..e6e6196 --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/properties/properties-page.js @@ -0,0 +1,90 @@ +const Label = require("tns-core-modules/ui/label").Label; +const StackLayout = require("tns-core-modules/ui/layouts/stack-layout").StackLayout; +const Color = require("tns-core-modules/color/color").Color; +// >> tabs-properties-js +const TabStrip = require("tns-core-modules/ui/tabs").TabStrip; +const TabStripItem = require("tns-core-modules/ui/tabs").TabStripItem; +const TabContentItem = require("tns-core-modules/ui/tabs").TabContentItem; + +exports.onTabsLoaded = (args) => { + // Tabs + const tabs = args.object; + /* + Using the items property to assign array of TabContentItem components (with content) + Note: The number of TabContentItem components should be equal to the number of TabStripItem components + */ + const tabContentItemsArray = createTabsContentArray(); + tabs.items = tabContentItemsArray; + + /* + Using the tabStrip property to createa a TabStrip with multiple TabStripItems (tabs) + Note: The number of TabStripItem components should be equal to the number of TabContentItem components + */ + const tabStrip = createTabStrip(); + tabs.tabStrip = tabStrip; + + /* + Using the Tabs properties + */ + tabs.selectedIndex = 1; + tabs.swipeEnabled = true; + tabs.offscreenTabLimit = 1; + tabs.tabsPosition = "top"; + + /* + Using the nativeView property (correspnding to tabs.ios or tabs.android depending on the used platform) + */ + console.log("tabs.nativeView: ", tabs.nativeView); +}; +// << tabs-properties-js + +function createTabStrip() { + // TabStrip + const tabStrip = new TabStrip(); + tabStrip.iosIconRenderingMode = "automatic"; // iOS only (automatic is the default value) + + // An array of TabStripItem + const tabStripItems = []; + for (let index = 0; index < 3; index++) { + // Each item is of type TabStripItem + const item = new TabStripItem(); + /* + Using TabStripItem title property + */ + item.title = `${index === 0 ? "Home" : (index === 1 ? "Account" : "Search")}`; + /* + Using TabStripItem title property + */ + item.iconSource = index === 0 ? "res://baseline_home_black_24pt" : (index === 1 ? "res://baseline_account_balance_black_24pt" : "res://baseline_search_black_24pt"); + tabStripItems.push(item); + } + tabStrip.items = tabStripItems; + + return tabStrip; +} + +function createTabsContentArray() { + // array of TabContentItem + const arr = []; + for (let index = 0; index < 3; index++) { + // item is of type TabContentItem + const item = new TabContentItem(); + // The createContent is a custom method that returns a StackLayout with a Label as a chils + item.view = createContent(index); + arr.push(item); + } + + return arr; +} + +function createContent(index) { + const label = new Label(); + label.text = `${index === 0 ? "Home" : (index === 1 ? "Account" : "Search")}`; + label.className = "h2 text-center"; + label.color = new Color("red"); + const stack = new StackLayout(); + stack.verticalAlignment = "middle"; + stack.addChild(label); + + return stack; +} diff --git a/app/ns-ui-widgets-category/tabs/properties/properties-page.xml b/app/ns-ui-widgets-category/tabs/properties/properties-page.xml new file mode 100644 index 0000000..9b090f9 --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/properties/properties-page.xml @@ -0,0 +1,7 @@ + + + + + + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/tabs/properties/properties-ts-page.ts b/app/ns-ui-widgets-category/tabs/properties/properties-ts-page.ts new file mode 100644 index 0000000..53c1b41 --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/properties/properties-ts-page.ts @@ -0,0 +1,88 @@ +import { Label } from "tns-core-modules/ui/label"; +import { StackLayout } from "tns-core-modules/ui/layouts/stack-layout"; +import { Color } from "tns-core-modules/color/color"; +// >> tabs-properties-tsc +import { EventData } from "tns-core-modules/data/observable"; +import { Tabs, TabStrip, TabStripItem, TabContentItem } from "tns-core-modules/ui/tabs"; + +export function onTabsLoaded(args: EventData) { + const tabs = args.object as Tabs; + + /* + Using the items property to assign array of TabContentItem componentns + Note: The number of TabContentItem components should be equal to the number of TabStripItem components + */ + const tabContentItemsArray: Array = createTabsContentArray(); + tabs.items = tabContentItemsArray; + + /* + Using the tabStrip property to createa a TabStrip with multiple TabStripItems (tabs) + Note: The number of TabStripItem components should be equal to the number of TabContentItem components + */ + const tabStrip = createTabStrip(); + tabs.tabStrip = tabStrip; + + /* + Using the Tabs properties + */ + tabs.selectedIndex = 1; + tabs.swipeEnabled = true; + tabs.offscreenTabLimit = 1; + tabs.tabsPosition = "top"; + + console.log(tabs.nativeView); +} +// << tabs-properties-tsc + +function createTabStrip() { + const tabStrip: TabStrip = new TabStrip(); + tabStrip.iosIconRenderingMode = "automatic"; // iOS only (automatic is the default value) + const tabStripItems: Array = []; + for (let index = 0; index < 3; index++) { + const item: TabStripItem = new TabStripItem(); + /* + Using TabStripItem title property + */ + item.title = `Tab ${index === 0 + ? "res://baseline_home_black_24pt" + : (index === 1 + ? "res://baseline_account_balance_black_24pt" + : "res://baseline_search_black_24pt")}`; + /* + Using TabStripItem title property + */ + item.iconSource = index === 0 + ? "res://baseline_home_black_24pt" + : (index === 1 + ? "res://baseline_account_balance_black_24pt" + : "res://baseline_search_black_24pt"); + tabStripItems.push(item); + } + tabStrip.items = tabStripItems; + + return tabStrip; +} + +function createTabsContentArray() { + const arr: Array = []; + for (let index = 0; index < 3; index++) { + const item: TabContentItem = new TabContentItem(); + // The createContent is a custom method that returns a StackLayout with a Label as a chils + item.view = createContent(index); + arr.push(item); + } + + return arr; +} + +function createContent(index: number) { + const label = new Label(); + label.text = `${index === 0 ? "Home" : (index === 1 ? "Account" : "Search")}`; + label.className = "h2 text-center"; + label.color = new Color("red"); + const stack = new StackLayout(); + stack.verticalAlignment = "middle"; + stack.addChild(label); + + return stack; +} diff --git a/app/ns-ui-widgets-category/tabs/properties/properties-ts-page.xml b/app/ns-ui-widgets-category/tabs/properties/properties-ts-page.xml new file mode 100644 index 0000000..06fa7ac --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/properties/properties-ts-page.xml @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/tabs/tabs-page.js b/app/ns-ui-widgets-category/tabs/tabs-page.js new file mode 100644 index 0000000..672c0fb --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/tabs-page.js @@ -0,0 +1,28 @@ +const ListViewLinksModel = require("../../links-view-model"); +const link = require("../../link"); +const navigationLinks = [ + new link("Usage", "ns-ui-widgets-category/tabs/usage/usage-page"), + new link("Theming", "ns-ui-widgets-category/tabs/theming/theming-page"), + new link("Events", "ns-ui-widgets-category/tabs/events/events-page"), + new link("Properties", "ns-ui-widgets-category/tabs/properties/properties-page"), + new link("Tips & Tricks", "ns-ui-widgets-category/tabs/tips-and-tricks/tips-and-tricks-page") +]; +const navigationLinksTsc = [ + new link("Usage", "ns-ui-widgets-category/tabs/usage/usage-ts-page"), + new link("Theming", "ns-ui-widgets-category/tabs/theming/theming-ts-page"), + new link("Events", "ns-ui-widgets-category/tabs/events/events-ts-page"), + new link("Properties", "ns-ui-widgets-category/tabs/properties/properties-ts-page"), + new link("Tips & Tricks", "ns-ui-widgets-category/tabs/tips-and-tricks/tips-and-tricks-ts-page") +]; + +function onNavigatingTo(args) { + const page = args.object; + + page.bindingContext = new ListViewLinksModel({ + links: navigationLinks, + actionBarTitle: args.context.title, + showTypeScriptExamples: false, + tsclinks: navigationLinksTsc + }); +} +exports.onNavigatingTo = onNavigatingTo; diff --git a/app/ns-ui-widgets-category/tabs/tabs-page.xml b/app/ns-ui-widgets-category/tabs/tabs-page.xml new file mode 100644 index 0000000..a69b8be --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/tabs-page.xml @@ -0,0 +1,10 @@ + + + + + + + diff --git a/app/ns-ui-widgets-category/tabs/theming/article.md b/app/ns-ui-widgets-category/tabs/theming/article.md new file mode 100644 index 0000000..a42b222 --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/theming/article.md @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/tabs/theming/theming-page.xml b/app/ns-ui-widgets-category/tabs/theming/theming-page.xml new file mode 100644 index 0000000..1efc16d --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/theming/theming-page.xml @@ -0,0 +1,34 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/tabs/theming/theming-ts-page.xml b/app/ns-ui-widgets-category/tabs/theming/theming-ts-page.xml new file mode 100644 index 0000000..12c1996 --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/theming/theming-ts-page.xml @@ -0,0 +1,34 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/tabs/tips-and-tricks/article.md b/app/ns-ui-widgets-category/tabs/tips-and-tricks/article.md new file mode 100644 index 0000000..74eb414 --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/tips-and-tricks/article.md @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/tabs/tips-and-tricks/tips-and-tricks-page.xml b/app/ns-ui-widgets-category/tabs/tips-and-tricks/tips-and-tricks-page.xml new file mode 100644 index 0000000..7bebd17 --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/tips-and-tricks/tips-and-tricks-page.xml @@ -0,0 +1,34 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/tabs/tips-and-tricks/tips-and-tricks-ts-page.xml b/app/ns-ui-widgets-category/tabs/tips-and-tricks/tips-and-tricks-ts-page.xml new file mode 100644 index 0000000..7bebd17 --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/tips-and-tricks/tips-and-tricks-ts-page.xml @@ -0,0 +1,34 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/tabs/usage/article.md b/app/ns-ui-widgets-category/tabs/usage/article.md new file mode 100644 index 0000000..8b6cdad --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/usage/article.md @@ -0,0 +1,7 @@ +The `Tabs` component contains two sub-components: +- The `TabStrip` which defines and rendres the bottom bar and its `TabStripItem` components. +- Multiple `TabContentItem` components which total number should be equal to the number of the tabs (`TabStripItem` components). Each `TabContentItem` acts as a container for your tab content. + + + +> **Note:** The number of `TabStripItem` components must be equal to the number of `tabContentItem` components. \ No newline at end of file diff --git a/app/ns-ui-widgets-category/tabs/usage/usage-page.xml b/app/ns-ui-widgets-category/tabs/usage/usage-page.xml new file mode 100644 index 0000000..5dd54ac --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/usage/usage-page.xml @@ -0,0 +1,34 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/tabs/usage/usage-ts-page.xml b/app/ns-ui-widgets-category/tabs/usage/usage-ts-page.xml new file mode 100644 index 0000000..c552eaa --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/usage/usage-ts-page.xml @@ -0,0 +1,34 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/package.json b/package.json index 3e521d4..3fea710 100644 --- a/package.json +++ b/package.json @@ -21,24 +21,21 @@ "license": "Apache-2.0", "nativescript": { "id": "org.nativescript.nativescriptsdkexamplesjs", - "tns-ios": { - "version": "6.0.0-2019-06-27-154632-01" - }, "tns-android": { - "version": "6.0.0-2019-06-28-082007-01" + "version": "6.0.0-rc-2019-07-04-174325-01" } }, "dependencies": { "nativescript-theme-core": "~1.0.4", - "tns-core-modules": "^6.0.0-rc-2019-07-04-111808-02" + "tns-core-modules": "rc" }, "devDependencies": { "eslint": "~5.9.0", "fs-extra": "^0.30.0", "markdown-snippet-injector": "^0.2.4", - "nativescript-dev-webpack": "^1.0.0-next-2019-06-28-135258-05", + "nativescript-dev-webpack": "next", "tar.gz": "^1.0.7", - "tns-platform-declarations": "next", + "tns-platform-declarations": "rc", "tslint": "5.11.0", "typescript": "3.4.1" }, From b29b570674e272acbdac3d06745e3391d3b44f42 Mon Sep 17 00:00:00 2001 From: NickIliev Date: Fri, 5 Jul 2019 14:23:55 +0300 Subject: [PATCH 07/15] docs: improve & extend the Tabs examples --- .../tabs/properties/properties-page.js | 15 ++++++++----- .../tabs/properties/properties-ts-page.ts | 21 ++++++++++++------- package.json | 3 +++ 3 files changed, 26 insertions(+), 13 deletions(-) diff --git a/app/ns-ui-widgets-category/tabs/properties/properties-page.js b/app/ns-ui-widgets-category/tabs/properties/properties-page.js index e6e6196..d921f41 100644 --- a/app/ns-ui-widgets-category/tabs/properties/properties-page.js +++ b/app/ns-ui-widgets-category/tabs/properties/properties-page.js @@ -30,7 +30,7 @@ exports.onTabsLoaded = (args) => { tabs.swipeEnabled = true; tabs.offscreenTabLimit = 1; tabs.tabsPosition = "top"; - + /* Using the nativeView property (correspnding to tabs.ios or tabs.android depending on the used platform) */ @@ -45,13 +45,13 @@ function createTabStrip() { // An array of TabStripItem const tabStripItems = []; - for (let index = 0; index < 3; index++) { + for (let index = 0; index < 5; index++) { // Each item is of type TabStripItem const item = new TabStripItem(); /* Using TabStripItem title property */ - item.title = `${index === 0 ? "Home" : (index === 1 ? "Account" : "Search")}`; + item.title = `Tab ${index + 1}`; /* Using TabStripItem title property */ @@ -66,7 +66,7 @@ function createTabStrip() { function createTabsContentArray() { // array of TabContentItem const arr = []; - for (let index = 0; index < 3; index++) { + for (let index = 0; index < 5; index++) { // item is of type TabContentItem const item = new TabContentItem(); // The createContent is a custom method that returns a StackLayout with a Label as a chils @@ -79,12 +79,17 @@ function createTabsContentArray() { function createContent(index) { const label = new Label(); - label.text = `${index === 0 ? "Home" : (index === 1 ? "Account" : "Search")}`; + label.text = `Content ${index + 1}`; label.className = "h2 text-center"; label.color = new Color("red"); + label.id = "label"; const stack = new StackLayout(); stack.verticalAlignment = "middle"; stack.addChild(label); + stack.on("loaded", (args) => { + console.log(`Loaded [${(args.object).getViewById("label").text}] - testing offscreenTabLimit property)`) + }); + return stack; } diff --git a/app/ns-ui-widgets-category/tabs/properties/properties-ts-page.ts b/app/ns-ui-widgets-category/tabs/properties/properties-ts-page.ts index 53c1b41..fb07f03 100644 --- a/app/ns-ui-widgets-category/tabs/properties/properties-ts-page.ts +++ b/app/ns-ui-widgets-category/tabs/properties/properties-ts-page.ts @@ -38,16 +38,12 @@ function createTabStrip() { const tabStrip: TabStrip = new TabStrip(); tabStrip.iosIconRenderingMode = "automatic"; // iOS only (automatic is the default value) const tabStripItems: Array = []; - for (let index = 0; index < 3; index++) { + for (let index = 0; index < 5; index++) { const item: TabStripItem = new TabStripItem(); /* Using TabStripItem title property */ - item.title = `Tab ${index === 0 - ? "res://baseline_home_black_24pt" - : (index === 1 - ? "res://baseline_account_balance_black_24pt" - : "res://baseline_search_black_24pt")}`; + item.title = `Tab ${index + 1}`; /* Using TabStripItem title property */ @@ -65,7 +61,7 @@ function createTabStrip() { function createTabsContentArray() { const arr: Array = []; - for (let index = 0; index < 3; index++) { + for (let index = 0; index < 5; index++) { const item: TabContentItem = new TabContentItem(); // The createContent is a custom method that returns a StackLayout with a Label as a chils item.view = createContent(index); @@ -77,12 +73,21 @@ function createTabsContentArray() { function createContent(index: number) { const label = new Label(); - label.text = `${index === 0 ? "Home" : (index === 1 ? "Account" : "Search")}`; + label.text = `Content ${index + 1}`; label.className = "h2 text-center"; label.color = new Color("red"); + label.id = "label"; const stack = new StackLayout(); stack.verticalAlignment = "middle"; stack.addChild(label); + stack.on("loaded", (args) => { + console.log(`Loaded [${(args.object).getViewById("label").text}]`) + }) + + stack.on("unloaded", (args) => { + console.log(`UNLOADED [${(args.object).getViewById("label").text}]`) + }) + return stack; } diff --git a/package.json b/package.json index 3fea710..83838c1 100644 --- a/package.json +++ b/package.json @@ -23,6 +23,9 @@ "id": "org.nativescript.nativescriptsdkexamplesjs", "tns-android": { "version": "6.0.0-rc-2019-07-04-174325-01" + }, + "tns-ios": { + "version": "6.0.0-rc-2019-07-04-095546-01" } }, "dependencies": { From 9672d803cf0c6749063a42692a446ccc3da73b02 Mon Sep 17 00:00:00 2001 From: NickIliev Date: Fri, 5 Jul 2019 16:37:00 +0300 Subject: [PATCH 08/15] docs: improved offScreenTabLimit demo --- .../tabs/properties/properties-page.js | 7 ++++++- .../tabs/properties/properties-ts-page.ts | 4 ++-- 2 files changed, 8 insertions(+), 3 deletions(-) diff --git a/app/ns-ui-widgets-category/tabs/properties/properties-page.js b/app/ns-ui-widgets-category/tabs/properties/properties-page.js index d921f41..e339911 100644 --- a/app/ns-ui-widgets-category/tabs/properties/properties-page.js +++ b/app/ns-ui-widgets-category/tabs/properties/properties-page.js @@ -87,8 +87,13 @@ function createContent(index) { stack.verticalAlignment = "middle"; stack.addChild(label); + // Testing the offscreenTabLimit property stack.on("loaded", (args) => { - console.log(`Loaded [${(args.object).getViewById("label").text}] - testing offscreenTabLimit property)`) + console.log(`>>> Loaded [${(args.object).getViewById("label").text}]`); + }); + + stack.on("unloaded", (args) => { + console.log(`>>> Unloaded [${(args.object).getViewById("label").text}]`); }); return stack; diff --git a/app/ns-ui-widgets-category/tabs/properties/properties-ts-page.ts b/app/ns-ui-widgets-category/tabs/properties/properties-ts-page.ts index fb07f03..7122898 100644 --- a/app/ns-ui-widgets-category/tabs/properties/properties-ts-page.ts +++ b/app/ns-ui-widgets-category/tabs/properties/properties-ts-page.ts @@ -82,11 +82,11 @@ function createContent(index: number) { stack.addChild(label); stack.on("loaded", (args) => { - console.log(`Loaded [${(args.object).getViewById("label").text}]`) + console.log(`Loaded [${(args.object).getViewById("label").text}]`); }) stack.on("unloaded", (args) => { - console.log(`UNLOADED [${(args.object).getViewById("label").text}]`) + console.log(`UNLOADED [${(args.object).getViewById("label").text}]`); }) return stack; From 200f15e51f7f0260f10da16af4506f4ca0972d29 Mon Sep 17 00:00:00 2001 From: NickIliev Date: Fri, 5 Jul 2019 16:47:52 +0300 Subject: [PATCH 09/15] docs: offScreenTabLimit description --- app/ns-ui-widgets-category/tabs/properties/article.md | 10 ++++++++++ .../tabs/properties/properties-page.js | 6 +++++- 2 files changed, 15 insertions(+), 1 deletion(-) diff --git a/app/ns-ui-widgets-category/tabs/properties/article.md b/app/ns-ui-widgets-category/tabs/properties/article.md index 8aa8e9f..1cf0da1 100644 --- a/app/ns-ui-widgets-category/tabs/properties/article.md +++ b/app/ns-ui-widgets-category/tabs/properties/article.md @@ -9,6 +9,16 @@ - `offscreenTabLimit: number;` - Gets or sets the number of offscreen preloaded tabs of the Tabs. + Example: + + - Let's assume that the TabContentItem[1] is selected (`selectedIndex = 1`) and `offscreenTabLimit` is set to 1. + + **Result:** The content for TabContentItem[0] and TabContentItem[2] will be pre-loaded. + + - Select TabContentItem[2] (`selectedIndex = 2`). + + **Result:** TabContentItem[0] will be unloaded and TabContentItem[3] will be pre-loaded. + - `tabsPosition: "top" | "bottom";` - Gets or sets the position state of the Tabs. - `android: any` /* android.view.View */; - Gets the native [android widget](http://developer.android.com/reference/android/support/v4/view/ViewPager.html) that represents the user interface for this component. Valid only when running on Android OS. diff --git a/app/ns-ui-widgets-category/tabs/properties/properties-page.js b/app/ns-ui-widgets-category/tabs/properties/properties-page.js index e339911..4f40422 100644 --- a/app/ns-ui-widgets-category/tabs/properties/properties-page.js +++ b/app/ns-ui-widgets-category/tabs/properties/properties-page.js @@ -28,8 +28,12 @@ exports.onTabsLoaded = (args) => { */ tabs.selectedIndex = 1; tabs.swipeEnabled = true; + + /* + offscreenTabLimit: Sets the number of TabContentItem to be preloaded. + */ tabs.offscreenTabLimit = 1; - tabs.tabsPosition = "top"; + tabs.tabsPosition = "top"; // Suppported values: 'top' or 'bottom' /* Using the nativeView property (correspnding to tabs.ios or tabs.android depending on the used platform) From b0b46b926bcc3ce7a2cac7cc8677978308103edb Mon Sep 17 00:00:00 2001 From: NickIliev Date: Mon, 8 Jul 2019 11:03:43 +0300 Subject: [PATCH 10/15] docs: add CSS example for BottomNavigaiton --- .../bottom-navigation/theming/article.md | 4 ++- .../theming/theming-page.css | 24 +++++++++++++++++ .../theming/theming-page.xml | 25 ++++++++--------- .../theming/theming-ts-page.css | 24 +++++++++++++++++ .../theming/theming-ts-page.xml | 27 ++++++++++--------- .../tabs/properties/properties-ts-page.ts | 4 +-- package.json | 2 +- 7 files changed, 81 insertions(+), 29 deletions(-) create mode 100644 app/ns-ui-widgets-category/bottom-navigation/theming/theming-page.css create mode 100644 app/ns-ui-widgets-category/bottom-navigation/theming/theming-ts-page.css diff --git a/app/ns-ui-widgets-category/bottom-navigation/theming/article.md b/app/ns-ui-widgets-category/bottom-navigation/theming/article.md index a42b222..d84cb92 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/theming/article.md +++ b/app/ns-ui-widgets-category/bottom-navigation/theming/article.md @@ -1 +1,3 @@ - \ No newline at end of file +> **Note:** - The integration with `nativescript-theme` and the support for custom CSS is being developed and is on its way. + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/theming/theming-page.css b/app/ns-ui-widgets-category/bottom-navigation/theming/theming-page.css new file mode 100644 index 0000000..bcf4faa --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/theming/theming-page.css @@ -0,0 +1,24 @@ +/* >> bottom-nav-theming-css */ +BottomNavigation.bottom-nav { + background-color: orangered; + color: gold; +} + +TabStripItem.tabstripitem-active { + background-color: teal; +} +/* The :active CSS pseudo selector support for TabStripItem */ +TabStripItem.tabstripitem-active:active { + background-color: yellowgreen; +} + +TabContentItem.first-tabcontent { + color: olive; +} +TabContentItem.second-tabcontent { + color: aquamarine; +} +TabContentItem.third-tabcontent { + color: antiquewhite; +} +/* << bottom-nav-theming-js */ \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/theming/theming-page.xml b/app/ns-ui-widgets-category/bottom-navigation/theming/theming-page.xml index ab35901..654748a 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/theming/theming-page.xml +++ b/app/ns-ui-widgets-category/bottom-navigation/theming/theming-page.xml @@ -3,29 +3,30 @@ - + + - + - - - + + + - - + + - + - + - + - + - + diff --git a/app/ns-ui-widgets-category/bottom-navigation/theming/theming-ts-page.css b/app/ns-ui-widgets-category/bottom-navigation/theming/theming-ts-page.css new file mode 100644 index 0000000..63c42fa --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/theming/theming-ts-page.css @@ -0,0 +1,24 @@ +BottomNavigation.bottom-nav { + background-color: orangered; + color: gold; +} + +TabStripItem.tabstripitem-active { + background-color: teal; +} + +TabStripItem.tabstripitem-active:active { + background-color: yellowgreen; +} + +TabContentItem.first-tabcontent { + color: olive; +} + +TabContentItem.second-tabcontent { + color: aquamarine; +} + +TabContentItem.third-tabcontent { + color: antiquewhite; +} \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/theming/theming-ts-page.xml b/app/ns-ui-widgets-category/bottom-navigation/theming/theming-ts-page.xml index c23a0a8..654748a 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/theming/theming-ts-page.xml +++ b/app/ns-ui-widgets-category/bottom-navigation/theming/theming-ts-page.xml @@ -3,32 +3,33 @@ - + + - + - - - + + + - - + + - + - + - + - + - + - + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/tabs/properties/properties-ts-page.ts b/app/ns-ui-widgets-category/tabs/properties/properties-ts-page.ts index 7122898..748357c 100644 --- a/app/ns-ui-widgets-category/tabs/properties/properties-ts-page.ts +++ b/app/ns-ui-widgets-category/tabs/properties/properties-ts-page.ts @@ -83,11 +83,11 @@ function createContent(index: number) { stack.on("loaded", (args) => { console.log(`Loaded [${(args.object).getViewById("label").text}]`); - }) + }); stack.on("unloaded", (args) => { console.log(`UNLOADED [${(args.object).getViewById("label").text}]`); - }) + }); return stack; } diff --git a/package.json b/package.json index 83838c1..bedd43f 100644 --- a/package.json +++ b/package.json @@ -30,7 +30,7 @@ }, "dependencies": { "nativescript-theme-core": "~1.0.4", - "tns-core-modules": "rc" + "tns-core-modules": "^6.1.0-next-2019-07-03-144356-02" }, "devDependencies": { "eslint": "~5.9.0", From e1c7add505ebbcf4f5a889135a5e2b501cf27094 Mon Sep 17 00:00:00 2001 From: NickIliev Date: Mon, 8 Jul 2019 11:09:53 +0300 Subject: [PATCH 11/15] docs: tabs CSS example --- .../bottom-navigation/theming/article.md | 2 +- .../theming/theming-page.css | 2 +- .../tips-and-tricks/article.md | 1 - .../tabs/theming/article.md | 4 ++- .../tabs/theming/theming-page.css | 26 ++++++++++++++++++ .../tabs/theming/theming-page.xml | 27 ++++++++++--------- .../tabs/theming/theming-ts-page.css | 24 +++++++++++++++++ .../tabs/tips-and-tricks/article.md | 1 - 8 files changed, 69 insertions(+), 18 deletions(-) create mode 100644 app/ns-ui-widgets-category/tabs/theming/theming-page.css create mode 100644 app/ns-ui-widgets-category/tabs/theming/theming-ts-page.css diff --git a/app/ns-ui-widgets-category/bottom-navigation/theming/article.md b/app/ns-ui-widgets-category/bottom-navigation/theming/article.md index d84cb92..e477487 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/theming/article.md +++ b/app/ns-ui-widgets-category/bottom-navigation/theming/article.md @@ -1,3 +1,3 @@ -> **Note:** - The integration with `nativescript-theme` and the support for custom CSS is being developed and is on its way. +> **Note:** - The integration with `nativescript-theme` and the support for custom CSS is currently under development and is on its way. \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/theming/theming-page.css b/app/ns-ui-widgets-category/bottom-navigation/theming/theming-page.css index bcf4faa..4dedf0e 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/theming/theming-page.css +++ b/app/ns-ui-widgets-category/bottom-navigation/theming/theming-page.css @@ -21,4 +21,4 @@ TabContentItem.second-tabcontent { TabContentItem.third-tabcontent { color: antiquewhite; } -/* << bottom-nav-theming-js */ \ No newline at end of file +/* << bottom-nav-theming-css */ \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/article.md b/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/article.md index 74eb414..e69de29 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/article.md +++ b/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/article.md @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/app/ns-ui-widgets-category/tabs/theming/article.md b/app/ns-ui-widgets-category/tabs/theming/article.md index a42b222..deb9f99 100644 --- a/app/ns-ui-widgets-category/tabs/theming/article.md +++ b/app/ns-ui-widgets-category/tabs/theming/article.md @@ -1 +1,3 @@ - \ No newline at end of file +> **Note:** - The integration with `nativescript-theme` and the support for custom CSS is currently under development and is on its way. + + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/tabs/theming/theming-page.css b/app/ns-ui-widgets-category/tabs/theming/theming-page.css new file mode 100644 index 0000000..27345b9 --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/theming/theming-page.css @@ -0,0 +1,26 @@ +/* >> tabs-theming-css */ +Tabs.tabs { + background-color: orangered; + color: gold; +} + +TabStripItem.tabstripitem-active { + background-color: teal; +} + +TabStripItem.tabstripitem-active:active { + background-color: yellowgreen; +} + +TabContentItem.first-tabcontent { + color: olive; +} + +TabContentItem.second-tabcontent { + color: aquamarine; +} + +TabContentItem.third-tabcontent { + color: antiquewhite; +} +/* << tabs-theming-css */ \ No newline at end of file diff --git a/app/ns-ui-widgets-category/tabs/theming/theming-page.xml b/app/ns-ui-widgets-category/tabs/theming/theming-page.xml index 1efc16d..8ebbc69 100644 --- a/app/ns-ui-widgets-category/tabs/theming/theming-page.xml +++ b/app/ns-ui-widgets-category/tabs/theming/theming-page.xml @@ -1,31 +1,32 @@ - + - + + - + - - - + + + - - + + - + - + - + - + - + diff --git a/app/ns-ui-widgets-category/tabs/theming/theming-ts-page.css b/app/ns-ui-widgets-category/tabs/theming/theming-ts-page.css new file mode 100644 index 0000000..8e28175 --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/theming/theming-ts-page.css @@ -0,0 +1,24 @@ +Tabs.tabs { + background-color: orangered; + color: gold; +} + +TabStripItem.tabstripitem-active { + background-color: teal; +} + +TabStripItem.tabstripitem-active:active { + background-color: yellowgreen; +} + +TabContentItem.first-tabcontent { + color: olive; +} + +TabContentItem.second-tabcontent { + color: aquamarine; +} + +TabContentItem.third-tabcontent { + color: antiquewhite; +} diff --git a/app/ns-ui-widgets-category/tabs/tips-and-tricks/article.md b/app/ns-ui-widgets-category/tabs/tips-and-tricks/article.md index 74eb414..e69de29 100644 --- a/app/ns-ui-widgets-category/tabs/tips-and-tricks/article.md +++ b/app/ns-ui-widgets-category/tabs/tips-and-tricks/article.md @@ -1 +0,0 @@ - \ No newline at end of file From a5685628e51d123ebaa7a6a4a6490c89f74bdbb7 Mon Sep 17 00:00:00 2001 From: NickIliev Date: Mon, 8 Jul 2019 11:39:47 +0300 Subject: [PATCH 12/15] docs: Tabs CSS example --- .../bottom-navigation/theming/theming-page.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/ns-ui-widgets-category/bottom-navigation/theming/theming-page.css b/app/ns-ui-widgets-category/bottom-navigation/theming/theming-page.css index 4dedf0e..3a074f6 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/theming/theming-page.css +++ b/app/ns-ui-widgets-category/bottom-navigation/theming/theming-page.css @@ -7,7 +7,7 @@ BottomNavigation.bottom-nav { TabStripItem.tabstripitem-active { background-color: teal; } -/* The :active CSS pseudo selector support for TabStripItem */ + TabStripItem.tabstripitem-active:active { background-color: yellowgreen; } From 7cfca4f949627760ad039f27c623a260ef702494 Mon Sep 17 00:00:00 2001 From: NickIliev Date: Mon, 15 Jul 2019 15:52:28 +0300 Subject: [PATCH 13/15] project migration to 6 + font icons for BottomNavigation --- .gitignore | 1 + .migration_backup/package.json | 14 ++++---- .../{ => src/main}/AndroidManifest.xml | 0 .../main/res}/drawable-hdpi/background.png | Bin .../{ => src/main/res}/drawable-hdpi/icon.png | Bin .../{ => src/main/res}/drawable-hdpi/logo.png | Bin .../{ => src/main/res}/drawable-hdpi/menu.png | Bin .../main/res}/drawable-ldpi/background.png | Bin .../{ => src/main/res}/drawable-ldpi/icon.png | Bin .../{ => src/main/res}/drawable-ldpi/logo.png | Bin .../{ => src/main/res}/drawable-ldpi/menu.png | Bin .../main/res}/drawable-mdpi/background.png | Bin .../{ => src/main/res}/drawable-mdpi/icon.png | Bin .../{ => src/main/res}/drawable-mdpi/logo.png | Bin .../{ => src/main/res}/drawable-mdpi/menu.png | Bin .../res}/drawable-nodpi/splash_screen.xml | 0 .../main/res}/drawable-xhdpi/background.png | Bin .../main/res}/drawable-xhdpi/icon.png | Bin .../main/res}/drawable-xhdpi/logo.png | Bin .../main/res}/drawable-xhdpi/menu.png | Bin .../main/res}/drawable-xxhdpi/background.png | Bin .../baseline_account_balance_black_18pt.png | Bin .../baseline_account_balance_black_24pt.png | Bin .../baseline_account_balance_black_36pt.png | Bin .../baseline_account_balance_black_48pt.png | Bin .../baseline_home_black_18pt.png | Bin .../baseline_home_black_24pt.png | Bin .../baseline_home_black_36pt.png | Bin .../baseline_home_black_48pt.png | Bin .../baseline_search_black_18pt.png | Bin .../baseline_search_black_24pt.png | Bin .../baseline_search_black_36pt.png | Bin .../baseline_search_black_48pt.png | Bin .../main/res}/drawable-xxhdpi/icon.png | Bin .../main/res}/drawable-xxhdpi/logo.png | Bin .../main/res}/drawable-xxhdpi/menu.png | Bin .../main/res}/drawable-xxxhdpi/background.png | Bin .../main/res}/drawable-xxxhdpi/icon.png | Bin .../main/res}/drawable-xxxhdpi/logo.png | Bin .../main/res}/drawable-xxxhdpi/menu.png | Bin .../{ => src/main/res}/values-v21/colors.xml | 0 .../{ => src/main/res}/values-v21/styles.xml | 0 .../{ => src/main/res}/values/colors.xml | 0 .../{ => src/main/res}/values/styles.xml | 0 app/app.js | 33 ------------------ .../icon-fonts/basics/basics-page.xml | 3 ++ .../bottom-navigation/events/events-page.xml | 1 - .../properties/properties-ts-page.ts | 6 +--- .../tips-and-tricks/article.md | 4 +++ .../tips-and-tricks/tips-and-tricks-page.css | 3 ++ .../tips-and-tricks/tips-and-tricks-page.xml | 18 +++++----- .../tips-and-tricks-ts-page.xml | 18 +++++----- nsconfig.json | 4 +-- package.json | 10 +++--- 54 files changed, 42 insertions(+), 73 deletions(-) rename app/App_Resources/Android/{ => src/main}/AndroidManifest.xml (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-hdpi/background.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-hdpi/icon.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-hdpi/logo.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-hdpi/menu.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-ldpi/background.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-ldpi/icon.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-ldpi/logo.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-ldpi/menu.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-mdpi/background.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-mdpi/icon.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-mdpi/logo.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-mdpi/menu.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-nodpi/splash_screen.xml (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-xhdpi/background.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-xhdpi/icon.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-xhdpi/logo.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-xhdpi/menu.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-xxhdpi/background.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-xxhdpi/baseline_account_balance_black_18pt.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-xxhdpi/baseline_account_balance_black_24pt.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-xxhdpi/baseline_account_balance_black_36pt.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-xxhdpi/baseline_account_balance_black_48pt.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-xxhdpi/baseline_home_black_18pt.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-xxhdpi/baseline_home_black_24pt.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-xxhdpi/baseline_home_black_36pt.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-xxhdpi/baseline_home_black_48pt.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-xxhdpi/baseline_search_black_18pt.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-xxhdpi/baseline_search_black_24pt.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-xxhdpi/baseline_search_black_36pt.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-xxhdpi/baseline_search_black_48pt.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-xxhdpi/icon.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-xxhdpi/logo.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-xxhdpi/menu.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-xxxhdpi/background.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-xxxhdpi/icon.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-xxxhdpi/logo.png (100%) rename app/App_Resources/Android/{ => src/main/res}/drawable-xxxhdpi/menu.png (100%) rename app/App_Resources/Android/{ => src/main/res}/values-v21/colors.xml (100%) rename app/App_Resources/Android/{ => src/main/res}/values-v21/styles.xml (100%) rename app/App_Resources/Android/{ => src/main/res}/values/colors.xml (100%) rename app/App_Resources/Android/{ => src/main/res}/values/styles.xml (100%) delete mode 100644 app/app.js create mode 100644 app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-page.css diff --git a/.gitignore b/.gitignore index 2b98f65..9225e3d 100644 --- a/.gitignore +++ b/.gitignore @@ -8,6 +8,7 @@ report app/**/*.map app/**/*-ts-*.js +.migration_backup/ .DS_Store **/*.log diff --git a/.migration_backup/package.json b/.migration_backup/package.json index a4c5b38..83838c1 100644 --- a/.migration_backup/package.json +++ b/.migration_backup/package.json @@ -22,23 +22,25 @@ "nativescript": { "id": "org.nativescript.nativescriptsdkexamplesjs", "tns-android": { - "version": "5.4.0" + "version": "6.0.0-rc-2019-07-04-174325-01" + }, + "tns-ios": { + "version": "6.0.0-rc-2019-07-04-095546-01" } }, "dependencies": { "nativescript-theme-core": "~1.0.4", - "tns-core-modules": "^5.3.1" + "tns-core-modules": "rc" }, "devDependencies": { "eslint": "~5.9.0", "fs-extra": "^0.30.0", "markdown-snippet-injector": "^0.2.4", - "nativescript-dev-typescript": "~0.9.0", - "nativescript-dev-webpack": "^0.21.0", + "nativescript-dev-webpack": "next", "tar.gz": "^1.0.7", - "tns-platform-declarations": "^5.3.1", + "tns-platform-declarations": "rc", "tslint": "5.11.0", - "typescript": "~3.1.6" + "typescript": "3.4.1" }, "scripts": { "lint": "eslint \"app/**/*.js\"", diff --git a/app/App_Resources/Android/AndroidManifest.xml b/app/App_Resources/Android/src/main/AndroidManifest.xml similarity index 100% rename from app/App_Resources/Android/AndroidManifest.xml rename to app/App_Resources/Android/src/main/AndroidManifest.xml diff --git a/app/App_Resources/Android/drawable-hdpi/background.png b/app/App_Resources/Android/src/main/res/drawable-hdpi/background.png similarity index 100% rename from app/App_Resources/Android/drawable-hdpi/background.png rename to app/App_Resources/Android/src/main/res/drawable-hdpi/background.png diff --git a/app/App_Resources/Android/drawable-hdpi/icon.png b/app/App_Resources/Android/src/main/res/drawable-hdpi/icon.png similarity index 100% rename from app/App_Resources/Android/drawable-hdpi/icon.png rename to app/App_Resources/Android/src/main/res/drawable-hdpi/icon.png diff --git a/app/App_Resources/Android/drawable-hdpi/logo.png b/app/App_Resources/Android/src/main/res/drawable-hdpi/logo.png similarity index 100% rename from app/App_Resources/Android/drawable-hdpi/logo.png rename to app/App_Resources/Android/src/main/res/drawable-hdpi/logo.png diff --git a/app/App_Resources/Android/drawable-hdpi/menu.png b/app/App_Resources/Android/src/main/res/drawable-hdpi/menu.png similarity index 100% rename from app/App_Resources/Android/drawable-hdpi/menu.png rename to app/App_Resources/Android/src/main/res/drawable-hdpi/menu.png diff --git a/app/App_Resources/Android/drawable-ldpi/background.png b/app/App_Resources/Android/src/main/res/drawable-ldpi/background.png similarity index 100% rename from app/App_Resources/Android/drawable-ldpi/background.png rename to app/App_Resources/Android/src/main/res/drawable-ldpi/background.png diff --git a/app/App_Resources/Android/drawable-ldpi/icon.png b/app/App_Resources/Android/src/main/res/drawable-ldpi/icon.png similarity index 100% rename from app/App_Resources/Android/drawable-ldpi/icon.png rename to app/App_Resources/Android/src/main/res/drawable-ldpi/icon.png diff --git a/app/App_Resources/Android/drawable-ldpi/logo.png b/app/App_Resources/Android/src/main/res/drawable-ldpi/logo.png similarity index 100% rename from app/App_Resources/Android/drawable-ldpi/logo.png rename to app/App_Resources/Android/src/main/res/drawable-ldpi/logo.png diff --git a/app/App_Resources/Android/drawable-ldpi/menu.png b/app/App_Resources/Android/src/main/res/drawable-ldpi/menu.png similarity index 100% rename from app/App_Resources/Android/drawable-ldpi/menu.png rename to app/App_Resources/Android/src/main/res/drawable-ldpi/menu.png diff --git a/app/App_Resources/Android/drawable-mdpi/background.png b/app/App_Resources/Android/src/main/res/drawable-mdpi/background.png similarity index 100% rename from app/App_Resources/Android/drawable-mdpi/background.png rename to app/App_Resources/Android/src/main/res/drawable-mdpi/background.png diff --git a/app/App_Resources/Android/drawable-mdpi/icon.png b/app/App_Resources/Android/src/main/res/drawable-mdpi/icon.png similarity index 100% rename from app/App_Resources/Android/drawable-mdpi/icon.png rename to app/App_Resources/Android/src/main/res/drawable-mdpi/icon.png diff --git a/app/App_Resources/Android/drawable-mdpi/logo.png b/app/App_Resources/Android/src/main/res/drawable-mdpi/logo.png similarity index 100% rename from app/App_Resources/Android/drawable-mdpi/logo.png rename to app/App_Resources/Android/src/main/res/drawable-mdpi/logo.png diff --git a/app/App_Resources/Android/drawable-mdpi/menu.png b/app/App_Resources/Android/src/main/res/drawable-mdpi/menu.png similarity index 100% rename from app/App_Resources/Android/drawable-mdpi/menu.png rename to app/App_Resources/Android/src/main/res/drawable-mdpi/menu.png diff --git a/app/App_Resources/Android/drawable-nodpi/splash_screen.xml b/app/App_Resources/Android/src/main/res/drawable-nodpi/splash_screen.xml similarity index 100% rename from app/App_Resources/Android/drawable-nodpi/splash_screen.xml rename to app/App_Resources/Android/src/main/res/drawable-nodpi/splash_screen.xml diff --git a/app/App_Resources/Android/drawable-xhdpi/background.png b/app/App_Resources/Android/src/main/res/drawable-xhdpi/background.png similarity index 100% rename from app/App_Resources/Android/drawable-xhdpi/background.png rename to app/App_Resources/Android/src/main/res/drawable-xhdpi/background.png diff --git a/app/App_Resources/Android/drawable-xhdpi/icon.png b/app/App_Resources/Android/src/main/res/drawable-xhdpi/icon.png similarity index 100% rename from app/App_Resources/Android/drawable-xhdpi/icon.png rename to app/App_Resources/Android/src/main/res/drawable-xhdpi/icon.png diff --git a/app/App_Resources/Android/drawable-xhdpi/logo.png b/app/App_Resources/Android/src/main/res/drawable-xhdpi/logo.png similarity index 100% rename from app/App_Resources/Android/drawable-xhdpi/logo.png rename to app/App_Resources/Android/src/main/res/drawable-xhdpi/logo.png diff --git a/app/App_Resources/Android/drawable-xhdpi/menu.png b/app/App_Resources/Android/src/main/res/drawable-xhdpi/menu.png similarity index 100% rename from app/App_Resources/Android/drawable-xhdpi/menu.png rename to app/App_Resources/Android/src/main/res/drawable-xhdpi/menu.png diff --git a/app/App_Resources/Android/drawable-xxhdpi/background.png b/app/App_Resources/Android/src/main/res/drawable-xxhdpi/background.png similarity index 100% rename from app/App_Resources/Android/drawable-xxhdpi/background.png rename to app/App_Resources/Android/src/main/res/drawable-xxhdpi/background.png diff --git a/app/App_Resources/Android/drawable-xxhdpi/baseline_account_balance_black_18pt.png b/app/App_Resources/Android/src/main/res/drawable-xxhdpi/baseline_account_balance_black_18pt.png similarity index 100% rename from app/App_Resources/Android/drawable-xxhdpi/baseline_account_balance_black_18pt.png rename to app/App_Resources/Android/src/main/res/drawable-xxhdpi/baseline_account_balance_black_18pt.png diff --git a/app/App_Resources/Android/drawable-xxhdpi/baseline_account_balance_black_24pt.png b/app/App_Resources/Android/src/main/res/drawable-xxhdpi/baseline_account_balance_black_24pt.png similarity index 100% rename from app/App_Resources/Android/drawable-xxhdpi/baseline_account_balance_black_24pt.png rename to app/App_Resources/Android/src/main/res/drawable-xxhdpi/baseline_account_balance_black_24pt.png diff --git a/app/App_Resources/Android/drawable-xxhdpi/baseline_account_balance_black_36pt.png b/app/App_Resources/Android/src/main/res/drawable-xxhdpi/baseline_account_balance_black_36pt.png similarity index 100% rename from app/App_Resources/Android/drawable-xxhdpi/baseline_account_balance_black_36pt.png rename to app/App_Resources/Android/src/main/res/drawable-xxhdpi/baseline_account_balance_black_36pt.png diff --git a/app/App_Resources/Android/drawable-xxhdpi/baseline_account_balance_black_48pt.png b/app/App_Resources/Android/src/main/res/drawable-xxhdpi/baseline_account_balance_black_48pt.png similarity index 100% rename from app/App_Resources/Android/drawable-xxhdpi/baseline_account_balance_black_48pt.png rename to app/App_Resources/Android/src/main/res/drawable-xxhdpi/baseline_account_balance_black_48pt.png diff --git a/app/App_Resources/Android/drawable-xxhdpi/baseline_home_black_18pt.png b/app/App_Resources/Android/src/main/res/drawable-xxhdpi/baseline_home_black_18pt.png similarity index 100% rename from app/App_Resources/Android/drawable-xxhdpi/baseline_home_black_18pt.png rename to app/App_Resources/Android/src/main/res/drawable-xxhdpi/baseline_home_black_18pt.png diff --git a/app/App_Resources/Android/drawable-xxhdpi/baseline_home_black_24pt.png b/app/App_Resources/Android/src/main/res/drawable-xxhdpi/baseline_home_black_24pt.png similarity index 100% rename from app/App_Resources/Android/drawable-xxhdpi/baseline_home_black_24pt.png rename to app/App_Resources/Android/src/main/res/drawable-xxhdpi/baseline_home_black_24pt.png diff --git a/app/App_Resources/Android/drawable-xxhdpi/baseline_home_black_36pt.png b/app/App_Resources/Android/src/main/res/drawable-xxhdpi/baseline_home_black_36pt.png similarity index 100% rename from app/App_Resources/Android/drawable-xxhdpi/baseline_home_black_36pt.png rename to app/App_Resources/Android/src/main/res/drawable-xxhdpi/baseline_home_black_36pt.png diff --git a/app/App_Resources/Android/drawable-xxhdpi/baseline_home_black_48pt.png b/app/App_Resources/Android/src/main/res/drawable-xxhdpi/baseline_home_black_48pt.png similarity index 100% rename from app/App_Resources/Android/drawable-xxhdpi/baseline_home_black_48pt.png rename to app/App_Resources/Android/src/main/res/drawable-xxhdpi/baseline_home_black_48pt.png diff --git a/app/App_Resources/Android/drawable-xxhdpi/baseline_search_black_18pt.png b/app/App_Resources/Android/src/main/res/drawable-xxhdpi/baseline_search_black_18pt.png similarity index 100% rename from app/App_Resources/Android/drawable-xxhdpi/baseline_search_black_18pt.png rename to app/App_Resources/Android/src/main/res/drawable-xxhdpi/baseline_search_black_18pt.png diff --git a/app/App_Resources/Android/drawable-xxhdpi/baseline_search_black_24pt.png b/app/App_Resources/Android/src/main/res/drawable-xxhdpi/baseline_search_black_24pt.png similarity index 100% rename from app/App_Resources/Android/drawable-xxhdpi/baseline_search_black_24pt.png rename to app/App_Resources/Android/src/main/res/drawable-xxhdpi/baseline_search_black_24pt.png diff --git a/app/App_Resources/Android/drawable-xxhdpi/baseline_search_black_36pt.png b/app/App_Resources/Android/src/main/res/drawable-xxhdpi/baseline_search_black_36pt.png similarity index 100% rename from app/App_Resources/Android/drawable-xxhdpi/baseline_search_black_36pt.png rename to app/App_Resources/Android/src/main/res/drawable-xxhdpi/baseline_search_black_36pt.png diff --git a/app/App_Resources/Android/drawable-xxhdpi/baseline_search_black_48pt.png b/app/App_Resources/Android/src/main/res/drawable-xxhdpi/baseline_search_black_48pt.png similarity index 100% rename from app/App_Resources/Android/drawable-xxhdpi/baseline_search_black_48pt.png rename to app/App_Resources/Android/src/main/res/drawable-xxhdpi/baseline_search_black_48pt.png diff --git a/app/App_Resources/Android/drawable-xxhdpi/icon.png b/app/App_Resources/Android/src/main/res/drawable-xxhdpi/icon.png similarity index 100% rename from app/App_Resources/Android/drawable-xxhdpi/icon.png rename to app/App_Resources/Android/src/main/res/drawable-xxhdpi/icon.png diff --git a/app/App_Resources/Android/drawable-xxhdpi/logo.png b/app/App_Resources/Android/src/main/res/drawable-xxhdpi/logo.png similarity index 100% rename from app/App_Resources/Android/drawable-xxhdpi/logo.png rename to app/App_Resources/Android/src/main/res/drawable-xxhdpi/logo.png diff --git a/app/App_Resources/Android/drawable-xxhdpi/menu.png b/app/App_Resources/Android/src/main/res/drawable-xxhdpi/menu.png similarity index 100% rename from app/App_Resources/Android/drawable-xxhdpi/menu.png rename to app/App_Resources/Android/src/main/res/drawable-xxhdpi/menu.png diff --git a/app/App_Resources/Android/drawable-xxxhdpi/background.png b/app/App_Resources/Android/src/main/res/drawable-xxxhdpi/background.png similarity index 100% rename from app/App_Resources/Android/drawable-xxxhdpi/background.png rename to app/App_Resources/Android/src/main/res/drawable-xxxhdpi/background.png diff --git a/app/App_Resources/Android/drawable-xxxhdpi/icon.png b/app/App_Resources/Android/src/main/res/drawable-xxxhdpi/icon.png similarity index 100% rename from app/App_Resources/Android/drawable-xxxhdpi/icon.png rename to app/App_Resources/Android/src/main/res/drawable-xxxhdpi/icon.png diff --git a/app/App_Resources/Android/drawable-xxxhdpi/logo.png b/app/App_Resources/Android/src/main/res/drawable-xxxhdpi/logo.png similarity index 100% rename from app/App_Resources/Android/drawable-xxxhdpi/logo.png rename to app/App_Resources/Android/src/main/res/drawable-xxxhdpi/logo.png diff --git a/app/App_Resources/Android/drawable-xxxhdpi/menu.png b/app/App_Resources/Android/src/main/res/drawable-xxxhdpi/menu.png similarity index 100% rename from app/App_Resources/Android/drawable-xxxhdpi/menu.png rename to app/App_Resources/Android/src/main/res/drawable-xxxhdpi/menu.png diff --git a/app/App_Resources/Android/values-v21/colors.xml b/app/App_Resources/Android/src/main/res/values-v21/colors.xml similarity index 100% rename from app/App_Resources/Android/values-v21/colors.xml rename to app/App_Resources/Android/src/main/res/values-v21/colors.xml diff --git a/app/App_Resources/Android/values-v21/styles.xml b/app/App_Resources/Android/src/main/res/values-v21/styles.xml similarity index 100% rename from app/App_Resources/Android/values-v21/styles.xml rename to app/App_Resources/Android/src/main/res/values-v21/styles.xml diff --git a/app/App_Resources/Android/values/colors.xml b/app/App_Resources/Android/src/main/res/values/colors.xml similarity index 100% rename from app/App_Resources/Android/values/colors.xml rename to app/App_Resources/Android/src/main/res/values/colors.xml diff --git a/app/App_Resources/Android/values/styles.xml b/app/App_Resources/Android/src/main/res/values/styles.xml similarity index 100% rename from app/App_Resources/Android/values/styles.xml rename to app/App_Resources/Android/src/main/res/values/styles.xml diff --git a/app/app.js b/app/app.js deleted file mode 100644 index de7f4f4..0000000 --- a/app/app.js +++ /dev/null @@ -1,33 +0,0 @@ -"use strict"; -Object.defineProperty(exports, "__esModule", { value: true }); -var application = require("tns-core-modules/application"); -var platformModule = require("tns-core-modules/platform"); -var applicationSettingsModule = require("tns-core-modules/application-settings"); -var deepLinkDataModule = require("./shared/deep-link-data"); -if (platformModule.isIOS) { - var mydelegate = require("./delegate/my-delegate"); - application.ios.delegate = mydelegate.MyDelegate; -} -function launchExample() { - var rootView = application.getRootView(); - if (applicationSettingsModule.hasKey("gotoexample")) { - var value = applicationSettingsModule.getString("gotoexample"); - if (value !== "") { - applicationSettingsModule.remove("gotoexample"); - rootView.navigate({ - moduleName: value, - clearHistory: true - }); - } - } -} -application.on(application.resumeEvent, function (args) { - if (args.android) { - var dld = new deepLinkDataModule.DeepLinkData("", args.android); - launchExample(); - } - else if (args.ios) { - launchExample(); - } -}); -application.run({ moduleName: "app-root" }); diff --git a/app/ns-ui-category/icon-fonts/basics/basics-page.xml b/app/ns-ui-category/icon-fonts/basics/basics-page.xml index 4c1f8b8..ab99188 100644 --- a/app/ns-ui-category/icon-fonts/basics/basics-page.xml +++ b/app/ns-ui-category/icon-fonts/basics/basics-page.xml @@ -23,5 +23,8 @@ diff --git a/app/ns-ui-widgets-category/bottom-navigation/events/events-page.xml b/app/ns-ui-widgets-category/bottom-navigation/events/events-page.xml index f486778..700802d 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/events/events-page.xml +++ b/app/ns-ui-widgets-category/bottom-navigation/events/events-page.xml @@ -4,7 +4,6 @@ - diff --git a/app/ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page.ts b/app/ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page.ts index 28f64dd..3a25486 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page.ts +++ b/app/ns-ui-widgets-category/bottom-navigation/properties/properties-ts-page.ts @@ -40,11 +40,7 @@ function createTabStrip() { /* Using TabStripItem title property */ - item.title = `Tab ${index === 0 - ? "res://baseline_home_black_24pt" - : (index === 1 - ? "res://baseline_account_balance_black_24pt" - : "res://baseline_search_black_24pt")}`; + item.title = `Tab ${index}`; /* Using TabStripItem title property */ diff --git a/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/article.md b/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/article.md index e69de29..8faab4c 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/article.md +++ b/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/article.md @@ -0,0 +1,4 @@ +### Icon Fonts in BottomNavigation + +Using icon fonts to customize the UI of your TabStripItem components is possible through the `font://` prefix for the `iconSource` property. + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-page.css b/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-page.css new file mode 100644 index 0000000..6f03f47 --- /dev/null +++ b/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-page.css @@ -0,0 +1,3 @@ +.font-size { + font-size: 14; +} \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-page.xml b/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-page.xml index c23a0a8..34011b1 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-page.xml +++ b/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-page.xml @@ -2,17 +2,15 @@ - - - - + + + - - - + + + - - + @@ -30,5 +28,5 @@ - + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-ts-page.xml b/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-ts-page.xml index c23a0a8..be09092 100644 --- a/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-ts-page.xml +++ b/app/ns-ui-widgets-category/bottom-navigation/tips-and-tricks/tips-and-tricks-ts-page.xml @@ -2,17 +2,15 @@ - - - - + + + - - - + + + - - + @@ -30,5 +28,5 @@ - + \ No newline at end of file diff --git a/nsconfig.json b/nsconfig.json index a6d7547..9e26dfe 100644 --- a/nsconfig.json +++ b/nsconfig.json @@ -1,3 +1 @@ -{ - "useLegacyWorkflow": false -} \ No newline at end of file +{} \ No newline at end of file diff --git a/package.json b/package.json index bedd43f..f4237f1 100644 --- a/package.json +++ b/package.json @@ -22,23 +22,23 @@ "nativescript": { "id": "org.nativescript.nativescriptsdkexamplesjs", "tns-android": { - "version": "6.0.0-rc-2019-07-04-174325-01" + "version": "6.0.0" }, "tns-ios": { - "version": "6.0.0-rc-2019-07-04-095546-01" + "version": "6.0.0" } }, "dependencies": { "nativescript-theme-core": "~1.0.4", - "tns-core-modules": "^6.1.0-next-2019-07-03-144356-02" + "tns-core-modules": "6.0.1" }, "devDependencies": { "eslint": "~5.9.0", "fs-extra": "^0.30.0", "markdown-snippet-injector": "^0.2.4", - "nativescript-dev-webpack": "next", + "nativescript-dev-webpack": "1.0.0", "tar.gz": "^1.0.7", - "tns-platform-declarations": "rc", + "tns-platform-declarations": "6.0.1", "tslint": "5.11.0", "typescript": "3.4.1" }, From 5dcc0562f91b6b9557f5373f78ee16dff37a878d Mon Sep 17 00:00:00 2001 From: NickIliev Date: Tue, 16 Jul 2019 11:40:48 +0300 Subject: [PATCH 14/15] docs: tabs tips & tricks article added (font icons) --- .migration_backup/package.json | 10 +++--- .../tabs/tips-and-tricks/article.md | 4 +++ .../tips-and-tricks/tips-and-tricks-page.css | 3 ++ .../tips-and-tricks/tips-and-tricks-page.xml | 20 +++++------ .../tips-and-tricks-ts-page.xml | 34 ------------------- package.json | 2 +- 6 files changed, 22 insertions(+), 51 deletions(-) create mode 100644 app/ns-ui-widgets-category/tabs/tips-and-tricks/tips-and-tricks-page.css delete mode 100644 app/ns-ui-widgets-category/tabs/tips-and-tricks/tips-and-tricks-ts-page.xml diff --git a/.migration_backup/package.json b/.migration_backup/package.json index 83838c1..f4237f1 100644 --- a/.migration_backup/package.json +++ b/.migration_backup/package.json @@ -22,23 +22,23 @@ "nativescript": { "id": "org.nativescript.nativescriptsdkexamplesjs", "tns-android": { - "version": "6.0.0-rc-2019-07-04-174325-01" + "version": "6.0.0" }, "tns-ios": { - "version": "6.0.0-rc-2019-07-04-095546-01" + "version": "6.0.0" } }, "dependencies": { "nativescript-theme-core": "~1.0.4", - "tns-core-modules": "rc" + "tns-core-modules": "6.0.1" }, "devDependencies": { "eslint": "~5.9.0", "fs-extra": "^0.30.0", "markdown-snippet-injector": "^0.2.4", - "nativescript-dev-webpack": "next", + "nativescript-dev-webpack": "1.0.0", "tar.gz": "^1.0.7", - "tns-platform-declarations": "rc", + "tns-platform-declarations": "6.0.1", "tslint": "5.11.0", "typescript": "3.4.1" }, diff --git a/app/ns-ui-widgets-category/tabs/tips-and-tricks/article.md b/app/ns-ui-widgets-category/tabs/tips-and-tricks/article.md index e69de29..9b0dde3 100644 --- a/app/ns-ui-widgets-category/tabs/tips-and-tricks/article.md +++ b/app/ns-ui-widgets-category/tabs/tips-and-tricks/article.md @@ -0,0 +1,4 @@ +### Icon Fonts in Tabs + +Using icon fonts to customize the UI of your TabStripItem components is possible through the `font://` prefix for the `iconSource` property. + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/tabs/tips-and-tricks/tips-and-tricks-page.css b/app/ns-ui-widgets-category/tabs/tips-and-tricks/tips-and-tricks-page.css new file mode 100644 index 0000000..6f03f47 --- /dev/null +++ b/app/ns-ui-widgets-category/tabs/tips-and-tricks/tips-and-tricks-page.css @@ -0,0 +1,3 @@ +.font-size { + font-size: 14; +} \ No newline at end of file diff --git a/app/ns-ui-widgets-category/tabs/tips-and-tricks/tips-and-tricks-page.xml b/app/ns-ui-widgets-category/tabs/tips-and-tricks/tips-and-tricks-page.xml index 7bebd17..1eb843a 100644 --- a/app/ns-ui-widgets-category/tabs/tips-and-tricks/tips-and-tricks-page.xml +++ b/app/ns-ui-widgets-category/tabs/tips-and-tricks/tips-and-tricks-page.xml @@ -1,18 +1,16 @@ - + - - - - + + + - - - + + + - - + @@ -30,5 +28,5 @@ - + \ No newline at end of file diff --git a/app/ns-ui-widgets-category/tabs/tips-and-tricks/tips-and-tricks-ts-page.xml b/app/ns-ui-widgets-category/tabs/tips-and-tricks/tips-and-tricks-ts-page.xml deleted file mode 100644 index 7bebd17..0000000 --- a/app/ns-ui-widgets-category/tabs/tips-and-tricks/tips-and-tricks-ts-page.xml +++ /dev/null @@ -1,34 +0,0 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - \ No newline at end of file diff --git a/package.json b/package.json index f4237f1..46f17d9 100644 --- a/package.json +++ b/package.json @@ -40,7 +40,7 @@ "tar.gz": "^1.0.7", "tns-platform-declarations": "6.0.1", "tslint": "5.11.0", - "typescript": "3.4.1" + "typescript": "3.4.5" }, "scripts": { "lint": "eslint \"app/**/*.js\"", From 410a1ee732e51dfb5fb0750bc227ae030153c8a1 Mon Sep 17 00:00:00 2001 From: NickIliev Date: Tue, 16 Jul 2019 12:04:04 +0300 Subject: [PATCH 15/15] resolve conflict --- app/app.js | 34 ++++++++++++++++++++++++++++++++++ 1 file changed, 34 insertions(+) create mode 100644 app/app.js diff --git a/app/app.js b/app/app.js new file mode 100644 index 0000000..4d735d6 --- /dev/null +++ b/app/app.js @@ -0,0 +1,34 @@ +"use strict"; +Object.defineProperty(exports, "__esModule", { value: true }); +var application = require("tns-core-modules/application"); +var platformModule = require("tns-core-modules/platform"); +var applicationSettingsModule = require("tns-core-modules/application-settings"); +var deepLinkDataModule = require("./shared/deep-link-data"); +if (platformModule.isIOS) { + var mydelegate = require("./delegate/my-delegate"); + application.ios.delegate = mydelegate.MyDelegate; +} +function launchExample() { + var rootView = application.getRootView(); + if (applicationSettingsModule.hasKey("gotoexample")) { + var value = applicationSettingsModule.getString("gotoexample"); + if (value !== "") { + applicationSettingsModule.remove("gotoexample"); + rootView.navigate({ + moduleName: value, + clearHistory: true + }); + } + } +} +application.on(application.resumeEvent, function (args) { + if (args.android) { + var dld = new deepLinkDataModule.DeepLinkData("", args.android); + launchExample(); + } + else if (args.ios) { + launchExample(); + } +}); +application.run({ moduleName: "app-root" }); +//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXBwLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiYXBwLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7O0FBS0EsMERBQTREO0FBQzVELDBEQUE0RDtBQUM1RCxpRkFBa0Y7QUFFbEYsSUFBTSxrQkFBa0IsR0FBRyxPQUFPLENBQUMseUJBQXlCLENBQUMsQ0FBQztBQUM5RCxJQUFJLGNBQWMsQ0FBQyxLQUFLLEVBQUU7SUFDdEIsSUFBTSxVQUFVLEdBQUcsT0FBTyxDQUFDLHdCQUF3QixDQUFDLENBQUM7SUFDckQsV0FBVyxDQUFDLEdBQUcsQ0FBQyxRQUFRLEdBQUcsVUFBVSxDQUFDLFVBQVUsQ0FBQztDQUNwRDtBQUVELFNBQVMsYUFBYTtJQUNsQixJQUFNLFFBQVEsR0FBa0IsV0FBVyxDQUFDLFdBQVcsRUFBRSxDQUFDO0lBQzFELElBQUkseUJBQXlCLENBQUMsTUFBTSxDQUFDLGFBQWEsQ0FBQyxFQUFFO1FBQ2pELElBQU0sS0FBSyxHQUFHLHlCQUF5QixDQUFDLFNBQVMsQ0FBQyxhQUFhLENBQUMsQ0FBQztRQUNqRSxJQUFJLEtBQUssS0FBSyxFQUFFLEVBQUU7WUFDZCx5QkFBeUIsQ0FBQyxNQUFNLENBQUMsYUFBYSxDQUFDLENBQUM7WUFDaEQsUUFBUSxDQUFDLFFBQVEsQ0FBQztnQkFDZCxVQUFVLEVBQUUsS0FBSztnQkFDakIsWUFBWSxFQUFFLElBQUk7YUFDckIsQ0FBQyxDQUFDO1NBQ047S0FDSjtBQUNMLENBQUM7QUFDRCxXQUFXLENBQUMsRUFBRSxDQUFDLFdBQVcsQ0FBQyxXQUFXLEVBQUUsVUFBQyxJQUFJO0lBQ3pDLElBQUksSUFBSSxDQUFDLE9BQU8sRUFBRTtRQUNkLElBQU0sR0FBRyxHQUFHLElBQUksa0JBQWtCLENBQUMsWUFBWSxDQUFDLEVBQUUsRUFBRSxJQUFJLENBQUMsT0FBTyxDQUFDLENBQUM7UUFDbEUsYUFBYSxFQUFFLENBQUM7S0FDbkI7U0FBTSxJQUFJLElBQUksQ0FBQyxHQUFHLEVBQUU7UUFDakIsYUFBYSxFQUFFLENBQUM7S0FDbkI7QUFDTCxDQUFDLENBQUMsQ0FBQztBQUNILFdBQVcsQ0FBQyxHQUFHLENBQUMsRUFBRSxVQUFVLEVBQUUsVUFBVSxFQUFFLENBQUMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbIi8qXG5JbiBOYXRpdmVTY3JpcHQsIHRoZSBhcHAuanMgZmlsZSBpcyB0aGUgZW50cnkgcG9pbnQgdG8geW91ciBhcHBsaWNhdGlvbi5cbllvdSBjYW4gdXNlIHRoaXMgZmlsZSB0byBwZXJmb3JtIGFwcC1sZXZlbCBpbml0aWFsaXphdGlvbiwgYnV0IHRoZSBwcmltYXJ5XG5wdXJwb3NlIG9mIHRoZSBmaWxlIGlzIHRvIHBhc3MgY29udHJvbCB0byB0aGUgYXBw4oCZcyBmaXJzdCBtb2R1bGUuXG4qL1xuaW1wb3J0ICogYXMgYXBwbGljYXRpb24gZnJvbSBcInRucy1jb3JlLW1vZHVsZXMvYXBwbGljYXRpb25cIjtcbmltcG9ydCAqIGFzIHBsYXRmb3JtTW9kdWxlIGZyb20gXCJ0bnMtY29yZS1tb2R1bGVzL3BsYXRmb3JtXCI7XG5pbXBvcnQgKiBhcyBhcHBsaWNhdGlvblNldHRpbmdzTW9kdWxlIGZyb21cInRucy1jb3JlLW1vZHVsZXMvYXBwbGljYXRpb24tc2V0dGluZ3NcIjtcbmltcG9ydCB7RnJhbWV9IGZyb20gXCJ0bnMtY29yZS1tb2R1bGVzL3VpL2ZyYW1lXCI7XG5jb25zdCBkZWVwTGlua0RhdGFNb2R1bGUgPSByZXF1aXJlKFwiLi9zaGFyZWQvZGVlcC1saW5rLWRhdGFcIik7XG5pZiAocGxhdGZvcm1Nb2R1bGUuaXNJT1MpIHtcbiAgICBjb25zdCBteWRlbGVnYXRlID0gcmVxdWlyZShcIi4vZGVsZWdhdGUvbXktZGVsZWdhdGVcIik7XG4gICAgYXBwbGljYXRpb24uaW9zLmRlbGVnYXRlID0gbXlkZWxlZ2F0ZS5NeURlbGVnYXRlO1xufVxuXG5mdW5jdGlvbiBsYXVuY2hFeGFtcGxlKCkge1xuICAgIGNvbnN0IHJvb3RWaWV3OiBGcmFtZSA9IDxGcmFtZT4gYXBwbGljYXRpb24uZ2V0Um9vdFZpZXcoKTtcbiAgICBpZiAoYXBwbGljYXRpb25TZXR0aW5nc01vZHVsZS5oYXNLZXkoXCJnb3RvZXhhbXBsZVwiKSkge1xuICAgICAgICBjb25zdCB2YWx1ZSA9IGFwcGxpY2F0aW9uU2V0dGluZ3NNb2R1bGUuZ2V0U3RyaW5nKFwiZ290b2V4YW1wbGVcIik7XG4gICAgICAgIGlmICh2YWx1ZSAhPT0gXCJcIikge1xuICAgICAgICAgICAgYXBwbGljYXRpb25TZXR0aW5nc01vZHVsZS5yZW1vdmUoXCJnb3RvZXhhbXBsZVwiKTtcbiAgICAgICAgICAgIHJvb3RWaWV3Lm5hdmlnYXRlKHtcbiAgICAgICAgICAgICAgICBtb2R1bGVOYW1lOiB2YWx1ZSxcbiAgICAgICAgICAgICAgICBjbGVhckhpc3Rvcnk6IHRydWVcbiAgICAgICAgICAgIH0pO1xuICAgICAgICB9XG4gICAgfVxufVxuYXBwbGljYXRpb24ub24oYXBwbGljYXRpb24ucmVzdW1lRXZlbnQsIChhcmdzKSA9PiB7XG4gICAgaWYgKGFyZ3MuYW5kcm9pZCkge1xuICAgICAgICBjb25zdCBkbGQgPSBuZXcgZGVlcExpbmtEYXRhTW9kdWxlLkRlZXBMaW5rRGF0YShcIlwiLCBhcmdzLmFuZHJvaWQpO1xuICAgICAgICBsYXVuY2hFeGFtcGxlKCk7XG4gICAgfSBlbHNlIGlmIChhcmdzLmlvcykge1xuICAgICAgICBsYXVuY2hFeGFtcGxlKCk7XG4gICAgfVxufSk7XG5hcHBsaWNhdGlvbi5ydW4oeyBtb2R1bGVOYW1lOiBcImFwcC1yb290XCIgfSk7XG5cbi8qXG5EbyBub3QgcGxhY2UgYW55IGNvZGUgYWZ0ZXIgdGhlIGFwcGxpY2F0aW9uIGhhcyBiZWVuIHN0YXJ0ZWQgYXMgaXQgd2lsbCBub3RcbmJlIGV4ZWN1dGVkIG9uIGlPUy5cbiovXG4iXX0= \ No newline at end of file