From bb409f17b5a3c8832af281dcd8472e636f77c1ad Mon Sep 17 00:00:00 2001 From: Nikolay Iliev Date: Tue, 7 May 2019 15:46:37 +0300 Subject: [PATCH 1/3] fix: broken ng component --- .../application-events/application-events.component.ts | 2 +- .../application/application-examples.module.ts | 4 +++- 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/app/ng-framework-modules-category/application/application-events/application-events.component.ts b/app/ng-framework-modules-category/application/application-events/application-events.component.ts index cb25ee48..aa663541 100644 --- a/app/ng-framework-modules-category/application/application-events/application-events.component.ts +++ b/app/ng-framework-modules-category/application/application-events/application-events.component.ts @@ -24,7 +24,7 @@ let launchListener, @Component({ moduleId: module.id, - templateUrl: "./app-checking-target.component.html" + templateUrl: "./application-events.component.html" }) export class ApplicationEventsComponent { public isItemVisible: boolean; diff --git a/app/ng-framework-modules-category/application/application-examples.module.ts b/app/ng-framework-modules-category/application/application-examples.module.ts index ec5873ae..ad3994f3 100644 --- a/app/ng-framework-modules-category/application/application-examples.module.ts +++ b/app/ng-framework-modules-category/application/application-examples.module.ts @@ -8,6 +8,7 @@ import { AppUsingIosExampleComponent } from "./app-using-ios-specifics/app-using import { ApplicationEventsComponent } from "./application-events/application-events.component"; import { TitleAndNavButtonModule } from "../../directives/title-and-nav-button.module"; + export const routerConfig = [ { path: "", @@ -47,7 +48,8 @@ export const routerConfig = [ ApplicationExamplesComponent, AppCheckingTargetExampleComponent, AppUsingAndroidExampleComponent, - AppUsingIosExampleComponent + AppUsingIosExampleComponent, + ApplicationEventsComponent ] }) From 3c2a9bb2b4d674e90850cd41aff6f8a5fad4116c Mon Sep 17 00:00:00 2001 From: Nikolay Iliev Date: Tue, 7 May 2019 16:58:25 +0300 Subject: [PATCH 2/3] docs: add new swtich styling property --- .../basic-switch/basic-switch.component.html | 16 ++++----- .../basic-switch/basic-switch.component.ts | 26 ++++++++++----- .../switch/disable-switch/article.md | 3 +- .../disable-switch.component.html | 22 ++++--------- .../switch/styling-switch/article.md | 7 ++-- .../switch/styling-switch/style.css | 14 ++++---- .../styling-switch.component.html | 33 +++++++------------ nsconfig.json | 3 ++ 8 files changed, 58 insertions(+), 66 deletions(-) create mode 100644 nsconfig.json diff --git a/app/ng-ui-widgets-category/switch/basic-switch/basic-switch.component.html b/app/ng-ui-widgets-category/switch/basic-switch/basic-switch.component.html index 91dadd72..f5aba8c8 100644 --- a/app/ng-ui-widgets-category/switch/basic-switch/basic-switch.component.html +++ b/app/ng-ui-widgets-category/switch/basic-switch/basic-switch.component.html @@ -1,12 +1,10 @@ - - + + + + + - - - - - - + - + \ No newline at end of file diff --git a/app/ng-ui-widgets-category/switch/basic-switch/basic-switch.component.ts b/app/ng-ui-widgets-category/switch/basic-switch/basic-switch.component.ts index 295e8bc0..99a5418c 100644 --- a/app/ng-ui-widgets-category/switch/basic-switch/basic-switch.component.ts +++ b/app/ng-ui-widgets-category/switch/basic-switch/basic-switch.component.ts @@ -1,6 +1,6 @@ -// >> switch-event-handle-code import { Component } from "@angular/core"; import { Switch } from "tns-core-modules/ui/switch"; +import { EventData } from "tns-core-modules/data/observable"; @Component({ moduleId: module.id, @@ -8,11 +8,11 @@ import { Switch } from "tns-core-modules/ui/switch"; styleUrls: ["./../switch.style.css"], }) export class BasicSwitchComponent { - public firstSwitchState = "OFF"; - public secondSwitchState = "ON"; + firstSwitchState = "OFF"; + secondSwitchState = "ON"; - public onFirstChecked(args) { - let firstSwitch = args.object; + onFirstChecked(args) { + let firstSwitch = args.object as Switch; if (firstSwitch.checked) { this.firstSwitchState = "ON"; } else { @@ -20,13 +20,21 @@ export class BasicSwitchComponent { } } - public onSecondChecked(args) { - let secondSwitch = args.object; - if (secondSwitch.checked) { + // >> switch-event-handle-code + // import { Switch } from "tns-core-modules/ui/switch"; + // import { EventData } from "tns-core-modules/data/observable"; + + onCheckedChange(args: EventData) { + let mySwitch = args.object as Switch; + let isChecked = mySwitch.checked; // boolean + // >> (hide) + if (isChecked) { this.secondSwitchState = "ON"; } else { this.secondSwitchState = "OFF"; } + // << (hide) } + // << switch-event-handle-code } -// << switch-event-handle-code + diff --git a/app/ng-ui-widgets-category/switch/disable-switch/article.md b/app/ng-ui-widgets-category/switch/disable-switch/article.md index d8a78538..f02d0fbd 100644 --- a/app/ng-ui-widgets-category/switch/disable-switch/article.md +++ b/app/ng-ui-widgets-category/switch/disable-switch/article.md @@ -1,3 +1,2 @@ -Set `Switch` in `HTML` code. -Disable `Switch` control via setting `isEnabled` property to false. +Disabling the `Switch` control via setting its `isEnabled` boolean property to `false`. \ No newline at end of file diff --git a/app/ng-ui-widgets-category/switch/disable-switch/disable-switch.component.html b/app/ng-ui-widgets-category/switch/disable-switch/disable-switch.component.html index dc57cc4f..0da9a063 100644 --- a/app/ng-ui-widgets-category/switch/disable-switch/disable-switch.component.html +++ b/app/ng-ui-widgets-category/switch/disable-switch/disable-switch.component.html @@ -1,17 +1,9 @@ - - - - - - + + + + - - - - + + \ No newline at end of file diff --git a/app/ng-ui-widgets-category/switch/styling-switch/article.md b/app/ng-ui-widgets-category/switch/styling-switch/article.md index e9bba91f..21e8d8c3 100644 --- a/app/ng-ui-widgets-category/switch/styling-switch/article.md +++ b/app/ng-ui-widgets-category/switch/styling-switch/article.md @@ -1,5 +1,6 @@ -HTML +The styling properties for the `Swtich` control are as follows: +- `color`- Controls the handle color +- `bacxkgroundColor`(`background-color` in CSS) - Controls the background color while the switch is in **ON** state. + - `offBackgroundColor` (`off-background-color` in CSS) - Controls the background color while the switch is in **OFF** state. - -CSS \ No newline at end of file diff --git a/app/ng-ui-widgets-category/switch/styling-switch/style.css b/app/ng-ui-widgets-category/switch/styling-switch/style.css index af69b631..e6de0b6b 100644 --- a/app/ng-ui-widgets-category/switch/styling-switch/style.css +++ b/app/ng-ui-widgets-category/switch/styling-switch/style.css @@ -1,14 +1,14 @@ /* >> switch-style-css */ -.firstSwitchStyle{ - background-color: #FFFF66; -} - .secondSwitchStyle{ - background-color: #CCFFFF; + color: yellow; + background-color: green; + off-background-color: red; } .thirdSwitchStyle{ - opacity: 0.5; - background-color: #8C489F; + opacity: 0.8; + color: darkblue; + background-color: lightseagreen; + off-background-color: orangered; } /* << switch-style-css */ \ No newline at end of file diff --git a/app/ng-ui-widgets-category/switch/styling-switch/styling-switch.component.html b/app/ng-ui-widgets-category/switch/styling-switch/styling-switch.component.html index 78a26f0c..b007dd1c 100644 --- a/app/ng-ui-widgets-category/switch/styling-switch/styling-switch.component.html +++ b/app/ng-ui-widgets-category/switch/styling-switch/styling-switch.component.html @@ -1,22 +1,13 @@ - - - - - - - - - - - - - - - + + + + + + + + + + + + \ No newline at end of file diff --git a/nsconfig.json b/nsconfig.json new file mode 100644 index 00000000..a6d75472 --- /dev/null +++ b/nsconfig.json @@ -0,0 +1,3 @@ +{ + "useLegacyWorkflow": false +} \ No newline at end of file From 0d6b3a1b441ceff25f9b8318830df7d6b1453037 Mon Sep 17 00:00:00 2001 From: Nikolay Iliev Date: Wed, 8 May 2019 08:24:22 +0300 Subject: [PATCH 3/3] fix: typo --- app/ng-ui-widgets-category/switch/styling-switch/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/app/ng-ui-widgets-category/switch/styling-switch/article.md b/app/ng-ui-widgets-category/switch/styling-switch/article.md index 21e8d8c3..bb60d22a 100644 --- a/app/ng-ui-widgets-category/switch/styling-switch/article.md +++ b/app/ng-ui-widgets-category/switch/styling-switch/article.md @@ -1,6 +1,6 @@ The styling properties for the `Swtich` control are as follows: - `color`- Controls the handle color -- `bacxkgroundColor`(`background-color` in CSS) - Controls the background color while the switch is in **ON** state. +- `bacxgroundColor`(`background-color` in CSS) - Controls the background color while the switch is in **ON** state. - `offBackgroundColor` (`off-background-color` in CSS) - Controls the background color while the switch is in **OFF** state. \ No newline at end of file