Skip to content

Commit fbe053d

Browse files
committed
Action bar directives
1 parent ebfd463 commit fbe053d

File tree

12 files changed

+489
-76
lines changed

12 files changed

+489
-76
lines changed

ng-sample/.vscode/launch.json

Lines changed: 89 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,89 @@
1+
{
2+
"version": "0.2.0",
3+
"configurations": [
4+
{
5+
"name": "Launch on iOS Device",
6+
"type": "nativescript",
7+
"platform": "ios",
8+
"request": "launch",
9+
"appRoot": ".",
10+
"sourceMaps": true,
11+
"diagnosticLogging": true,
12+
"stopOnEntry": true,
13+
"emulator": false
14+
},
15+
{
16+
"name": "Attach on iOS Device",
17+
"type": "nativescript",
18+
"platform": "ios",
19+
"request": "attach",
20+
"appRoot": ".",
21+
"sourceMaps": true,
22+
"diagnosticLogging": true,
23+
"emulator": false
24+
},
25+
{
26+
"name": "Launch on iOS Emulator",
27+
"type": "nativescript",
28+
"platform": "ios",
29+
"request": "launch",
30+
"appRoot": ".",
31+
"sourceMaps": true,
32+
"diagnosticLogging": true,
33+
"stopOnEntry": true,
34+
"emulator": true
35+
},
36+
{
37+
"name": "Attach on iOS Emulator",
38+
"type": "nativescript",
39+
"platform": "ios",
40+
"request": "attach",
41+
"appRoot": ".",
42+
"sourceMaps": true,
43+
"diagnosticLogging": true,
44+
"emulator": true
45+
},
46+
{
47+
"name": "Launch on Android Device",
48+
"type": "nativescript",
49+
"platform": "android",
50+
"request": "launch",
51+
"appRoot": ".",
52+
"sourceMaps": true,
53+
"diagnosticLogging": true,
54+
"stopOnEntry": true,
55+
"emulator": false
56+
},
57+
{
58+
"name": "Launch on Android Emulator",
59+
"type": "nativescript",
60+
"platform": "android",
61+
"request": "launch",
62+
"appRoot": ".",
63+
"sourceMaps": true,
64+
"diagnosticLogging": true,
65+
"stopOnEntry": true,
66+
"emulator": true
67+
},
68+
{
69+
"name": "Attach on Android Device",
70+
"type": "nativescript",
71+
"platform": "android",
72+
"request": "attach",
73+
"appRoot": ".",
74+
"sourceMaps": false,
75+
"diagnosticLogging": true,
76+
"emulator": false
77+
},
78+
{
79+
"name": "Attach on Android Emulator",
80+
"type": "nativescript",
81+
"platform": "android",
82+
"request": "attach",
83+
"appRoot": ".",
84+
"sourceMaps": false,
85+
"diagnosticLogging": true,
86+
"emulator": true
87+
}
88+
]
89+
}

ng-sample/.vscode/settings.json

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
// Place your settings in this file to overwrite default and user settings.
2+
{
3+
"files.exclude": {
4+
"**/*.js": {
5+
"when": "$(basename).ts"
6+
},
7+
"**/*.js.map": {},
8+
"platforms/**": {},
9+
"hooks/**": {}
10+
}
11+
}

ng-sample/app/app.ts

Lines changed: 13 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -11,7 +11,9 @@ import { NS_ROUTER_PROVIDERS, routerTraceCategory } from "./nativescript-angular
1111
import { rendererTraceCategory } from "./nativescript-angular/renderer";
1212

1313
import trace = require("trace");
14-
trace.setCategories(routerTraceCategory + ", " + rendererTraceCategory);
14+
// trace.setCategories(routerTraceCategory + ", " + rendererTraceCategory);
15+
// trace.setCategories(rendererTraceCategory);
16+
// trace.setCategories(routerTraceCategory);
1517
trace.enable();
1618

