10000 Implemented ActionBar · saknarak/nativescript-vue@3a1f35f · GitHub
[go: up one dir, main page]
Skip to content

Commit 3a1f35f

Browse files
EddyVerbruggenEddyVerbruggen
committed
Implemented ActionBar
1 parent 09857c4 commit 3a1f35f

File tree

8 files changed

+312
-55
lines changed

8 files changed

+312
-55
lines changed

‎dist/index.js

Lines changed: 151 additions & 47 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/index.js.map

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎platform/nativescript/element-registry.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -85,7 +85,10 @@ registerElement("ListPicker", () => require("ui/list-picker").ListPicker, {
8585
event: 'selectedIndexChange'
8686
}
8787
});
88+
registerElement("NativeActionBar", () => require("ui/action-bar").ActionBar);
89+
registerElement("NativeActionItem", () => require("ui/action-bar").ActionItem);
8890
registerElement("NativeListView", () => require("ui/list-view").ListView);
91+
registerElement("NativeNavigationButton", () => require("ui/action-bar").NavigationButton);
8992
registerElement("Page", () => require("ui/page").Page, {
9093
skipAddToDom: true
9194
});

‎platform/nativescript/runtime/components/action-bar.js

Lines changed: 36 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,46 @@
1+
import {warn} from 'core/util/debug'
2+
13
export default {
24
name: 'action-bar',
35

4-
template: `<native-action-bar></native-action-bar>`,
5-
6-
props: {},
6+
template: `<native-action-bar ref="actionBar"><slot></slot></native-action-bar>`,
77

8-
created() {
8+
props: {
9+
title: {
10+
type: String,
11+
required: false
12+
}
913
},
1014

1115
mounted() {
16+
const refKeys = Object.keys(this.$root.$refs)
17+
18+
// TODO figure out how to find the Page object without using the $refs property
19+
if (refKeys.length === 0) {
20+
warn('Make sure the page element has a "ref" attribute like <page ref="page"> or <page ref="my-ref">, otherwise no action-bar will be shown!', this)
21+
return
22+
}
23+
24+
const page = this.$parent.$refs[refKeys[0]].nativeView
25+
page.actionBar = this.$refs.actionBar.nativeView
26+
page.actionBarHidden = false
27+
if (this.title) {
28+
this.$refs.actionBar.setAttribute('title', this.title)
29+
}
30+
},
31+
32+
watch: {
33+
title(newVal) {
34+
this.$refs.actionBar.setAttribute('title', newVal)
35+
}
1236
},
1337

14-
methods: {}
38+
methods: {
39+
registerActionItem(actionItem) {
40+
this.$refs.actionBar.nativeView.actionItems.addItem(actionItem)
41+
},
42+
registerNavigationButton(navigationButton) {
43+
this.$refs.actionBar.nativeView.navigationButton = navigationButton
44+
}
45+
}
1546
}

0 commit comments

Comments
 (0)
0