diff --git a/.travis.yml b/.travis.yml index 45a90e478..391fb59dd 100644 --- a/.travis.yml +++ b/.travis.yml @@ -11,7 +11,7 @@ addons: artifacts: paths: - "$HOME/test-run-results$PACKAGE_VERSION.xml" -sudo: required +sudo: false dist: trusty language: android node_js: diff --git a/CrossPlatformModules.csproj b/CrossPlatformModules.csproj index 43e89fcf4..11296a677 100644 --- a/CrossPlatformModules.csproj +++ b/CrossPlatformModules.csproj @@ -447,8 +447,8 @@ - - + + @@ -548,7 +548,7 @@ - + @@ -720,7 +720,7 @@ - + @@ -737,7 +737,7 @@ - + @@ -829,10 +829,16 @@ layout.d.ts - + + + layout-base.d.ts + + + layout-base.d.ts + + layout-base.d.ts - stack-layout.d.ts @@ -1174,7 +1180,7 @@ Designer - + Designer @@ -1343,7 +1349,9 @@ PreserveNewest - + + Designer + Designer @@ -1456,7 +1464,7 @@ - + xml.d.ts @@ -1626,7 +1634,7 @@ utils.d.ts - + @@ -2222,7 +2230,7 @@ False - + - \ No newline at end of file + diff --git a/apps/tests/application-settings.md b/apps/tests/application-settings.md index 49d263280..9b1df32ef 100644 --- a/apps/tests/application-settings.md +++ b/apps/tests/application-settings.md @@ -1,7 +1,8 @@ --- nav-title: "application-settings How-To" -title: "How-To" +title: "application-settings" description: "Examples for using application-settings" +previous_url: /ApiReference/application-settings/HOW-TO --- # Application Settings Using application settings methods requires to load "application settings" module. diff --git a/apps/tests/application.md b/apps/tests/application.md index 3e72a181b..9795a102a 100644 --- a/apps/tests/application.md +++ b/apps/tests/application.md @@ -1,7 +1,8 @@ --- nav-title: "application How-To" -title: "How-To" +title: "application" description: "Examples for using application" +previous_url: /ApiReference/application/HOW-TO --- # Application The Application module provides abstraction over the platform-specific Application implementations. diff --git a/apps/tests/camera.md b/apps/tests/camera.md index ea4a3199d..9feea38d3 100644 --- a/apps/tests/camera.md +++ b/apps/tests/camera.md @@ -1,7 +1,8 @@ --- nav-title: "camera How-To" -title: "How-To" +title: "camera" description: "Examples for using camera" +previous_url: /ApiReference/camera/HOW-TO --- # Camera module Using a camera requires the camera module. diff --git a/apps/tests/color.md b/apps/tests/color.md index e863bcc00..b738ae157 100644 --- a/apps/tests/color.md +++ b/apps/tests/color.md @@ -1,7 +1,8 @@ --- nav-title: "color How-To" -title: "How-To" +title: "color" description: "Examples for using color" +previous_url: /ApiReference/color/HOW-TO --- # Color Using Colors requires the "color" module. diff --git a/apps/tests/connectivity.md b/apps/tests/connectivity.md index e40458337..3e9518f03 100644 --- a/apps/tests/connectivity.md +++ b/apps/tests/connectivity.md @@ -1,7 +1,8 @@ --- nav-title: "connectivity How-To" -title: "How-To" +title: "connectivity" description: "Examples for using connectivity" +previous_url: /ApiReference/connectivity/HOW-TO --- # Connectivity Obtaining connectivity information requires the "connectivity" module. @@ -11,4 +12,4 @@ Obtaining connectivity information requires the "connectivity" module. ### Monitoring connection type. - \ No newline at end of file + diff --git a/apps/tests/console.md b/apps/tests/console.md index 47071cdd9..bbcdcd698 100644 --- a/apps/tests/console.md +++ b/apps/tests/console.md @@ -1,7 +1,8 @@ --- nav-title: "console How-To" -title: "How-To" +title: "console" description: "Examples for using console" +previous_url: /ApiReference/console/HOW-TO --- # Console ### Logging diff --git a/apps/tests/observable-array-tests.ts b/apps/tests/data/observable-array-tests.ts similarity index 99% rename from apps/tests/observable-array-tests.ts rename to apps/tests/data/observable-array-tests.ts index 675ab0210..e8e0a8a9e 100644 --- a/apps/tests/observable-array-tests.ts +++ b/apps/tests/data/observable-array-tests.ts @@ -1,4 +1,4 @@ -import TKUnit = require("./TKUnit"); +import TKUnit = require("../TKUnit"); import bindableModule = require("ui/core/bindable"); require("globals"); diff --git a/apps/tests/observable-array.md b/apps/tests/data/observable-array.md similarity index 98% rename from apps/tests/observable-array.md rename to apps/tests/data/observable-array.md index 0d4554450..45ce86e19 100644 --- a/apps/tests/observable-array.md +++ b/apps/tests/data/observable-array.md @@ -1,7 +1,8 @@ --- nav-title: "observable-array How-To" -title: "How-To" +title: "observable-array" description: "Examples for using observable-array" +previous_url: /ApiReference/data/observable-array/HOW-TO --- # Observable Array module diff --git a/apps/tests/observable-tests.ts b/apps/tests/data/observable-tests.ts similarity index 99% rename from apps/tests/observable-tests.ts rename to apps/tests/data/observable-tests.ts index 2dd833fdd..9a06f14ca 100644 --- a/apps/tests/observable-tests.ts +++ b/apps/tests/data/observable-tests.ts @@ -3,7 +3,7 @@ import observable = require("data/observable"); // << observable-require import dependencyObservable = require("ui/core/dependency-observable"); -import TKUnit = require("./TKUnit"); +import TKUnit = require("../TKUnit"); import types = require("utils/types"); import proxy = require("ui/core/proxy"); @@ -524,4 +524,4 @@ export function test_CorrectPropertyValueAfterUsingWrappedValue() { testObservable.set("property1", wrappedArray); TKUnit.assertEqual(testObservable.get("property1"), testArray, "WrappedValue is used only to execute property change logic and unwrapped value should be used as proeprty value."); -} \ No newline at end of file +} diff --git a/apps/tests/observable.md b/apps/tests/data/observable.md similarity index 83% rename from apps/tests/observable.md rename to apps/tests/data/observable.md index 262ded4f9..b1b7d0558 100644 --- a/apps/tests/observable.md +++ b/apps/tests/data/observable.md @@ -1,7 +1,8 @@ --- nav-title: "data/observable How-To" -title: "How-To" +title: "observable" description: "Examples for using data/observable" +previous_url: /ApiReference/data/observable/HOW-TO --- # Observable Using Observable objects requires the "data/observable" module. diff --git a/apps/tests/virtual-array-tests.ts b/apps/tests/data/virtual-array-tests.ts similarity index 99% rename from apps/tests/virtual-array-tests.ts rename to apps/tests/data/virtual-array-tests.ts index bf521df44..d12a0a511 100644 --- a/apps/tests/virtual-array-tests.ts +++ b/apps/tests/data/virtual-array-tests.ts @@ -1,4 +1,4 @@ -import TKUnit = require("./TKUnit"); +import TKUnit = require("../TKUnit"); import types = require("utils/types"); // >> virtual-array-require diff --git a/apps/tests/virtual-array.md b/apps/tests/data/virtual-array.md similarity index 92% rename from apps/tests/virtual-array.md rename to apps/tests/data/virtual-array.md index 9b2436691..b9a13c266 100644 --- a/apps/tests/virtual-array.md +++ b/apps/tests/data/virtual-array.md @@ -1,7 +1,8 @@ --- nav-title: "virtual-array How-To" -title: "How-To" +title: "virtual-array" description: "Examples for using virtual-array" +previous_url: /ApiReference/data/virtual-array/HOW-TO --- # Virtual Array module diff --git a/apps/tests/fetch.md b/apps/tests/fetch.md index 096699419..eaf8c1099 100644 --- a/apps/tests/fetch.md +++ b/apps/tests/fetch.md @@ -1,7 +1,8 @@ --- nav-title: "fetch How-To" -title: "How-To" +title: "fetch" description: "Examples for using fetch" +previous_url: /ApiReference/fetch/HOW-TO --- ### Get Response from URL diff --git a/apps/tests/file-system.md b/apps/tests/file-system.md index 3dd04b30b..edcd0d159 100644 --- a/apps/tests/file-system.md +++ b/apps/tests/file-system.md @@ -1,7 +1,8 @@ --- nav-title: "file-system How-To" -title: "How-To" +title: "file-system" description: "Examples for using file-system" +previous_url: /ApiReference/file-system/HOW-TO --- # File System Using the file system requires the FileSystem module. diff --git a/apps/tests/fps-meter.md b/apps/tests/fps-meter.md index 34d15a86f..04066597c 100644 --- a/apps/tests/fps-meter.md +++ b/apps/tests/fps-meter.md @@ -1,7 +1,8 @@ --- nav-title: "fps-meter How-To" -title: "How-To" +title: "fps-meter" description: "Examples for using fps-meter" +previous_url: /ApiReference/fps-meter/HOW-TO --- # Frames-per-second meter Logging frames-per-second statistics for your app requires the "fps-meter" module. diff --git a/apps/tests/http.md b/apps/tests/http.md index 126037867..fb6fd0fd1 100644 --- a/apps/tests/http.md +++ b/apps/tests/http.md @@ -1,7 +1,8 @@ --- nav-title: "http How-To" -title: "How-To" +title: "http" description: "Examples for using http" +previous_url: /ApiReference/http/HOW-TO --- # Http module Using http methods requires to load "http" module. diff --git a/apps/tests/image-source.md b/apps/tests/image-source.md index 198a9a0f9..009e1fa6d 100644 --- a/apps/tests/image-source.md +++ b/apps/tests/image-source.md @@ -1,7 +1,8 @@ --- nav-title: "image-source How-To" -title: "How-To" +title: "image-source" description: "Examples for using image-source" +previous_url: /ApiReference/image-source/HOW-TO --- # Image source Using the image source requires the image-source module. diff --git a/apps/tests/location.md b/apps/tests/location.md index db66c21d9..0ab1d5596 100644 --- a/apps/tests/location.md +++ b/apps/tests/location.md @@ -1,7 +1,8 @@ --- nav-title: "location How-To" -title: "How-To" +title: "location" description: "Examples for using location" +previous_url: /ApiReference/location/HOW-TO --- # Location Using the location requires the Location module. diff --git a/apps/tests/platform.md b/apps/tests/platform.md index d64cd1aec..e27f801b2 100644 --- a/apps/tests/platform.md +++ b/apps/tests/platform.md @@ -1,7 +1,8 @@ --- nav-title: "platform How-To" -title: "How-To" +title: "platform" description: "Examples for using platform" +previous_url: /ApiReference/platform/HOW-TO --- # Platform Information about the current device and screen are defined in the platform module diff --git a/apps/tests/testRunner.ts b/apps/tests/testRunner.ts index fc40fa3fb..20c7b656e 100644 --- a/apps/tests/testRunner.ts +++ b/apps/tests/testRunner.ts @@ -38,9 +38,9 @@ allTests["FETCH"] = require("./fetch-tests"); allTests["APPLICATION SETTINGS"] = require("./application-settings-tests"); allTests["APPLICATION"] = require("./application-tests"); allTests["IMAGE SOURCE"] = require("./image-source-tests"); -allTests["OBSERVABLE-ARRAY"] = require("./observable-array-tests"); -allTests["VIRTUAL-ARRAY"] = require("./virtual-array-tests"); -allTests["OBSERVABLE"] = require("./observable-tests"); +allTests["OBSERVABLE-ARRAY"] = require("./data/observable-array-tests"); +allTests["VIRTUAL-ARRAY"] = require("./data/virtual-array-tests"); +allTests["OBSERVABLE"] = require("./data/observable-tests"); allTests["TIMER"] = require("./timer-tests"); allTests["COLOR"] = require("./color-tests"); allTests["DEPENDENCY-OBSERVABLE"] = require("./ui/dependency-observable-tests"); @@ -57,17 +57,17 @@ allTests["PROXY-VIEW-CONTAINER"] = require("./ui/proxy-view-container/proxy-view allTests["SCROLL-VIEW"] = require("./ui/scroll-view/scroll-view-tests"); allTests["ACTION-BAR"] = require("./ui/action-bar/action-bar-tests"); allTests["XML-DECLARATION"] = require("./xml-declaration/xml-declaration-tests"); -allTests["DOCKLAYOUT"] = require("./layouts/dock-layout-tests"); -allTests["WRAPLAYOUT"] = require("./layouts/wrap-layout-tests"); -allTests["ABSOLUTELAYOUT"] = require("./layouts/absolute-layout-tests"); -allTests["GRIDLAYOUT"] = require("./layouts/grid-layout-tests"); -allTests["STACKLAYOUT"] = require("./layouts/stack-layout-tests"); -allTests["STYLE-PROPERTIES"] = require("./ui/style/style-properties-tests"); -allTests["FRAME"] = require("./frame-tests"); +allTests["DOCKLAYOUT"] = require("./ui/layouts/dock-layout-tests"); +allTests["WRAPLAYOUT"] = require("./ui/layouts/wrap-layout-tests"); +allTests["ABSOLUTELAYOUT"] = require("./ui/layouts/absolute-layout-tests"); +allTests["GRIDLAYOUT"] = require("./ui/layouts/grid-layout-tests"); +allTests["STACKLAYOUT"] = require("./ui/layouts/stack-layout-tests"); +allTests["STYLE-PROPERTIES"] = require("./ui/styling/style-properties-tests"); +allTests["FRAME"] = require("./ui/frame/frame-tests"); allTests["VIEW"] = require("./ui/view/view-tests"); -allTests["STYLE"] = require("./ui/style/style-tests"); -allTests["VISUAL-STATE"] = require("./ui/style/visual-state-tests"); -allTests["VALUE-SOURCE"] = require("./ui/style/value-source-tests"); +allTests["STYLE"] = require("./ui/styling/style-tests"); +allTests["VISUAL-STATE"] = require("./ui/styling/visual-state-tests"); +allTests["VALUE-SOURCE"] = require("./ui/styling/value-source-tests"); allTests["BUTTON"] = require("./ui/button/button-tests"); allTests["BORDER"] = require("./ui/border/border-tests"); allTests["LABEL"] = require("./ui/label/label-tests"); diff --git a/apps/tests/text/formatted-string.md b/apps/tests/text/formatted-string.md index bcb51f15a..11a8eb27d 100644 --- a/apps/tests/text/formatted-string.md +++ b/apps/tests/text/formatted-string.md @@ -1,7 +1,8 @@ --- nav-title: "Formatted String How-To" -title: "How-To" +title: "formatted-string" description: "Examples for using Formatted String" +previous_url: /ApiReference/text/formatted-string/HOW-TO --- # Formatted String Using a formatted string requires loading formatted-string and span module. diff --git a/apps/tests/timer.md b/apps/tests/timer.md index 1b474e178..9fb438707 100644 --- a/apps/tests/timer.md +++ b/apps/tests/timer.md @@ -1,7 +1,8 @@ --- nav-title: "timer How-To" -title: "How-To" +title: "timer" description: "Examples for using timer" +previous_url: /ApiReference/timer/HOW-TO --- # Timer module ### How to require timer module diff --git a/apps/tests/trace.md b/apps/tests/trace.md index 62554639c..97a6c967e 100644 --- a/apps/tests/trace.md +++ b/apps/tests/trace.md @@ -1,7 +1,8 @@ --- nav-title: "trace How-To" -title: "How-To" +title: "trace" description: "Examples for using trace" +previous_url: /ApiReference/trace/HOW-TO --- # Trace Tracing information about your app requires the "trace" module. diff --git a/apps/tests/ui/action-bar/action-bar.md b/apps/tests/ui/action-bar/action-bar.md index c2e8c1e3a..4c2464a5f 100644 --- a/apps/tests/ui/action-bar/action-bar.md +++ b/apps/tests/ui/action-bar/action-bar.md @@ -1,7 +1,8 @@ --- nav-title: "ActionBar How-To" -title: "How-To" +title: "action-bar" description: "Examples for using ActionBar" +previous_url: /ApiReference/ui/action-bar/HOW-TO --- # ActionBar Using a ActionBar requires the action-bar module. diff --git a/apps/tests/ui/activity-indicator/activity-indicator.md b/apps/tests/ui/activity-indicator/activity-indicator.md index 80ee31207..9d990d207 100644 --- a/apps/tests/ui/activity-indicator/activity-indicator.md +++ b/apps/tests/ui/activity-indicator/activity-indicator.md @@ -1,7 +1,8 @@ --- nav-title: "activity-indicator How-To" -title: "How-To" +title: "activity-indicator" description: "Examples for using activity-indicator" +previous_url: /ApiReference/ui/activity-indicator/HOW-TO --- # ActivityIndicator Using the activity indicator requires the ActivityIndicator module. diff --git a/apps/tests/ui/animation/animation.md b/apps/tests/ui/animation/animation.md index 78d666998..1512f4bcc 100644 --- a/apps/tests/ui/animation/animation.md +++ b/apps/tests/ui/animation/animation.md @@ -1,7 +1,8 @@ --- nav-title: "animation How-To" -title: "How-To" +title: "animation" description: "Examples for using animation" +previous_url: /ApiReference/ui/animation/HOW-TO --- # Animation Animating view properties requires the "ui/animation" module. diff --git a/apps/tests/ui/bindable-tests.ts b/apps/tests/ui/bindable-tests.ts index 37a6b9b1c..8d9b4aef6 100644 --- a/apps/tests/ui/bindable-tests.ts +++ b/apps/tests/ui/bindable-tests.ts @@ -492,6 +492,7 @@ export var test_bindingToNestedPropertyWithValueSyntax = function () { }, bindingSource); TKUnit.assertEqual(testElement.get("targetPropertyName"), "testValue"); + TKUnit.assertTrue(bindingSource['$value'] === undefined, "We should not add $value to bindingSource."); } export var test_TwoElementsBindingToSameBindingContext = function () { @@ -546,6 +547,58 @@ export var test_BindingToSource_FailsAfterBindingContextChange = function () { helper.buildUIAndRunTest(createLabel(), testFunc); } +export var test_BindingToParentView_ShouldNotLeaveGarbageInViewModel = function () { + var createStack = function () { + var stack = new stackLayoutModule.StackLayout(); + var label = new labelModule.Label(); + stack.addChild(label); + return stack; + } + var stackViewModel = new observable.Observable(); + var expectedValue = "testValue"; + stackViewModel.set("testProperty", expectedValue); + + var testFunc = function (views: Array) { + let testStack = (views[0]); + testStack.bindingContext = stackViewModel; + + let testLabel = (testStack.getChildAt(0)); + testLabel.bind({ sourceProperty: "$parent.testProperty", targetProperty: "text", expression: "$parent.testProperty"}); + + TKUnit.assertEqual(testLabel.text, expectedValue); + TKUnit.assertTrue(stackViewModel['$parent'] === undefined, "stackViewModel['$parent'] should be removed from parent binding context."); + TKUnit.assertTrue(testLabel.bindingContext['$parent'] === undefined, "testLabel.bindingContext['$parent'] should be removed from parent binding context."); + } + + helper.buildUIAndRunTest(createStack(), testFunc); +} + +export var test_BindingToParentsView_ShouldNotLeaveGarbageInViewModel = function () { + var createStack = function () { + var stack = new stackLayoutModule.StackLayout(); + var label = new labelModule.Label(); + stack.addChild(label); + return stack; + } + var stackViewModel = new observable.Observable(); + var expectedValue = "testValue"; + stackViewModel.set("testProperty", expectedValue); + + var testFunc = function (views: Array) { + let testStack = (views[0]); + testStack.bindingContext = stackViewModel; + + let testLabel = (testStack.getChildAt(0)); + testLabel.bind({ sourceProperty: "$parents['StackLayout'].testProperty", targetProperty: "text", expression: "$parents['StackLayout'].testProperty"}); + + TKUnit.assertEqual(testLabel.text, expectedValue); + TKUnit.assertTrue(stackViewModel['$parent'] === undefined, "stackViewModel['$parent'] should be removed from parent binding context."); + TKUnit.assertTrue(testLabel.bindingContext['$parents'] === undefined, "testLabel.bindingContext['$parents'] should be removed from parent binding context."); + } + + helper.buildUIAndRunTest(createStack(), testFunc); +} + export function test_BindingToDictionaryAtAppLevel() { var createLabel = function () { var label = new labelModule.Label(); @@ -998,6 +1051,7 @@ export function test_$ValueSupportWithinExpression() { model.set("anyColor", "red"); TKUnit.assertEqual(bindableObj.get("test"), "red", "When anyColor is red test property should be red too."); + TKUnit.assertTrue(model['$value'] === undefined, "We should not add $value to binding context."); } class DummyNestedClass extends observable.Observable { diff --git a/apps/tests/ui/border/border.md b/apps/tests/ui/border/border.md index f507ba630..8e59019b2 100644 --- a/apps/tests/ui/border/border.md +++ b/apps/tests/ui/border/border.md @@ -1,7 +1,8 @@ --- nav-title: "Border How-To" -title: "How-To" +title: "border" description: "Examples for using Border" +previous_url: /ApiReference/ui/border/HOW-TO --- # Border Using borders requires the "ui/border" module. diff --git a/apps/tests/ui/button/button.md b/apps/tests/ui/button/button.md index 76f5381ea..a169be073 100644 --- a/apps/tests/ui/button/button.md +++ b/apps/tests/ui/button/button.md @@ -1,7 +1,8 @@ --- nav-title: "button How-To" -title: "How-To" +title: "button" description: "Examples for using button" +previous_url: /ApiReference/ui/button/HOW-TO --- # Button ### Declaring button module diff --git a/apps/tests/ui/date-picker/date-picker.md b/apps/tests/ui/date-picker/date-picker.md index 4e12c68c9..1df9a0076 100644 --- a/apps/tests/ui/date-picker/date-picker.md +++ b/apps/tests/ui/date-picker/date-picker.md @@ -1,7 +1,8 @@ --- nav-title: "DatePicker How-To" -title: "How-To" +title: "date-picker" description: "Examples for using DatePicker" +previous_url: /ApiReference/ui/date-picker/HOW-TO --- # DatePicker Using a DatePicker requires the "ui/date-picker" module. diff --git a/apps/tests/ui/dialogs/dialog.md b/apps/tests/ui/dialogs/dialogs.md similarity index 85% rename from apps/tests/ui/dialogs/dialog.md rename to apps/tests/ui/dialogs/dialogs.md index 2644f3233..35f684aea 100644 --- a/apps/tests/ui/dialogs/dialog.md +++ b/apps/tests/ui/dialogs/dialogs.md @@ -1,7 +1,8 @@ --- nav-title: "dialogs How-To" -title: "How-To" +title: "dialogs" description: "Examples for using dialogs" +previous_url: /ApiReference/ui/dialogs/HOW-TO --- # Dialogs Displaying dialogs requires the "ui/dialogs" module. diff --git a/apps/tests/frame-tests.ts b/apps/tests/ui/frame/frame-tests.ts similarity index 100% rename from apps/tests/frame-tests.ts rename to apps/tests/ui/frame/frame-tests.ts diff --git a/apps/tests/frame.md b/apps/tests/ui/frame/frame.md similarity index 88% rename from apps/tests/frame.md rename to apps/tests/ui/frame/frame.md index fdd3008bd..876473dc1 100644 --- a/apps/tests/frame.md +++ b/apps/tests/ui/frame/frame.md @@ -1,7 +1,8 @@ --- nav-title: "frame How-To" -title: "How-To" +title: "frame" description: "Examples for using frame" +previous_url: /ApiReference/ui/frame/HOW-TO --- # Frame To perform navigation, you will need a reference to the topmost frame of the application. diff --git a/apps/tests/gestures-tests.ts b/apps/tests/ui/gestures/gestures-tests.ts similarity index 100% rename from apps/tests/gestures-tests.ts rename to apps/tests/ui/gestures/gestures-tests.ts diff --git a/apps/tests/gestures.md b/apps/tests/ui/gestures/gestures.md similarity index 94% rename from apps/tests/gestures.md rename to apps/tests/ui/gestures/gestures.md index 205604b38..25a59e642 100644 --- a/apps/tests/gestures.md +++ b/apps/tests/ui/gestures/gestures.md @@ -1,7 +1,8 @@ --- nav-title: "gestures How-To" -title: "How-To" +title: "gestures" description: "Examples for using gestures" +previous_url: /ApiReference/ui/gestures/HOW-TO --- # Gestures Detecting user gestures requires the "ui/gestures" module. diff --git a/apps/tests/ui/html-view/htm-view.md b/apps/tests/ui/html-view/htm-view.md index 937a7b177..06e3f6493 100644 --- a/apps/tests/ui/html-view/htm-view.md +++ b/apps/tests/ui/html-view/htm-view.md @@ -1,7 +1,8 @@ --- nav-title: "HtmlView How-To" -title: "How-To" +title: "html-view" description: "Examples for using HtmlView" +previous_url: /ApiReference/ui/html-view/HOW-TO --- # HtmlView Using a HtmlView requires the html-view module. diff --git a/apps/tests/ui/image-cache/image-cache.md b/apps/tests/ui/image-cache/image-cache.md index fc8d99f10..9f2141aa9 100644 --- a/apps/tests/ui/image-cache/image-cache.md +++ b/apps/tests/ui/image-cache/image-cache.md @@ -1,7 +1,8 @@ --- nav-title: "image-cache How-To" -title: "How-To" +title: "image-cache" description: "Examples for using image-cache" +previous_url: /ApiReference/ui/image-cache/HOW-TO --- # ImageCache Using the ImageCache requires the "ui/image-cache" module. diff --git a/apps/tests/ui/image/image.md b/apps/tests/ui/image/image.md index 86d26500b..6cf3f157e 100644 --- a/apps/tests/ui/image/image.md +++ b/apps/tests/ui/image/image.md @@ -1,7 +1,8 @@ --- nav-title: "Image How-To" -title: "How-To" +title: "image" description: "Examples for using Image" +previous_url: /ApiReference/ui/image/HOW-TO --- # Image Using an image requires the Image module to be loaded. diff --git a/apps/tests/ui/label/label.md b/apps/tests/ui/label/label.md index a4f53b73a..2847a94ff 100644 --- a/apps/tests/ui/label/label.md +++ b/apps/tests/ui/label/label.md @@ -1,7 +1,8 @@ --- nav-title: "Label How-To" -title: "How-To" +title: "label" description: "Examples for using Label" +previous_url: /ApiReference/ui/label/HOW-TO --- # Label Using a label requires the Label module. diff --git a/apps/tests/layouts/absolute-layout-tests.ts b/apps/tests/ui/layouts/absolute-layout-tests.ts similarity index 98% rename from apps/tests/layouts/absolute-layout-tests.ts rename to apps/tests/ui/layouts/absolute-layout-tests.ts index df28a37a2..3fd0b399d 100644 --- a/apps/tests/layouts/absolute-layout-tests.ts +++ b/apps/tests/ui/layouts/absolute-layout-tests.ts @@ -1,5 +1,5 @@ -import testModule = require("../ui-test"); -import TKUnit = require("../TKUnit"); +import testModule = require("../../ui-test"); +import TKUnit = require("../../TKUnit"); import labelModule = require("ui/label"); import colorModule = require("color"); import layoutHelper = require("./layout-helper"); diff --git a/apps/tests/layouts/absolute-layout.md b/apps/tests/ui/layouts/absolute-layout.md similarity index 83% rename from apps/tests/layouts/absolute-layout.md rename to apps/tests/ui/layouts/absolute-layout.md index ca920e27e..86d0cf78e 100644 --- a/apps/tests/layouts/absolute-layout.md +++ b/apps/tests/ui/layouts/absolute-layout.md @@ -1,7 +1,8 @@ --- nav-title: "absolute-layout How-To" -title: "How-To" +title: "absolute-layoyt" description: "Examples for using absolute-layout" +previous_url: /ApiReference/ui/layouts/absolute-layout/HOW-TO --- # AbsoluteLayout Using a AbsoluteLayout requires the AbsoluteLayout module. diff --git a/apps/tests/layouts/common-layout-tests.ts b/apps/tests/ui/layouts/common-layout-tests.ts similarity index 98% rename from apps/tests/layouts/common-layout-tests.ts rename to apps/tests/ui/layouts/common-layout-tests.ts index d1c36909c..f87173408 100644 --- a/apps/tests/layouts/common-layout-tests.ts +++ b/apps/tests/ui/layouts/common-layout-tests.ts @@ -1,7 +1,7 @@ -import TKUnit = require("../TKUnit"); +import TKUnit = require("../../TKUnit"); import layoutHelper = require("./layout-helper"); import enums = require("ui/enums"); -import testModule = require("../ui-test"); +import testModule = require("../../ui-test"); import {LayoutBase} from "ui/layouts/layout-base"; import {widthProperty} from "ui/styling/style" import platform = require("platform"); @@ -152,4 +152,4 @@ export function percent_support_test(test: testModule.UITest) { TKUnit.assertEqual(bounds.top, 0, "Reset Stretch layout TOP incorrect"); TKUnit.assertEqual(bounds.right, 200, "Reset Stretch layout RIGHT incorrect"); TKUnit.assertEqual(bounds.bottom, 200, "Reset Stretch layout BOTTOM incorrect"); -} \ No newline at end of file +} diff --git a/apps/tests/layouts/dock-layout-tests.ts b/apps/tests/ui/layouts/dock-layout-tests.ts similarity index 98% rename from apps/tests/layouts/dock-layout-tests.ts rename to apps/tests/ui/layouts/dock-layout-tests.ts index 06c440475..a209b51d0 100644 --- a/apps/tests/layouts/dock-layout-tests.ts +++ b/apps/tests/ui/layouts/dock-layout-tests.ts @@ -1,8 +1,8 @@ import button = require("ui/button"); import {DockLayout} from "ui/layouts/dock-layout"; -import TKUnit = require("../TKUnit"); +import TKUnit = require("../../TKUnit"); import helper = require("./layout-helper"); -import testModule = require("../ui-test"); +import testModule = require("../../ui-test"); import layoutHelper = require("./layout-helper"); import commonTests = require("./common-layout-tests"); diff --git a/apps/tests/layouts/dock-layout.md b/apps/tests/ui/layouts/dock-layout.md similarity index 90% rename from apps/tests/layouts/dock-layout.md rename to apps/tests/ui/layouts/dock-layout.md index ac332b1a0..03d85ff80 100644 --- a/apps/tests/layouts/dock-layout.md +++ b/apps/tests/ui/layouts/dock-layout.md @@ -1,8 +1,8 @@ - --- nav-title: "dock-layout How-To" -title: "How-To" +title: "dock-layout" description: "Examples for using dock-layout" +previous_url: /ApiReference/ui/layouts/dock-layout/HOW-TO --- # DockLayout Using a DockLayout requires the DockLayout module. @@ -33,5 +33,5 @@ Other frequently used modules when working with a DockLayout include: ## Remove child view from layout -## Setting the dock property +## Setting the dock roperty diff --git a/apps/tests/layouts/grid-layout-tests.ts b/apps/tests/ui/layouts/grid-layout-tests.ts similarity index 99% rename from apps/tests/layouts/grid-layout-tests.ts rename to apps/tests/ui/layouts/grid-layout-tests.ts index f3ce31fed..34653e4a0 100644 --- a/apps/tests/layouts/grid-layout-tests.ts +++ b/apps/tests/ui/layouts/grid-layout-tests.ts @@ -1,11 +1,11 @@ import {Page} from "ui/page"; import {GridLayout, ItemSpec, GridUnitType} from "ui/layouts/grid-layout"; import {Button} from "ui/button"; -import TKUnit = require("../TKUnit"); +import TKUnit = require("../../TKUnit"); import view = require("ui/core/view"); import builder = require("ui/builder"); import enums = require("ui/enums"); -import testModule = require("../ui-test"); +import testModule = require("../../ui-test"); import layoutHelper = require("./layout-helper"); import platform = require("platform"); import commonTests = require("./common-layout-tests"); diff --git a/apps/tests/layouts/grid-layout.md b/apps/tests/ui/layouts/grid-layout.md similarity index 92% rename from apps/tests/layouts/grid-layout.md rename to apps/tests/ui/layouts/grid-layout.md index 84cf24f0e..0e8691847 100644 --- a/apps/tests/layouts/grid-layout.md +++ b/apps/tests/ui/layouts/grid-layout.md @@ -1,7 +1,8 @@ --- nav-title: "grid-layout How-To" -title: "How-To" +title: "grid-layout" description: "Examples for using grid-layout" +previous_url: /ApiReference/ui/layouts/grid-layout/HOW-TO --- ## GridLayout sample ### Creating Grid Layout via code. diff --git a/apps/tests/layouts/layout-helper.android.ts b/apps/tests/ui/layouts/layout-helper.android.ts similarity index 99% rename from apps/tests/layouts/layout-helper.android.ts rename to apps/tests/ui/layouts/layout-helper.android.ts index 83ad1da07..33eec9f32 100644 --- a/apps/tests/layouts/layout-helper.android.ts +++ b/apps/tests/ui/layouts/layout-helper.android.ts @@ -3,7 +3,7 @@ import {StackLayout} from "ui/layouts/stack-layout"; import {GridLayout} from "ui/layouts/grid-layout"; import utils = require("utils/utils"); -import TKUnit = require("../TKUnit"); +import TKUnit = require("../../TKUnit"); import def = require("./layout-helper"); var DELTA = 0.1; diff --git a/apps/tests/layouts/layout-helper.d.ts b/apps/tests/ui/layouts/layout-helper.d.ts similarity index 100% rename from apps/tests/layouts/layout-helper.d.ts rename to apps/tests/ui/layouts/layout-helper.d.ts diff --git a/apps/tests/layouts/layout-helper.ios.ts b/apps/tests/ui/layouts/layout-helper.ios.ts similarity index 99% rename from apps/tests/layouts/layout-helper.ios.ts rename to apps/tests/ui/layouts/layout-helper.ios.ts index ad399eb7b..acb7498ad 100644 --- a/apps/tests/layouts/layout-helper.ios.ts +++ b/apps/tests/ui/layouts/layout-helper.ios.ts @@ -2,7 +2,7 @@ import {StackLayout} from "ui/layouts/stack-layout"; import {GridLayout} from "ui/layouts/grid-layout"; import utils = require("utils/utils"); -import TKUnit = require("../TKUnit"); +import TKUnit = require("../../TKUnit"); import def = require("./layout-helper"); var DELTA = 0.1; @@ -197,4 +197,4 @@ export function dp(value: number): number { export function dip(value: number): number { return utils.layout.toDevicePixels(value); -} \ No newline at end of file +} diff --git a/apps/tests/layouts/stack-layout-tests.ts b/apps/tests/ui/layouts/stack-layout-tests.ts similarity index 99% rename from apps/tests/layouts/stack-layout-tests.ts rename to apps/tests/ui/layouts/stack-layout-tests.ts index 4c0c5a472..8a0be9256 100644 --- a/apps/tests/layouts/stack-layout-tests.ts +++ b/apps/tests/ui/layouts/stack-layout-tests.ts @@ -1,10 +1,10 @@ import {StackLayout} from "ui/layouts/stack-layout"; import {Button} from "ui/button"; -import TKUnit = require("../TKUnit"); +import TKUnit = require("../../TKUnit"); import helper = require("./layout-helper"); import enums = require("ui/enums"); import utils = require("utils/utils"); -import testModule = require("../ui-test"); +import testModule = require("../../ui-test"); import layoutHelper = require("./layout-helper"); import commonTests = require("./common-layout-tests"); diff --git a/apps/tests/layouts/stack-layout.md b/apps/tests/ui/layouts/stack-layout.md similarity index 89% rename from apps/tests/layouts/stack-layout.md rename to apps/tests/ui/layouts/stack-layout.md index d0750a5e1..922e1e079 100644 --- a/apps/tests/layouts/stack-layout.md +++ b/apps/tests/ui/layouts/stack-layout.md @@ -1,7 +1,8 @@ --- nav-title: "stack-layout How-To" -title: "How-To" +title: "stack-layout" description: "Examples for using stack-layout" +previous_url: /ApiReference/ui/layouts/stack-layout/HOW-TO --- ### import StackLayout and Button classes var StackLayout = require("ui/layouts/stack-layout").StackLayout; diff --git a/apps/tests/layouts/wrap-layout-tests.ts b/apps/tests/ui/layouts/wrap-layout-tests.ts similarity index 99% rename from apps/tests/layouts/wrap-layout-tests.ts rename to apps/tests/ui/layouts/wrap-layout-tests.ts index 9c6ec4cbf..0282da099 100644 --- a/apps/tests/layouts/wrap-layout-tests.ts +++ b/apps/tests/ui/layouts/wrap-layout-tests.ts @@ -1,7 +1,7 @@ -import TKUnit = require("../TKUnit"); +import TKUnit = require("../../TKUnit"); import {Label} from "ui/label"; import layoutHelper = require("./layout-helper"); -import testModule = require("../ui-test"); +import testModule = require("../../ui-test"); import commonTests = require("./common-layout-tests"); // >> wrap-layout-require diff --git a/apps/tests/layouts/wrap-layout.md b/apps/tests/ui/layouts/wrap-layout.md similarity index 89% rename from apps/tests/layouts/wrap-layout.md rename to apps/tests/ui/layouts/wrap-layout.md index e08668be9..335fe0042 100644 --- a/apps/tests/layouts/wrap-layout.md +++ b/apps/tests/ui/layouts/wrap-layout.md @@ -1,7 +1,8 @@ --- nav-title: "WrapLayout How-To" -title: "How-To" +title: "wrap-layout" description: "Examples for using WrapLayout" +previous_url: /ApiReference/ui/layouts/wrap-layout/HOW-TO --- # WrapLayout Using a WrapLayout requires the WrapLayout module. diff --git a/apps/tests/ui/list-picker/list-picker-tests.ts b/apps/tests/ui/list-picker/list-picker-tests.ts index 2bf605312..39a9c711f 100644 --- a/apps/tests/ui/list-picker/list-picker-tests.ts +++ b/apps/tests/ui/list-picker/list-picker-tests.ts @@ -4,9 +4,9 @@ import viewModule = require("ui/core/view"); import listPickerTestsNative = require("./list-picker-tests-native"); import application = require("application"); -// >> article-require-module +// >> article-require-listpicker-module import listPickerModule = require("ui/list-picker"); -// << article-require-module +// << article-require-listpicker-module function _createListPicker(): listPickerModule.ListPicker { // >> article-create-listpicker @@ -227,4 +227,4 @@ export var test_Android_WhenSelectedIndexChangesEditTextIsUpdatedProperly = func var actualValue = (listPicker)._editText.getText().toString(); TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue); }); -} \ No newline at end of file +} diff --git a/apps/tests/ui/list-picker/list-picker.md b/apps/tests/ui/list-picker/list-picker.md index 92a4ee1ad..ec39791c2 100644 --- a/apps/tests/ui/list-picker/list-picker.md +++ b/apps/tests/ui/list-picker/list-picker.md @@ -1,11 +1,12 @@ --- nav-title: "ListPicker How-To" -title: "How-To" +title: "list-picker" description: "Examples for using ListPicker" +previous_url: /ApiReference/ui/list-picker/HOW-TO --- # ListPicker Using a ListPicker requires the "ui/list-picker" module. - + ## Creating a ListPicker ## Binding listPicker.items diff --git a/apps/tests/ui/list-view/list-view-tests.ts b/apps/tests/ui/list-view/list-view-tests.ts index 107bf721f..c10376391 100644 --- a/apps/tests/ui/list-view/list-view-tests.ts +++ b/apps/tests/ui/list-view/list-view-tests.ts @@ -7,9 +7,9 @@ import platform = require("platform"); import utils = require("utils/utils"); import { Label } from "ui/label"; -// >> article-require-module +// >> article-require-listview-module import listViewModule = require("ui/list-view"); -// << article-require-module +// << article-require-listview-module // >> article-require-modules import observableArray = require("data/observable-array"); diff --git a/apps/tests/ui/list-view/list-view.md b/apps/tests/ui/list-view/list-view.md index 7cd7f1fea..d6acbb1d7 100644 --- a/apps/tests/ui/list-view/list-view.md +++ b/apps/tests/ui/list-view/list-view.md @@ -1,11 +1,12 @@ --- nav-title: "list-view How-To" -title: "How-To" +title: "list-view" description: "Examples for using list-view" +previous_url: /ApiReference/ui/list-view/HOW-TO --- # ListView Using a ListView requires the ListView module. - + Other modules which will be used in the code samples in this article: ### Binding the ListView items property to collection in the view-model. diff --git a/apps/tests/ui/page/page-tests-common.ts b/apps/tests/ui/page/page-tests-common.ts index effd343e6..1e5ab5088 100644 --- a/apps/tests/ui/page/page-tests-common.ts +++ b/apps/tests/ui/page/page-tests-common.ts @@ -1,8 +1,8 @@ -// >> article-require-module +// >> article-require-page-module import pageModule = require("ui/page"); //// FrameModule is needed in order to have an option to navigate to the new page. import frameModule = require("ui/frame"); -// << article-require-module +// << article-require-page-module // >> article-set-bindingcontext function pageLoaded(args) { diff --git a/apps/tests/ui/page/page.md b/apps/tests/ui/page/page.md index f64449557..fcfda799a 100644 --- a/apps/tests/ui/page/page.md +++ b/apps/tests/ui/page/page.md @@ -1,11 +1,12 @@ --- nav-title: "Page How-To" -title: "How-To" +title: "page" description: "Examples for using Page" +previous_url: /ApiReference/ui/page/HOW-TO --- # Page Using a page requires the Page module. - + ### Attaching event handler for the Page loaded event to set bindingContext. ``` XML diff --git a/apps/tests/ui/placeholder/placeholder-tests.ts b/apps/tests/ui/placeholder/placeholder-tests.ts index edf5fb380..9d725b361 100644 --- a/apps/tests/ui/placeholder/placeholder-tests.ts +++ b/apps/tests/ui/placeholder/placeholder-tests.ts @@ -6,9 +6,9 @@ import utils = require("utils/utils"); import helper = require("../helper"); import viewModule = require("ui/core/view"); -// >> article-require-module +// >> article-require-placeholder-module import placeholderModule = require("ui/placeholder"); -// << article-require-module +// << article-require-placeholder-module function creatingView(args) { var nativeView; diff --git a/apps/tests/ui/placeholder/placeholder.md b/apps/tests/ui/placeholder/placeholder.md index 6f678a624..7091e21d1 100644 --- a/apps/tests/ui/placeholder/placeholder.md +++ b/apps/tests/ui/placeholder/placeholder.md @@ -1,11 +1,12 @@ --- nav-title: "placeholder How-To" -title: "How-To" +title: "placeholder" description: "Examples for using placeholder" +previous_url: /ApiReference/ui/placeholder/HOW-TO --- # Placeholder Using the placeholder requires the Placeholder module. - + Creating native view for the Placeholder using creatingView event. ``` XML diff --git a/apps/tests/ui/progress/progress-tests.ts b/apps/tests/ui/progress/progress-tests.ts index 4fc192205..65990d006 100644 --- a/apps/tests/ui/progress/progress-tests.ts +++ b/apps/tests/ui/progress/progress-tests.ts @@ -5,9 +5,9 @@ import observable = require("data/observable"); import color = require("color"); import platform = require("platform"); -// >> article-require-module +// >> article-require-progress-module import progressModule = require("ui/progress"); -// << article-require-module +// << article-require-progress-module export function test_default_TNS_values() { // >> article-create-progress-view diff --git a/apps/tests/ui/progress/progress.md b/apps/tests/ui/progress/progress.md index 10cad91ba..430943dc0 100644 --- a/apps/tests/ui/progress/progress.md +++ b/apps/tests/ui/progress/progress.md @@ -1,11 +1,12 @@ --- nav-title: "progress How-To" -title: "How-To" +title: "progress" description: "Examples for using progress" +previous_url: /ApiReference/ui/progress/HOW-TO --- # Progress Using the progress view requires the Progress module. - + Binding the Progress value property to a view-model property. ``` XML diff --git a/apps/tests/ui/repeater/repeater-tests.ts b/apps/tests/ui/repeater/repeater-tests.ts index c192c0f9c..75297c114 100644 --- a/apps/tests/ui/repeater/repeater-tests.ts +++ b/apps/tests/ui/repeater/repeater-tests.ts @@ -10,9 +10,9 @@ import pageModule = require("ui/page"); import gestureModule = require("ui/gestures"); import { Label } from "ui/label"; -// >> article-require-module +// >> article-require-repeater-module import repeaterModule = require("ui/repeater"); -// << article-require-module +// << article-require-repeater-module // >> article-require-modules import observableArray = require("data/observable-array"); diff --git a/apps/tests/ui/repeater/repeater.md b/apps/tests/ui/repeater/repeater.md index b123dbf70..e883537ab 100644 --- a/apps/tests/ui/repeater/repeater.md +++ b/apps/tests/ui/repeater/repeater.md @@ -1,11 +1,12 @@ --- nav-title: "repeater How-To" -title: "How-To" +title: "repeater" description: "Examples for using repeater" +previous_url: /ApiReference/ui/repeater/HOW-TO --- # Repeater Using a Repeater requires the repeater module. - + Other modules which will be used in the code samples in this article: ### Binding the Repeater items property to collection in the view-model. diff --git a/apps/tests/ui/scroll-view/scroll-view-tests.ts b/apps/tests/ui/scroll-view/scroll-view-tests.ts index d8cea51d3..a23cb00c5 100644 --- a/apps/tests/ui/scroll-view/scroll-view-tests.ts +++ b/apps/tests/ui/scroll-view/scroll-view-tests.ts @@ -3,13 +3,13 @@ import app = require("application"); import button = require("ui/button"); import enums = require("ui/enums"); import testModule = require("../../ui-test"); -import layoutHelper = require("../../layouts/layout-helper"); +import layoutHelper = require("../layouts/layout-helper"); import {Page} from "ui/page"; import * as frame from "ui/frame"; -// >> article-require-module +// >> article-require-scrollview-module import scrollViewModule = require("ui/scroll-view"); -// << article-require-module +// << article-require-scrollview-module class ScrollLayoutTest extends testModule.UITest { diff --git a/apps/tests/ui/scroll-view/scroll-view.md b/apps/tests/ui/scroll-view/scroll-view.md index cc7bbbd11..4c3028b5f 100644 --- a/apps/tests/ui/scroll-view/scroll-view.md +++ b/apps/tests/ui/scroll-view/scroll-view.md @@ -1,11 +1,12 @@ --- nav-title: "scroll-view How-To" -title: "How-To" +title: "scroll-view" description: "Examples for using scroll-view" +previous_url: /ApiReference/ui/scroll-view/HOW-TO --- # ScrollView Using a ScrollView requires the ScrollView module. - + ### Declaring the ScrollView. ``` XML diff --git a/apps/tests/ui/search-bar/search-bar-tests.ts b/apps/tests/ui/search-bar/search-bar-tests.ts index 9f459311c..b17a04ab6 100644 --- a/apps/tests/ui/search-bar/search-bar-tests.ts +++ b/apps/tests/ui/search-bar/search-bar-tests.ts @@ -4,9 +4,9 @@ import viewModule = require("ui/core/view"); import searchBarTestsNative = require("./search-bar-tests-native"); import colorModule = require("color"); import observable = require("data/observable"); -// >> article-require-module +// >> article-require-searchbar-module import searchBarModule = require("ui/search-bar"); -// << article-require-module +// << article-require-searchbar-module // ### Declaring a SearchBar. //``` XML diff --git a/apps/tests/ui/search-bar/search-bar.md b/apps/tests/ui/search-bar/search-bar.md index c8faf26de..834b81341 100644 --- a/apps/tests/ui/search-bar/search-bar.md +++ b/apps/tests/ui/search-bar/search-bar.md @@ -1,11 +1,12 @@ --- nav-title: "search-bar How-To" -title: "How-To" +title: "search-bar" description: "Examples for using search-bar" +previous_url: /ApiReference/ui/search-bar/HOW-TO --- # SearchBar Using the SearchBar requires the "ui/search-bar" module. - + ### Creating a SearchBar ### Searching diff --git a/apps/tests/ui/segmented-bar/segmented-bar-tests.ts b/apps/tests/ui/segmented-bar/segmented-bar-tests.ts index 72997ba28..ccd4bd7c8 100644 --- a/apps/tests/ui/segmented-bar/segmented-bar-tests.ts +++ b/apps/tests/ui/segmented-bar/segmented-bar-tests.ts @@ -6,9 +6,9 @@ import bindable = require("ui/core/bindable"); import observable = require("data/observable"); import color = require("color"); -// >> article-require-module +// >> article-require-segmentedbar-module import segmentedBarModule = require("ui/segmented-bar"); -// << article-require-module +// << article-require-segmentedbar-module function _createSegmentedBar(): segmentedBarModule.SegmentedBar { // >> article-create-segmentedbar diff --git a/apps/tests/ui/segmented-bar/segmented-bar.md b/apps/tests/ui/segmented-bar/segmented-bar.md index 7fad59685..f1435a449 100644 --- a/apps/tests/ui/segmented-bar/segmented-bar.md +++ b/apps/tests/ui/segmented-bar/segmented-bar.md @@ -1,11 +1,12 @@ --- nav-title: "SegmentedBar How-To" -title: "How-To" +title: "segmented-bar" description: "Examples for using SegmentedBar" +previous_url: /ApiReference/ui/segmented-bar/HOW-TO --- # SegmentedBar Using a SegmentedBar requires the "ui/segmented-bar" module. - + ## Creating a SegmentedBar ``` XML diff --git a/apps/tests/ui/slider/slider.md b/apps/tests/ui/slider/slider.md index 1319b0a72..afd428c59 100644 --- a/apps/tests/ui/slider/slider.md +++ b/apps/tests/ui/slider/slider.md @@ -1,7 +1,8 @@ --- nav-title: "slider How-To" -title: "How-To" +title: "slider" description: "Examples for using slider" +previous_url: /ApiReference/ui/slider/HOW-TO --- # Slider Using a slider requires the Slider module. diff --git a/apps/tests/ui/style/style-properties-tests.ts b/apps/tests/ui/styling/style-properties-tests.ts similarity index 100% rename from apps/tests/ui/style/style-properties-tests.ts rename to apps/tests/ui/styling/style-properties-tests.ts diff --git a/apps/tests/ui/style/style-tests.ts b/apps/tests/ui/styling/style-tests.ts similarity index 97% rename from apps/tests/ui/style/style-tests.ts rename to apps/tests/ui/styling/style-tests.ts index 1a0d7b585..71ae1f187 100644 --- a/apps/tests/ui/style/style-tests.ts +++ b/apps/tests/ui/styling/style-tests.ts @@ -683,7 +683,7 @@ export function test_CSS_isAppliedOnPage_From_Import() { helper.buildUIAndRunTest(testButton, function (views: Array) { var page: pageModule.Page = views[1]; - page.css = "@import url('~/ui/style/test.css');"; + page.css = "@import url('~/ui/styling/test.css');"; helper.assertViewBackgroundColor(page, "#FF0000"); }); } @@ -694,7 +694,7 @@ export function test_CSS_isAppliedOnPage_From_Import_Without_Url() { helper.buildUIAndRunTest(testButton, function (views: Array) { var page: pageModule.Page = views[1]; - page.css = "@import '~/ui/style/test.css';"; + page.css = "@import '~/ui/styling/test.css';"; helper.assertViewBackgroundColor(page, "#FF0000"); }); } @@ -705,7 +705,7 @@ export function test_CSS_isAppliedOnPage_From_addCssFile() { helper.buildUIAndRunTest(testButton, function (views: Array) { var page: pageModule.Page = views[1]; - page.addCssFile("~/ui/style/test.css"); + page.addCssFile("~/ui/styling/test.css"); helper.assertViewBackgroundColor(page, "#FF0000"); }); } @@ -1400,6 +1400,32 @@ export function test_alone_attr_selector() { } helper.buildUIAndRunTest(testButton, testFunc, testCss); } + +export function test_UsingSameSelectors_ShouldApplyLatest() { + let testButton = new buttonModule.Button(); + testButton.className = 'green'; + + let testCss = ".green { background-color: #FF0000; } .green { background-color: #00FF00; }"; + + let testFunc = function (views: Array) { + // style from correct type css should be applied + helper.assertViewBackgroundColor(testButton, "#00FF00"); + } + helper.buildUIAndRunTest(testButton, testFunc, testCss); +} + +export function test_UsingSameSelectorsWithSpecific_ShouldApplyLatest() { + let testButton = new buttonModule.Button(); + testButton.className = 'red green'; + + let testCss = ".red { background-color: #FF0000; } Button.green { background-color: #00FF00; }"; + + let testFunc = function (views: Array) { + // style from correct type css should be applied + helper.assertViewBackgroundColor(testButton, "#00FF00"); + } + helper.buildUIAndRunTest(testButton, testFunc, testCss); +} // // For information and example how to use style properties please refer to special [**Styling**](../../../styling.md) topic. // diff --git a/apps/tests/ui/style/style.md b/apps/tests/ui/styling/styling.md similarity index 90% rename from apps/tests/ui/style/style.md rename to apps/tests/ui/styling/styling.md index 9ffa5aeb2..8d0d0ecd0 100644 --- a/apps/tests/ui/style/style.md +++ b/apps/tests/ui/styling/styling.md @@ -1,7 +1,8 @@ --- nav-title: "styling How-To" -title: "How-To" +title: "styling" description: "Examples for using styling" +previous_url: ApiReference/ui/styling/HOW-TO --- # Styling ### Setting CSS to a page diff --git a/apps/tests/ui/style/test.css b/apps/tests/ui/styling/test.css similarity index 100% rename from apps/tests/ui/style/test.css rename to apps/tests/ui/styling/test.css diff --git a/apps/tests/ui/style/value-source-tests.ts b/apps/tests/ui/styling/value-source-tests.ts similarity index 100% rename from apps/tests/ui/style/value-source-tests.ts rename to apps/tests/ui/styling/value-source-tests.ts diff --git a/apps/tests/ui/style/visual-state-tests.ts b/apps/tests/ui/styling/visual-state-tests.ts similarity index 100% rename from apps/tests/ui/style/visual-state-tests.ts rename to apps/tests/ui/styling/visual-state-tests.ts diff --git a/apps/tests/ui/switch/switch.md b/apps/tests/ui/switch/switch.md index 4cb5fc845..70590e273 100644 --- a/apps/tests/ui/switch/switch.md +++ b/apps/tests/ui/switch/switch.md @@ -1,7 +1,8 @@ --- nav-title: "switch How-To" -title: "How-To" +title: "switch" description: "Examples for using switch" +previous_url: /ApiReference/ui/switch/HOW-TO --- # Switch Using a switch requires the Switch module. diff --git a/apps/tests/ui/tab-view/tab-view.md b/apps/tests/ui/tab-view/tab-view.md index 5d068fbd5..419e63a2b 100644 --- a/apps/tests/ui/tab-view/tab-view.md +++ b/apps/tests/ui/tab-view/tab-view.md @@ -1,7 +1,8 @@ --- nav-title: "TabView How-To" -title: "How-To" +title: "tab-view" description: "Examples for using TabView" +previous_url: /ApiReference/ui/tab-view/HOW-TO --- # TabView ### Declaring the TabView in xml. diff --git a/apps/tests/ui/text-field/text-field.md b/apps/tests/ui/text-field/text-field.md index eb253c34b..7ff25b5c0 100644 --- a/apps/tests/ui/text-field/text-field.md +++ b/apps/tests/ui/text-field/text-field.md @@ -1,7 +1,8 @@ --- nav-title: "TextField How-To" -title: "How-To" +title: "text-field" description: "Examples for using TextField" +previous_url: /ApiReference/ui/text-field/HOW-TO --- # TextField Using a TextField requires the text-field module. diff --git a/apps/tests/ui/text-view/text-view.md b/apps/tests/ui/text-view/text-view.md index 8565766ff..ad4079001 100644 --- a/apps/tests/ui/text-view/text-view.md +++ b/apps/tests/ui/text-view/text-view.md @@ -1,7 +1,8 @@ --- nav-title: "TextView How-To" -title: "How-To" +title: "text-view" description: "Examples for using TextView" +previous_url: /ApiReference/ui/text-view/HOW-TO --- # TextView Using a TextView requires the text-view module. diff --git a/apps/tests/ui/time-picker/time-picker.md b/apps/tests/ui/time-picker/time-picker.md index 2e4060d58..94bb7e797 100644 --- a/apps/tests/ui/time-picker/time-picker.md +++ b/apps/tests/ui/time-picker/time-picker.md @@ -1,7 +1,8 @@ --- nav-title: "TimePicker How-To" -title: "How-To" +title: "time-picker" description: "Examples for using TimePicker" +previous_url: /ApiReference/ui/time-picker/HOW-TO --- # TimePicker Using a TimePicker requires the "ui/time-picker" module. diff --git a/apps/tests/ui/web-view/web-view.md b/apps/tests/ui/web-view/web-view.md index 3edc8e419..aa59fb263 100644 --- a/apps/tests/ui/web-view/web-view.md +++ b/apps/tests/ui/web-view/web-view.md @@ -1,7 +1,8 @@ --- nav-title: "WebView How-To" -title: "How-To" +title: "web-view" description: "Examples for using WebView" +previous_url: /ApiReference/ui/web-view/HOW-TO --- # WebView Using a WebView requires the web-view module. @@ -15,4 +16,4 @@ Using a WebView requires the web-view module. ### Using WebView ### Using WebView - \ No newline at end of file + diff --git a/apps/tests/xml-parser-tests/xml-parser.md b/apps/tests/xml-parser-tests/xml-parser.md index fedbea2f5..920bb25c5 100644 --- a/apps/tests/xml-parser-tests/xml-parser.md +++ b/apps/tests/xml-parser-tests/xml-parser.md @@ -1,7 +1,8 @@ --- nav-title: "xml How-To" -title: "How-To" +title: "xml" description: "Examples for using xml" +previous_url: /ApiReference/xml/HOW-TO --- # Xml module Using xml requires the Xml module. diff --git a/gruntfile.js b/gruntfile.js index 136626241..29f2dc458 100644 --- a/gruntfile.js +++ b/gruntfile.js @@ -429,7 +429,7 @@ module.exports = function(grunt) { mochaNode: { cmd: "grunt simplemocha:node" }, - injectArticles: { + injectArticleSnippets: { cmd: "node node_modules/markdown-snippet-injector/index.js --root=<%= localCfg.srcAppsTests %> --docsroot=<%= localCfg.outArticlesDir %>" } }, @@ -663,6 +663,29 @@ module.exports = function(grunt) { grunt.registerTask("distribute-ts-apps-files", [ "copy:readyTsAppFiles" ]); + grunt.registerTask("herdArticles", function() { + var moveSinglesUp = function(dir) { + var objs = fs.readdirSync(dir); + for (var i=0; i) { let parentViewAndIndex: { view: viewModule.View, index: number }; let parentView; + let addedProps = newProps || []; if (expression.indexOf(bc.bindingValueKey) > -1) { model[bc.bindingValueKey] = model; + addedProps.push(bc.bindingValueKey); } if (expression.indexOf(bc.parentValueKey) > -1) { parentView = this.getParentView(this.target.get(), bc.parentValueKey).view; if (parentView) { model[bc.parentValueKey] = parentView.bindingContext; + addedProps.push(bc.parentValueKey); } } @@ -464,6 +467,7 @@ export class Binding { if (parentViewAndIndex.view) { model[bc.parentsValueKey] = model[bc.parentsValueKey] || {}; model[bc.parentsValueKey][parentViewAndIndex.index] = parentViewAndIndex.view.bindingContext; + addedProps.push(bc.parentsValueKey); } } } diff --git a/ui/layouts/layout-base.ts b/ui/layouts/layout-base-common.ts similarity index 86% rename from ui/layouts/layout-base.ts rename to ui/layouts/layout-base-common.ts index ca2159dee..346831691 100644 --- a/ui/layouts/layout-base.ts +++ b/ui/layouts/layout-base-common.ts @@ -2,16 +2,26 @@ import types = require("utils/types"); import view = require("ui/core/view"); import dependencyObservable = require("ui/core/dependency-observable"); -import proxy = require("ui/core/proxy"); import utils = require("utils/utils"); import style = require("ui/styling/style"); -import * as platformModule from "platform"; -var platform: typeof platformModule; +import {PropertyChangeData, Property } from "ui/core/dependency-observable"; +import {PropertyMetadata } from "ui/core/proxy"; + +var clipToBoundsProperty = new Property( + "clipToBounds", + "LayoutBase", + new PropertyMetadata(true, dependencyObservable.PropertyMetadataSettings.None)); + +function onClipToBoundsPropertyChanged(data: PropertyChangeData) { + var layout = data.object; + layout._onClipToBoundsChanged(data.oldValue, data.newValue); +} + +(clipToBoundsProperty.metadata).onSetNativeValue = onClipToBoundsPropertyChanged; export class LayoutBase extends view.CustomLayoutView implements definition.LayoutBase, view.AddChildFromBuilder { - public static clipToBoundsProperty = new dependencyObservable.Property("clipToBounds", "LayoutBase", - new proxy.PropertyMetadata(true, dependencyObservable.PropertyMetadataSettings.None, LayoutBase.onClipToBoundsPropertyChanged, null, LayoutBase.onClipToBoundsPropertyChanged)); + public static clipToBoundsProperty = clipToBoundsProperty; private _subViews: Array = new Array(); @@ -120,21 +130,8 @@ export class LayoutBase extends view.CustomLayoutView implements definition.Layo this._setValue(LayoutBase.clipToBoundsProperty, value); } - protected onClipToBoundsChanged(oldValue: boolean, newValue: boolean) { - if (!this._nativeView) { - return; - } - - if (!platform) { - platform = require("platform"); - } - - if (platform.device.os === platform.platformNames.ios) { - this._nativeView.clipsToBounds = newValue; - } - else if (platform.device.os === platform.platformNames.android) { - this._nativeView.setClipChildren(newValue); - } + public _onClipToBoundsChanged(oldValue: boolean, newValue: boolean) { + // } public _childIndexToNativeChildIndex(index?: number): number { @@ -182,11 +179,6 @@ export class LayoutBase extends view.CustomLayoutView implements definition.Layo } - private static onClipToBoundsPropertyChanged(data: dependencyObservable.PropertyChangeData): void { - var layout = data.object; - layout.onClipToBoundsChanged(data.oldValue, data.newValue); - } - protected static adjustChildrenLayoutParams(layoutBase: LayoutBase, widthMeasureSpec: number, heightMeasureSpec: number): void { let availableWidth = utils.layout.getMeasureSpecSize(widthMeasureSpec); let widthSpec = utils.layout.getMeasureSpecMode(widthMeasureSpec); @@ -255,3 +247,4 @@ export class LayoutBase extends view.CustomLayoutView implements definition.Layo } } } + diff --git a/ui/layouts/layout-base.android.ts b/ui/layouts/layout-base.android.ts new file mode 100644 index 000000000..a24b9206a --- /dev/null +++ b/ui/layouts/layout-base.android.ts @@ -0,0 +1,16 @@ +import common = require("./layout-base-common"); + +export class LayoutBase extends common.LayoutBase { + public _onClipToBoundsChanged(oldValue: boolean, newValue: boolean) { + // We can't implement this without calling setClipChildren(false) on every ancestor up in the visual tree, + // which will kill performance. It will also lead to unwanted side effects such as other totally unrelated + // views being affected by setting the parents' setClipChildren to false. + // The problem in Android is that a ViewGroup either clips ALL of its children or it does not. Unlike iOS, the clipping + // cannot be controlled on a per view basis. So clipToBounds=false will have to be somehow achieved with stacking different + // views on top of one another in an AbsoluteLayout or GridLayout. There is always a workaround when playing with layouts. + // + // The following article explains this in detail: + // http://stackoverflow.com/questions/25044085/when-drawing-outside-the-view-clip-bounds-with-android-how-do-i-prevent-underli + console.warn(`clipToBounds with value false is not supported on Android. You can use this.android.getParent().setClipChildren(false) as an alternative`); + } +} \ No newline at end of file diff --git a/ui/layouts/layout-base.ios.ts b/ui/layouts/layout-base.ios.ts new file mode 100644 index 000000000..b253e7e02 --- /dev/null +++ b/ui/layouts/layout-base.ios.ts @@ -0,0 +1,9 @@ +import common = require("./layout-base-common"); + +export class LayoutBase extends common.LayoutBase { + public _onClipToBoundsChanged(oldValue: boolean, newValue: boolean) { + if (this._nativeView) { + this._nativeView.clipsToBounds = newValue; + } + } +} \ No newline at end of file diff --git a/ui/styling/css-selector.ts b/ui/styling/css-selector.ts index 026d52a5f..15f6b2121 100644 --- a/ui/styling/css-selector.ts +++ b/ui/styling/css-selector.ts @@ -143,7 +143,12 @@ export class CssSelector { class CssTypeSelector extends CssSelector { get specificity(): number { - return TYPE_SPECIFICITY; + let result = TYPE_SPECIFICITY; + let dotIndex = this.expression.indexOf(DOT); + if (dotIndex > -1) { + result += CLASS_SPECIFICITY; + } + return result; } public matches(view: view.View): boolean { let result = matchesType(this.expression, view); diff --git a/ui/web-view/web-view.android.ts b/ui/web-view/web-view.android.ts index 8ecc3b384..fed4f76f3 100644 --- a/ui/web-view/web-view.android.ts +++ b/ui/web-view/web-view.android.ts @@ -105,6 +105,13 @@ export class WebView extends common.WebView { this._android.setWebViewClient(this._webViewClient); } + public _onDetached(force?: boolean) { + if (this.android) { + this.android.destroy(); + } + super._onDetached(force); + } + public _loadUrl(url: string) { if (!this._android) { return;