Skip to content

Commit dc3d55d

Browse files
farfromrefugfarfromrefug
committed
chore: demo update
1 parent 5d21fcb commit dc3d55d

File tree

7 files changed

+58
-97
lines changed

7 files changed

+58
-97
lines changed

‎demo-snippets/canvastests.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -21,7 +21,7 @@ import { Folder, knownFolders, path } from '@nativescript/core/file-system';
2121
import { ImageSource } from '@nativescript/core/image-source';
2222

2323
function isOnUiThread() {
24-
if (global.isIOS) {
24+
if (__IOS__) {
2525
return NSOperationQueue.currentQueue === NSOperationQueue.mainQueue;
2626
} else {
2727
return android.os.Looper.myLooper() === android.os.Looper.getMainLooper();

‎demo-snippets/package.json

Lines changed: 3 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,12 @@
55
"dependencies": {
66
"@mdi/font": "6.5.95",
77
"@nativescript-community/perms": "2.3.0",
8+
"@nativescript-community/text": "1.5.31",
89
"@nativescript-community/tween": "0.0.14",
910
"@nativescript-community/ui-canvas": "*",
1011
"@nativescript-community/ui-canvaslabel": "*",
11-
"@nativescript-community/ui-collectionview": "*",
12+
"@nativescript-community/ui-collectionview": "5.1.7",
13+
"@nativescript-community/ui-label": "1.3.6",
1214
"@nativescript-community/ui-svg": "*",
1315
"copy-webpack-plugin": "^11.0.0",
1416
"nativescript-vue-template-compiler": "~2.9.3",

‎demo-snippets/vue/CanvasLabel.vue

Lines changed: 21 additions & 77 deletions
Original file line numberDiff line numberDiff line change
@@ -1,83 +1,27 @@
11
<template>
22
<Page>
33
<StackLayout>
4-
<CollectionView width="100%" height="50%" rowHeight="80" ref="listView" :items="itemList" @itemTap="onItemTap" itemIdGenerator="index">
5-
<v-template>
6-
<GridLayout margin="4" borderRightWidth="20" borderRightColor="white" backgroundColor="darkgray">
7-
<Label color="blue" fontSize="38" verticalAlignment="middle" paddingLeft="20" fontStyle="italic" textWrap>
8-
<Span :text="item.text1" fontWeight="bold" />
9-
<Span :text="'\n' + item.text2" color="#ccc" fontSize="16" fontStyle="normal" />
10-
<Span :text="item.text2" color="#eee" fontFamily="Lato-Regular" fontSize="16" fontStyle="normal" />
11-
</Label>
12-
<Label color="white" fontSize="12" verticalAlignment="bottom" paddingLeft="20" paddingBottom="1" textWrap>
13-
<Span :text="item.icon1" fontSize="20" color="green" :fontFamily="mdiFontFamily" />
14-
<Span :text="' ' + item.texticon1" verticalTextAlignment="center" />
15-
<Span :text="' ' + item.icon2" fontSize="20" color="red" :fontFamily="mdiFontFamily" />
16-
<Span :text="' ' + item.texticon2" verticalTextAlignment="center" />
17-
<Span :text="' ' + item.icon3" fontSize="20" color="yellow" :fontFamily="mdiFontFamily" />
18-
<Span :text="' ' + item.icon3" verticalTextAlignment="center" />
19-
</Label>
20-
<Label fontSize="12" verticalAlignment="middle" horizontalAlignment="center" textAlignment="right" paddingRight="20" color="brown" width="60" textWrap>
21-
<span :text="item.icon1" fontSize="14" :fontFamily="mdiFontFamily" />
22-
<Span :text="'\n' + item.texticon1" paddingRight="10" />
23-
</Label>
24-
<Label fontFamily="arial" :text="item.text4" color="red" fontSize="14" textAlignment="right" paddingRight="20" paddingTop="4" verticalAlignment="center"/>
25-
</GridLayout>
26-
</v-template>
27-
</CollectionView>
28-
<CollectionView width="100%" height="50%" rowHeight="80" ref="listView" :items="itemList" @itemTap="onItemTap" itemIdGenerator="index">
29-
<v-template>
30-
<GridLayout>
31-
<CanvasLabel id="canvaslabel" fontSize="10" color="white" backgroundColor="darkgray" margin="4" borderRightWidth="20" borderRightColor="white">
32-
<CGroup id="group1" color="blue" fontSize="38" verticalAlignment="middle" paddingLeft="20" fontStyle="italic">
33-
<CSpan id="text1" :text="item.text1" fontWeight="bold" />
34-
<CSpan id="text2" :text="'\n' + item.text2" color="#ccc" fontSize="16" fontStyle="normal" />
35-
<CSpan id="text3" :text="item.text2" color="#eee" fontFamily="Lato-Regular" fontSize="16" fontStyle="normal" />
36-
</CGroup>
37-
<CGroup id="group2" fontSize="12" verticalAlignment="bottom" paddingLeft="20" paddingBottom="1">
38-
<CSpan id="icon1" :text="item.icon1" fontSize="20" color="green" :fontFamily="mdiFontFamily" />
39-
<CSpan id="texticon1" :text="' ' + item.texticon1" verticalTextAlignment="center" />
40-
<CSpan id="icon2" :text="' ' + item.icon2" fontSize="20" color="red" :fontFamily="mdiFontFamily" />
41-
<CSpan id="texticon2" :text="' ' + item.texticon2" verticalTextAlignment="center" />
42-
<CSpan id="icon3" :text="' ' + item.icon3" fontSize="20" color="yellow" :fontFamily="mdiFontFamily" />
43-
<CSpan id="icon3" :text="' ' + item.icon3" verticalTextAlignment="center" />
44-
</CGroup>
45-
46-
<CGroup id="group3" fontSize="12" verticalAlignment="middle" horizontalAlignment="center" textAlignment="right" paddingRight="20" color="brown" width="60">
47-
<CSpan id="icon12" :text="item.icon1" fontSize="14" :fontFamily="mdiFontFamily" />
48-
<CSpan id="texticon12" :text="'\n' + item.texticon1" paddingRight="10" />
49-
</CGroup>
50-
<CSpan id="text4" fontFamily="arial" :text="item.text4" color="red" fontSize="14" textAlignment="right" paddingRight="20" paddingTop="4" verticalAlignment="center"/>
51-
<!-- <CGroup id="group1" fontSize="12" verticalAlignment="bottom" paddingLeft="20" paddingBottom="1" color="white" verticalTextAlignment="top">
52-
<CSpan id="span1" text="test1" margin="2" backgroundColor="green" borderRadius="4" verticalTextAlignment="super" />
53-
<CSpan id="span2" text="testtest2" backgroundColor="red" borderRadius="4" fontSize="24" />
54-
<CGroup id="group2" backgroundColor="green" borderRadius="4">
55-
<CSpan id="span3" text="mdi-access-point" fontSize="20" color="yellow" :fontFamily="mdiFontFamily" />
56-
<CSpan id="span4" text="test2" margin="2" />
57-
</CGroup>
58-
</CGroup> -->
59-
<!-- <CGroup>
60-
<CSpan fontSize="20" text="test1" margin="2" color="red" backgroundColor="green" borderRadius="10" @linkTap="onLinkTapped('test1')" />
61-
</CGroup> -->
62-
<!-- <CSpan
63-
width="44"
64-
height="44"
65-
horizontalAlignment="right"
66-
verticalAlignment="bottom"
67-
textAlignment="center"
68-
verticalTextAlignment="center"
69-
text="mdi-access-point"
70-
fontSize="20"
71-
color="yellow"
72-
:fontFamily="mdiFontFamily"
73-
backgroundColor="blue"
74-
borderRadius="4"
75-
shadow="0 1 4 red"
76-
/> -->
77-
</CanvasLabel>
78-
</GridLayout>
79-
</v-template>
80-
</CollectionView>
4+
<canvaslabel backgroundColor="red" rippleColor="green" borderRadius="10" paddingTop="0" height="80" widht="80">
5+
<CGroup verticalAlignment="middle" textAlignment="center">
6+
<cspan :fontFamily="mdiFontFamily" text="mdi-cellphone-screenshot" fontSize="30" />
7+
<cspan :text="'\n' + 'share screenshot'" fontSize="12" />
8+
</CGroup>
9+
</canvaslabel>
10+
<canvaslabel backgroundColor="yellow" rippleColor="green" borderRadius="10" paddingTop="0" height="80" width="80" lineBreak="middle">
11+
<CGroup>
12+
<cspan text="this is a tesxt to test lineBreak" fontSize="12" />
13+
<cspan :text="'\n' + 'another piece of text which is going to be ellipsized'" fontSize="16" />
14+
</CGroup>
15+
</canvaslabel>
16+
<label backgroundColor="green" rippleColor="green" borderRadius="10" paddingTop="0" height="80" width="80" lineBreak="end" >
17+
<span text="this is a tesxt to test lineBreak" fontSize="12" />
18+
<span :text="'\n' + 'another piece of text which is going to be ellipsized'" fontSize="16" />
19+
</label>
20+
<HTMLLabel backgroundColor="blue" rippleColor="green" borderRadius="10" paddingTop="0" height="80" width="80" lineBreak="end" maxLines="4">
21+
<span text="this is a tesxt to test lineBreak" fontSize="12" />
22+
<span :text="'\n' + 'another piece of text which is going to be ellipsized'" fontSize="16" />
23+
</HTMLLabel>
24+
8125
</StackLayout>
8226
</Page>
8327
</template>

‎demo-snippets/vue/Complex.vue

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -32,7 +32,7 @@ export default class ComplexExample extends Vue {
3232
Frame.topmost().goBack();
3333
}
3434
postMessageToWorker(type, data?) {
35-
if (global.isIOS) {
35+
if (__IOS__) {
3636
// the clone makes the UI slow! No solution right now
3737
const nativeDict = NSMutableDictionary.dictionaryWithObjectForKey(type, 'type');
3838
if (data) {
@@ -52,7 +52,7 @@ export default class ComplexExample extends Vue {
5252
.then(() => perms.request('photo'))
5353
.then(() => {
5454
console.log('saveToAlbum', imageSource.width, imageSource.height);
55-
if (global.isIOS) {
55+
if (__IOS__) {
5656
// var res = false;
5757
// if (!imageSource) {
5858
// return res;

‎demo-snippets/vue/install.ts

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,7 @@ import Complex from './Complex.vue';
77
import SVG from './SVG.vue';
88
import CanvasLabel from './CanvasLabel.vue';
99
import CanvasPlugin from '@nativescript-community/ui-canvas/vue';
10+
import { Label as HTMLLabel } from '@nativescript-community/ui-label';
1011
import CanvasLabelPlugin from '@nativescript-community/ui-canvaslabel/vue';
1112
import CollectionViewPlugin from '@nativescript-community/ui-collectionview/vue';
1213
import SVGPlugin from '@nativescript-community/ui-svg/vue';
@@ -16,6 +17,7 @@ export function installPlugin() {
1617
Vue.use(SVGPlugin);
1718
Vue.use(CanvasLabelPlugin);
1819
Vue.use(CollectionViewPlugin);
20+
Vue.registerElement('HTMLLabel', () => HTMLLabel);
1921
}
2022

2123
export const demos = [

‎demo-snippets/worker.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import 'globals';
55
const context: Worker = self as any;
66

77
function isOnUiThread() {
8-
if (global.isIOS) {
8+
if (__IOS__) {
99
return NSOperationQueue.currentQueue === NSOperationQueue.mainQueue;
1010
} else {
1111
return android.os.Looper.myLooper() === android.os.Looper.getMainLooper();
@@ -28,7 +28,7 @@ function valueFromPointerNumber(type, value) {
2828
}
2929

3030
context.onmessage = function (msg) {
31-
if (global.isIOS) {
31+
if (__IOS__) {
3232
const dict = valueFromPointerNumber(NSDictionary, msg.data.value.dictionaryPtr) as any as NSDictionary<any, any>;
3333
const type = dict.objectForKey('type') as string;
3434
console.log('onmessage', type);
@@ -47,7 +47,7 @@ context.onmessage = function (msg) {
4747
};
4848

4949
function sendMessageBack(type, data?) {
50-
if (global.isIOS) {
50+
if (__IOS__) {
5151
const nativeDict = NSMutableDictionary.dictionaryWithObjectForKey(type, 'type');
5252
if (data) {
5353
nativeDict.setValueForKey(data, 'data');

‎yarn.lock

Lines changed: 26 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -2300,10 +2300,12 @@ __metadata:
23002300
dependencies:
23012301
"@mdi/font": 6.5.95
23022302
"@nativescript-community/perms": 2.3.0
2303+
"@nativescript-community/text": 1.5.31
23032304
"@nativescript-community/tween": 0.0.14
23042305
"@nativescript-community/ui-canvas": "*"
23052306
"@nativescript-community/ui-canvaslabel": "*"
2306-
"@nativescript-community/ui-collectionview": "*"
2307+
"@nativescript-community/ui-collectionview": 5.1.7
2308+
"@nativescript-community/ui-label": 1.3.6
23072309
"@nativescript-community/ui-svg": "*"
23082310
copy-webpack-plugin: ^11.0.0
23092311
nativescript-vue-template-compiler: ~2.9.3
@@ -2316,29 +2318,31 @@ __metadata:
23162318

23172319
"@nativescript-community/template-snippet@file:demo-snippets::locator=root-workspace-0b6124%40workspace%3A.":
23182320
version: 0.0.1
2319-
resolution: "@nativescript-community/template-snippet@file:demo-snippets#demo-snippets::hash=c2970d&locator=root-workspace-0b6124%40workspace%3A."
2321+
resolution: "@nativescript-community/template-snippet@file:demo-snippets#demo-snippets::hash=48f1dc&locator=root-workspace-0b6124%40workspace%3A."
23202322
dependencies:
23212323
"@mdi/font": 6.5.95
23222324
"@nativescript-community/perms": 2.3.0
2325+
"@nativescript-community/text": 1.5.31
23232326
"@nativescript-community/tween": 0.0.14
23242327
"@nativescript-community/ui-canvas": "*"
23252328
"@nativescript-community/ui-canvaslabel": "*"
2326-
"@nativescript-community/ui-collectionview": "*"
2329+
"@nativescript-community/ui-collectionview": 5.1.7
2330+
"@nativescript-community/ui-label": 1.3.6
23272331
"@nativescript-community/ui-svg": "*"
23282332
copy-webpack-plugin: ^11.0.0
23292333
nativescript-vue-template-compiler: ~2.9.3
23302334
scss-symbols-parser: ^2.0.1
23312335
string-replace-loader: ^3.1.0
23322336
vue-class-component: 7.2.6
23332337
vue-property-decorator: 9.1.2
2334-
checksum: 18436d78714d61cfb34cb1a8c28e15956939fb7132d34c10695003f991dc690b2f8267d5f203a07a7dae8bbb27ea61f1bf48297c40acf136062bd0fc8f4a4b84
2338+
checksum: e95356ac20cb629eee853d609f58aff38bce0fa88aa0b7dcbefcdaa52d43400b1f50effcb19509c4adbc2ab7014f343428b342f347c31522f364b8b57b0cf15a
23352339
languageName: node
23362340
linkType: hard
23372341

2338-
"@nativescript-community/text@npm:^1.5.22, @nativescript-community/text@npm:^1.5.23":
2339-
version: 1.5.24
2340-
resolution: "@nativescript-community/text@npm:1.5.24"
2341-
checksum: b8ae262b6a952cbaf116e85cb32bbf1e65ed4d4326e21f552f6e4be53a23ada8abcfbd28a3d0eb07c2127829154fa475931c4b543b7c88fc591764bec6ff8528
2342+
"@nativescript-community/text@npm:1.5.31, @nativescript-community/text@npm:^1.5.21, @nativescript-community/text@npm:^1.5.22, @nativescript-community/text@npm:^1.5.31":
2343+
version: 1.5.31
2344+
resolution: "@nativescript-community/text@npm:1.5.31"
2345+
checksum: 38307e0f937d82265dabe090b5d84a29622a21ac76b60c0141645496d12f0aef43bb46818a9c09e1557237e8ff091a65cf9c6b35dd22a9df5019d70ccc644207
23422346
languageName: node
23432347
linkType: hard
23442348

@@ -2363,15 +2367,24 @@ __metadata:
23632367
version: 0.0.0-use.local
23642368
resolution: "@nativescript-community/ui-canvaslabel@workspace:packages/ui-canvaslabel"
23652369
dependencies:
2366-
"@nativescript-community/text": ^1.5.23
2370+
"@nativescript-community/text": ^1.5.31
23672371
"@nativescript-community/ui-canvas": ^4.4.13
23682372
languageName: unknown
23692373
linkType: soft
23702374

2371-
"@nativescript-community/ui-collectionview@npm:*":
2372-
version: 5.1.5
2373-
resolution: "@nativescript-community/ui-collectionview@npm:5.1.5"
2374-
checksum: 5af92320e365e2201ccb2c9f7571cb280fc79b78c9b320be39cfcecd32a11915e7032ef9de13d119daf96e433370087602b2d7caf199062ee9803dbb3b226f7f
2375+
"@nativescript-community/ui-collectionview@npm:5.1.7":
2376+
version: 5.1.7
2377+
resolution: "@nativescript-community/ui-collectionview@npm:5.1.7"
2378+
checksum: 54771bc50291d12c4a8fd12c0d09832687589d0c4b85492ea02f0778c99616ca28f9712d387f3abd76edd93e70e2dd9ab571363c552f4edb577d6645090b7efa
2379+
languageName: node
2380+
linkType: hard
2381+
2382+
"@nativescript-community/ui-label@npm:1.3.6":
2383+
version: 1.3.6
2384+
resolution: "@nativescript-community/ui-label@npm:1.3.6"
2385+
dependencies:
2386+
"@nativescript-community/text": ^1.5.21
2387+
checksum: c9d954c4812a28d7955e290afc1041083fb98e43d9678dad10cebe66ac52efb14d9650ae86bb4a70475e5851d9fa1cdb253711b93d6b44d1b8dd9c0ed52f6122
23752388
languageName: node
23762389
linkType: hard
23772390

0 commit comments

Comments
 (0)