1719
import {RendererTest} from './examples/renderer-test';
@@ -20,11 +22,16 @@ import {ListTest} from './examples/list/list-test';
2022
import {ListTestAsync} from "./examples/list/list-test-async";
2123
import {ImageTest} from "./examples/image/image-test";
2224
import {NavigationTest} from "./examples/navigation/navigation-test";
25+
import {ActionBarTest} from "./examples/action-bar/action-bar-test";
2326

2427

25-
//nativeScriptBootstrap(RendererTest);
26-
//nativeScriptBootstrap(Benchmark);
27-
//nativeScriptBootstrap(ListTest);
28-
nativeScriptBootstrap(ListTestAsync);
28+
// nativeScriptBootstrap(RendererTest);
29+
// nativeScriptBootstrap(Benchmark);
30+
// nativeScriptBootstrap(ListTest);
31+
// nativeScriptBootstrap(ListTestAsync);
32+
// nativeScriptBootstrap(Benchmark);
33+
// nativeScriptBootstrap(ListTest);
34+
// nativeScriptBootstrap(ListTestAsync);
2935
// nativeScriptBootstrap(ImageTest);
30-
//nativeScriptBootstrap(NavigationTest, [NS_ROUTER_PROVIDERS]);
36+
// nativeScriptBootstrap(NavigationTest, [NS_ROUTER_PROVIDERS]);
37+
nativeScriptBootstrap(ActionBarTest, [NS_ROUTER_PROVIDERS], { startPageActionBarHidden: false });
Lines changed: 90 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,90 @@
1+
import {Component} from 'angular2/core';
2+
import {RouteConfig} from 'angular2/router';
3+
import { Page} from "ui/page";
4+
import {NS_ROUTER_DIRECTIVES, NS_ROUTER_PROVIDERS} from "../../nativescript-angular/router/ns-router";
5+
import {NS_DIRECTIVES} from "../../nativescript-angular/directives/ns-directives";
6+
7+
@Component({
8+
selector: "first",
9+
directives: [NS_ROUTER_DIRECTIVES, NS_DIRECTIVES],
10+
template: `
11+
<ActionBar title="Custom Title">
12+
<ActionItem *ngIf="show" text="action" (tap)="onTap()"></ActionItem>
13+
</ActionBar>
14+
15+
<StackLayout verticalAlignment="center">
16+
<Button [text]="show ? 'hide' : 'show'" (tap)="show = !show"></Button>
17+
<Button text="Start" [nsRouterLink]="['/Second']"></Button>
18+
</StackLayout>
19+
`,
20+
})
21+
class FirstComponent {
22+
public show: boolean = true;
23+
onTap() {
24+
console.log("FirstComponent.Tapped!");
25+
}
26+
}
27+
28+
29+
@Component({
30+
selector: "nested-componenet",
31+
directives: [NS_ROUTER_DIRECTIVES, NS_DIRECTIVES],
32+
template: `
33+
34+
<action-bar-scope>
35+
<ActionItem *ngIf="show" text="action" (tap)="onTap()"></ActionItem>
36+
</action-bar-scope>
37+
38+
<StackLayout verticalAlignment="center">
39+
<Button [text]="show ? 'hide' : 'show'" (tap)="show = !show"></Button>
40+
</StackLayout>
41+
`,
42+
})
43+
class NestedComponent {
44+
public show: boolean = true;
45+
46+
onTap() {
47+
console.log("NestedComponent.Tapped!");
48+
}
49+
}
50+
51+
@Component({
52+
selector: "second",
53+
directives: [NS_ROUTER_DIRECTIVES, NS_DIRECTIVES, NestedComponent],
54+
template: `
55+
<ActionBar title="Second Page Title">
56+
<NavigationButton text="First" android.systemIcon="ic_menu_back"></NavigationButton>
57+
<ActionItem text="TapMe" (tap)="onTap()"></ActionItem>
58+
</ActionBar>
59+
60+
<StackLayout verticalAlignment="center">
61+
<Label text="Second Page is Here" class="title"></Label>
62+
<nested-componenet></nested-componenet>
63+
</StackLayout>
64+
`,
65+
})
66+
class SecondComponent {
67+
onTap() {
68+
console.log("SecondComponent.Tapped!");
69+
}
70+
}
71+
72+
73+
74+
@Component({
75+
selector: 'action-bar-test',
76+
directives: [NS_ROUTER_DIRECTIVES],
77+
template: `
78+
<GridLayout>
79+
<page-router-outlet></page-router-outlet>
80+
</GridLayout>
81+
`
82+
})
83+
@RouteConfig([
84+
{ path: '/', component: FirstComponent, as: 'First' },
85+
{ path: '/second', component: SecondComponent, as: 'Second' },
86+
])
87+
export class ActionBarTest {
88+
}
89+
90+
Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,10 @@
11
import { Type, ApplicationRef, Provider } from 'angular2/core';
22

