diff --git a/CrossPlatformModules.csproj b/CrossPlatformModules.csproj
index 862f8445a..c581f5d6a 100644
--- a/CrossPlatformModules.csproj
+++ b/CrossPlatformModules.csproj
@@ -330,6 +330,16 @@
list-picker.d.ts
+
+ tool-bar.d.ts
+
+
+ tool-bar.d.ts
+
+
+
+ tool-bar.d.ts
+
segmented-bar.d.ts
@@ -1453,6 +1463,9 @@
PreserveNewest
+
+ PreserveNewest
+
@@ -1518,4 +1531,4 @@
-
\ No newline at end of file
+
diff --git a/apps/tests/xml-declaration/mainPage.xml b/apps/tests/xml-declaration/mainPage.xml
index 9589caee6..d89648edd 100644
--- a/apps/tests/xml-declaration/mainPage.xml
+++ b/apps/tests/xml-declaration/mainPage.xml
@@ -6,7 +6,27 @@
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
@@ -14,7 +34,7 @@
-
+
diff --git a/ui/builder/component-builder.ts b/ui/builder/component-builder.ts
index 5a9b646a0..ed1083bf0 100644
--- a/ui/builder/component-builder.ts
+++ b/ui/builder/component-builder.ts
@@ -32,6 +32,8 @@ var MODULES = {
"WebView": "ui/web-view",
"SegmentedBar": "ui/segmented-bar",
"SegmentedBarItem": "ui/segmented-bar",
+ "ToolBar": "ui/tool-bar",
+ "ToolBarItem": "ui/tool-bar",
"TimePicker": "ui/time-picker",
"DatePicker": "ui/date-picker",
"ListPicker": "ui/list-picker",
@@ -180,4 +182,4 @@ function isBinding(value: string): boolean {
}
return isBinding;
-}
\ No newline at end of file
+}
diff --git a/ui/tool-bar/package.json b/ui/tool-bar/package.json
new file mode 100644
index 000000000..89ce4bda8
--- /dev/null
+++ b/ui/tool-bar/package.json
@@ -0,0 +1,2 @@
+{ "name" : "tool-bar",
+ "main" : "tool-bar.js" }
\ No newline at end of file
diff --git a/ui/tool-bar/tool-bar-common.ts b/ui/tool-bar/tool-bar-common.ts
new file mode 100644
index 000000000..efcc91c11
--- /dev/null
+++ b/ui/tool-bar/tool-bar-common.ts
@@ -0,0 +1,25 @@
+import definition = require("ui/tool-bar");
+import view = require("ui/core/view");
+import proxy = require("ui/core/proxy");
+import dependencyObservable = require("ui/core/dependency-observable");
+
+export module knownCollections {
+ export var items = "items";
+}
+
+export class ToolBar extends view.View implements definition.ToolBar {
+ public _addArrayFromBuilder(name: string, value: Array) {
+ if (name === "items") {
+ this._setValue(ToolBar.itemsProperty, value);
+ }
+ }
+
+ get items(): Array {
+ return this._getValue(ToolBar.itemsProperty);
+ }
+ set items(value: Array) {
+ this._setValue(ToolBar.itemsProperty, value);
+ }
+
+ public static itemsProperty = new dependencyObservable.Property("items", "ToolBar", new proxy.PropertyMetadata(undefined))
+}
\ No newline at end of file
diff --git a/ui/tool-bar/tool-bar.android.ts b/ui/tool-bar/tool-bar.android.ts
new file mode 100644
index 000000000..492721afa
--- /dev/null
+++ b/ui/tool-bar/tool-bar.android.ts
@@ -0,0 +1,28 @@
+import common = require("ui/tool-bar/tool-bar-common");
+import dependencyObservable = require("ui/core/dependency-observable");
+import proxy = require("ui/core/proxy");
+import types = require("utils/types");
+
+// merge the exports of the common file with the exports of this file
+declare var exports;
+require("utils/module-merge").merge(common, exports);
+
+function onItemsPropertyChanged(data: dependencyObservable.PropertyChangeData) {
+ var view = data.object;
+ if (!view.android) {
+ return;
+ }
+}
+(common.ToolBar.itemsProperty.metadata).onSetNativeValue = onItemsPropertyChanged;
+
+export class ToolBar extends common.ToolBar {
+ private _android: any;
+
+ public _createUI() {
+ this._android = new (android.widget).Toolbar(this._context);
+ }
+
+ get android(): any {
+ return this._android;
+ }
+}
\ No newline at end of file
diff --git a/ui/tool-bar/tool-bar.d.ts b/ui/tool-bar/tool-bar.d.ts
new file mode 100644
index 000000000..73308faec
--- /dev/null
+++ b/ui/tool-bar/tool-bar.d.ts
@@ -0,0 +1,32 @@
+/**
+ * Contains the ToolBar class, which represents a ToolBar component.
+ */
+declare module "ui/tool-bar" {
+ import view = require("ui/core/view");
+ import dependencyObservable = require("ui/core/dependency-observable");
+
+ /**
+ * Represents a ToolBar item.
+ */
+ interface ToolBarItem {
+ /**
+ * Gets or sets the title of the ToolBar.
+ */
+ view: view.View;
+ }
+
+ /**
+ * Represents a UI ToolBar component.
+ */
+ export class ToolBar extends view.View {
+ /**
+ * Gets or sets the items of the ToolBar.
+ */
+ items: Array;
+
+ /**
+ * Gets or sets the items dependency property of the ToolBar.
+ */
+ public static itemsProperty: dependencyObservable.Property;
+ }
+}
\ No newline at end of file
diff --git a/ui/tool-bar/tool-bar.ios.ts b/ui/tool-bar/tool-bar.ios.ts
new file mode 100644
index 000000000..222aac9fb
--- /dev/null
+++ b/ui/tool-bar/tool-bar.ios.ts
@@ -0,0 +1,41 @@
+import definition = require("ui/tool-bar");
+import common = require("ui/tool-bar/tool-bar-common");
+import dependencyObservable = require("ui/core/dependency-observable");
+import proxy = require("ui/core/proxy");
+import view = require("ui/core/view");
+
+// merge the exports of the common file with the exports of this file
+declare var exports;
+require("utils/module-merge").merge(common, exports);
+
+function onItemsPropertyChanged(data: dependencyObservable.PropertyChangeData) {
+ var bar = data.object;
+ if (!bar.ios) {
+ return;
+ }
+
+ var items = new NSMutableArray();
+ for (var element in >data.newValue) {
+ if (element.view instanceof view.View) {
+ bar._addView(element.view);
+ items.addObject(element.view.ios);
+ }
+ }
+
+ bar.ios.setItemsAnimated(items, false);
+}
+(common.ToolBar.itemsProperty.metadata).onSetNativeValue = onItemsPropertyChanged;
+
+export class ToolBar extends common.ToolBar {
+ private _ios: UIToolbar;
+
+ constructor() {
+ super();
+
+ this._ios = UIToolbar.new();
+ }
+
+ get ios(): UIToolbar {
+ return this._ios;
+ }
+}
\ No newline at end of file