@nativescript/template-hello-world-ts 8.2.1 → 8.2.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/app/app.css +1 -20
- package/app/main-page.ts +0 -23
- package/app/main-page.xml +0 -21
- package/package.json +1 -1
package/app/app.css
CHANGED
|
@@ -1,25 +1,6 @@
|
|
|
1
|
-
|
|
2
|
-
In NativeScript, the app.css file is where you place CSS rules that
|
|
3
|
-
you would like to apply to your entire application. Check out
|
|
4
|
-
http://docs.nativescript.org/ui/styling for a full list of the CSS
|
|
5
|
-
selectors and properties you can use to style UI components.
|
|
6
|
-
|
|
7
|
-
/*
|
|
8
|
-
In many cases you may want to use the NativeScript core theme instead
|
|
9
|
-
of writing your own CSS rules. You can learn more about the
|
|
10
|
-
NativeScript core theme at https://github.com/nativescript/theme
|
|
11
|
-
The imported CSS rules must precede all other types of rules.
|
|
12
|
-
*/
|
|
13
|
-
@import '@nativescript/theme/css/core.css';
|
|
1
|
+
@import '@nativescript/theme/css/core.css';
|
|
14
2
|
@import '@nativescript/theme/css/default.css';
|
|
15
3
|
|
|
16
|
-
/* Place any CSS rules you want to apply on both iOS and Android here.
|
|
17
|
-
This is where the vast majority of your CSS code goes. */
|
|
18
|
-
|
|
19
|
-
/*
|
|
20
|
-
The following CSS rule changes the font size of all Buttons that have the
|
|
21
|
-
'-primary' class modifier.
|
|
22
|
-
*/
|
|
23
4
|
Button.-primary {
|
|
24
5
|
font-size: 18;
|
|
25
6
|
}
|
package/app/main-page.ts
CHANGED
|
@@ -1,30 +1,7 @@
|
|
|
1
|
-
/*
|
|
2
|
-
In NativeScript, a file with the same name as an XML file is known as
|
|
3
|
-
a code-behind file. The code-behind is a great place to place your view
|
|
4
|
-
logic, and to set up your page’s data binding.
|
|
5
|
-
*/
|
|
6
|
-
|
|
7
1
|
import { EventData, Page } from '@nativescript/core'
|
|
8
2
|
import { HelloWorldModel } from './main-view-model'
|
|
9
3
|
|
|
10
|
-
// Event handler for Page 'navigatingTo' event attached in main-page.xml
|
|
11
4
|
export function navigatingTo(args: EventData) {
|
|
12
|
-
/*
|
|
13
|
-
This gets a reference this page’s <Page> UI component. You can
|
|
14
|
-
view the API reference of the Page to see what’s available at
|
|
15
|
-
https://docs.nativescript.org/api-reference/classes/_ui_page_.page.html
|
|
16
|
-
*/
|
|
17
5
|
const page = <Page>args.object
|
|
18
|
-
|
|
19
|
-
/*
|
|
20
|
-
A page’s bindingContext is an object that should be used to perform
|
|
21
|
-
data binding between XML markup and TypeScript code. Properties
|
|
22
|
-
on the bindingContext can be accessed using the {{ }} syntax in XML.
|
|
23
|
-
In this example, the {{ message }} and {{ onTap }} bindings are resolved
|
|
24
|
-
against the object returned by createViewModel().
|
|
25
|
-
|
|
26
|
-
You can learn more about data binding in NativeScript at
|
|
27
|
-
https://docs.nativescript.org/core-concepts/data-binding.
|
|
28
|
-
*/
|
|
29
6
|
page.bindingContext = new HelloWorldModel()
|
|
30
7
|
}
|
package/app/main-page.xml
CHANGED
|
@@ -1,27 +1,6 @@
|
|
|
1
|
-
<!--
|
|
2
|
-
The markup in NativeScript apps contains a series of user interface components, each
|
|
3
|
-
of which NativeScript renders with a platform-specific iOS or Android native control.
|
|
4
|
-
You can find a full list of user interface components you can use in your app at
|
|
5
|
-
https://docs.nativescript.org/ui/components.
|
|
6
|
-
-->
|
|
7
1
|
<Page xmlns="http://schemas.nativescript.org/tns.xsd" navigatingTo="navigatingTo">
|
|
8
|
-
<!--
|
|
9
|
-
The ActionBar is the NativeScript common abstraction over the Android ActionBar and iOS NavigationBar.
|
|
10
|
-
http://docs.nativescript.org/ui/action-bar
|
|
11
|
-
-->
|
|
12
2
|
<ActionBar title="My App" icon="" />
|
|
13
3
|
|
|
14
|
-
<!--
|
|
15
|
-
The StackLayout stacks UI components on the screen—either vertically or horizontally.
|
|
16
|
-
In this case, the StackLayout does vertical stacking; you can change the stacking to
|
|
17
|
-
horizontal by applying a orientation="horizontal" attribute to the <StackLayout> element.
|
|
18
|
-
You can learn more about NativeScript layouts at
|
|
19
|
-
https://docs.nativescript.org/ui/layout-containers.
|
|
20
|
-
|
|
21
|
-
These components make use of the NativeScript core theme, which styles them with element selectors.
|
|
22
|
-
The theme also provides a set of helper class names such as p-20, h1, h2, and text-center to enhance styling.
|
|
23
|
-
You can learn more about the NativeScript core theme at https://github.com/nativescript/theme
|
|
24
|
-
-->
|
|
25
4
|
<StackLayout class="p-20">
|
|
26
5
|
<Label text="Tap the button" class="h1 text-center" />
|
|
27
6
|
<Button text="TAP" tap="{{ onTap }}" class="-primary" />
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@nativescript/template-hello-world-ts",
|
|
3
3
|
"main": "app/app.ts",
|
|
4
|
-
"version": "8.2.
|
|
4
|
+
"version": "8.2.2",
|
|
5
5
|
"author": "NativeScript Team <oss@nativescript.org>",
|
|
6
6
|
"description": "Nativescript hello-world-ts project template",
|
|
7
7
|
"license": "Apache-2.0",
|