3+
export interface AppOptions {
4+
cssFile?: string;
5+
startPageActionBarHidden?: boolean;
6+
}
7+
38
export type BindingArray = Array<Type | Provider | Array<any>>;
49
export function bootstrap(appComponentType: any, componentInjectableBindings?: BindingArray): Promise<ApplicationRef>;
510
export function nativeScriptBootstrap(appComponentType: any, customProviders?: BindingArray, appOptions?: any): void;

src/nativescript-angular/application.ts

Lines changed: 15 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -43,8 +43,13 @@ import {defaultPageProvider} from "./platform-providers";
4343

4444
let _platform = null;
4545

46+
export interface AppOptions {
47+
cssFile?: string;
48+
startPageActionBarHidden?: boolean;
49+
}
50+
4651
export function bootstrap(appComponentType: any,
47-
customProviders: ProviderArray = null) : Promise<ComponentRef> {
52+
customProviders: ProviderArray = null): Promise<ComponentRef> {
4853
NativeScriptDomAdapter.makeCurrent();
4954

5055
let platformProviders: ProviderArray = [
@@ -72,21 +77,24 @@ export function bootstrap(appComponentType: any,
7277
if (isPresent(customProviders)) {
7378
appProviders.push(customProviders);
7479
}
75-
80+
7681
if (!_platform) {
7782
_platform = platform(platformProviders);
7883
}
7984
return _platform.application(appProviders).bootstrap(appComponentType);
8085
}
8186

82-
export function nativeScriptBootstrap(appComponentType: any, customProviders?: ProviderArray, appOptions?: any) {
87+
export function nativeScriptBootstrap(appComponentType: any, customProviders?: ProviderArray, appOptions?: AppOptions) {
8388
if (appOptions && appOptions.cssFile) {
8489
application.cssFile = appOptions.cssFile;
8590
}
8691
application.start({
8792
create: (): Page => {
8893
let page = new Page();
89-
94+
if (appOptions) {
95+
page.actionBarHidden = appOptions.startPageActionBarHidden;
96+
}
97+
9098
let onLoadedHandler = function(args) {
9199
page.off('loaded', onLoadedHandler);
92100
//profiling.stop('application-start');
@@ -97,7 +105,7 @@ export function nativeScriptBootstrap(appComponentType: any, customProviders?: P
97105
bootstrap(appComponentType, customProviders).then((appRef) => {
98106
//profiling.stop('ng-bootstrap');
99107
console.log('ANGULAR BOOTSTRAP DONE.');
100-
}, (err) =>{
108+
}, (err) => {
101109
console.log('ERROR BOOTSTRAPPING ANGULAR');
102110
let errorMessage = err.message + "\n\n" + err.stack;
103111
console.log(errorMessage);
@@ -107,9 +115,9 @@ export function nativeScriptBootstrap(appComponentType: any, customProviders?: P
107115
page.content = view;
108116
});
109117
}
110-
118+
111119
page.on('loaded', onLoadedHandler);
112-
120+
113121
return page;
114122
}
115123
});

0 commit comments

Comments
 (0)