Merge pull request #298 from NativeScript/feature/update-gallery-app

Feature/update gallery app
This commit is contained in:
Alexander Vakrilov
2015-04-20 18:17:18 +03:00
26 changed files with 348 additions and 110 deletions

View File

@@ -60,6 +60,9 @@
<Import Project="$(MSBuildBinPath)\Microsoft.CSharp.targets" />
<Import Project="$(VSToolsPath)\WebApplications\Microsoft.WebApplication.targets" Condition="'$(VSToolsPath)' != ''" />
<ItemGroup>
<TypeScriptCompile Include="apps\gallery-app\views\list-picker.ts">
<DependentUpon>list-picker.xml</DependentUpon>
</TypeScriptCompile>
<TypeScriptCompile Include="apps\pickers-demo\app.ts" />
<TypeScriptCompile Include="apps\pickers-demo\main-page.ts">
<DependentUpon>main-page.xml</DependentUpon>
@@ -72,9 +75,6 @@
<TypeScriptCompile Include="apps\gallery-app\views\list-view.ts">
<DependentUpon>list-view.xml</DependentUpon>
</TypeScriptCompile>
<TypeScriptCompile Include="apps\gallery-app\views\image.ts">
<DependentUpon>image.xml</DependentUpon>
</TypeScriptCompile>
<TypeScriptCompile Include="apps\placeholder-demo\app.ts" />
<TypeScriptCompile Include="apps\placeholder-demo\main-page.android.ts">
<DependentUpon>main-page.xml</DependentUpon>
@@ -572,6 +572,12 @@
<TypeScriptCompile Include="libjs.d.ts" />
</ItemGroup>
<ItemGroup>
<Content Include="apps\gallery-app\content\border.xml" />
<Content Include="apps\gallery-app\app.css" />
<Content Include="apps\gallery-app\views\list-picker.xml" />
<Content Include="apps\gallery-app\views\segmented-bar.xml" />
<Content Include="apps\gallery-app\views\time-picker.xml" />
<Content Include="apps\gallery-app\views\date-picker.xml" />
<Content Include="apps\pickers-demo\main-page.xml">
<SubType>Designer</SubType>
</Content>
@@ -722,9 +728,9 @@
<SubType>Designer</SubType>
</Content>
<TypeScriptCompile Include="camera\camera.d.ts" />
<TypeScriptCompile Include="camera\camera-common.ts" >
<DependentUpon>camera.d.ts</DependentUpon>
</TypeScriptCompile>
<TypeScriptCompile Include="camera\camera-common.ts">
<DependentUpon>camera.d.ts</DependentUpon>
</TypeScriptCompile>
<TypeScriptCompile Include="camera\camera.android.ts">
<DependentUpon>camera.d.ts</DependentUpon>
</TypeScriptCompile>
@@ -761,9 +767,6 @@
<Content Include="apps\gallery-app\layouts\wrap-layout.xml" />
<Content Include="apps\gallery-app\layouts\grid-layout.xml" />
<Content Include="apps\gallery-app\layouts\stack-layout.xml" />
<Content Include="apps\gallery-app\main-page.css">
<DependentUpon>main-page.xml</DependentUpon>
</Content>
<Content Include="apps\gallery-app\main-page.xml" />
<Content Include="apps\gallery-app\content\tab-view.xml" />
<TypeScriptCompile Include="apps\gallery-app\views\dialogs.ts">

View File

@@ -1,3 +1,7 @@
import application = require("application");
application.mainModule = "main-page";
// Needed only for build infrastructure
application.cssFile = "app.css";
application.start();

View File

@@ -0,0 +1,7 @@
<?xml version="1.0" encoding="UTF-8" ?>
<Page>
<Border cornerRadius="20" borderWidth="4" borderColor="darkgray"
style="background-color: lightblue; margin:20;">
<Label verticalAlignment="center" horizontalAlignment="center" text="Content" />
</Border>
</Page>

View File

@@ -16,6 +16,7 @@
<Button tag="content/tab-view" text="TabView" tap="itemTap" />
<Button tag="content/web-view" text="WebView" tap="itemTap" />
<Button tag="content/scroll-view" text="ScrollView" tap="itemTap" />
<Button tag="content/border" text="Border" tap="itemTap" />
</StackLayout>
<Label cssClass="title" text="Views" />
@@ -32,6 +33,10 @@
<Button tag="views/search-bar" text="SearchBar" tap="itemTap" />
<Button tag="views/list-view" text="ListView" tap="itemTap" />
<Button tag="views/dialogs" text="Dialogs" tap="itemTap" />
<Button tag="views/date-picker" text="DatePicker" tap="itemTap" />
<Button tag="views/time-picker" text="TimePicker" tap="itemTap" />
<Button tag="views/list-picker" text="ListPicker" tap="itemTap" />
<Button tag="views/segmented-bar" text="SegmentedBar" tap="itemTap" />
</StackLayout>
</StackLayout>
</ScrollView>

View File

@@ -0,0 +1,4 @@
<?xml version="1.0" encoding="UTF-8" ?>
<Page>
<DatePicker day="15" month="5" year="2015" verticalAlignment="center" horizontalAlignment="center"/>
</Page>

View File

@@ -1,10 +0,0 @@
import fs = require("file-system");
import imageSource = require("image-source");
export function pageLoaded(args) {
var page = args.object;
var telerikLogo = imageSource.fromFile(fs.path.join(__dirname, "../res/telerik-logo.png"));
page.bindingContext = { imageSource: telerikLogo };
}

View File

@@ -1,4 +1,4 @@
<?xml version="1.0" encoding="UTF-8" ?>
<Page loaded="pageLoaded">
<Page>
<Image margin="10" src="~/res/telerik-logo.png" verticalAlignment="center" horizontalAlignment="center"/>
</Page>

View File

@@ -0,0 +1,10 @@
import pages = require("ui/page");
import observableModule = require("data/observable");
export function onPageLoaded(args: observableModule.EventData) {
var page = <pages.Page>args.object;
page.bindingContext = {
items: ["Item 1", "Item 2", "Item 3", "Item 4", "Item 5"],
selectedIndex: 2
};
}

View File

@@ -0,0 +1,5 @@
<?xml version="1.0" encoding="UTF-8" ?>
<Page loaded="onPageLoaded">
<ListPicker items="{{ items }}" selectedIndex="{{ selectedIndex }}"
verticalAlignment="center" horizontalAlignment="center"/>
</Page>

View File

@@ -0,0 +1,10 @@
<?xml version="1.0" encoding="UTF-8" ?>
<Page>
<SegmentedBar style="vertical-align: center; margin: 20;">
<SegmentedBar.items>
<SegmentedBarItem title="Item 1" />
<SegmentedBarItem title="Item 2" />
<SegmentedBarItem title="Item 3" />
</SegmentedBar.items>
</SegmentedBar>
</Page>

View File

@@ -0,0 +1,4 @@
<?xml version="1.0" encoding="UTF-8" ?>
<Page>
<TimePicker hour="18" minute="30" verticalAlignment="center" horizontalAlignment="center"/>
</Page>

View File

@@ -31,3 +31,7 @@ export function setNativeMonth(datePicker: datePickerModule.DatePicker, value: n
export function setNativeDay(datePicker: datePickerModule.DatePicker, value: number): void {
datePicker.android.updateDate(datePicker.android.getYear(), datePicker.android.getMonth(), value);
}
export function setNativeDate(datePicker: datePickerModule.DatePicker, year: number, month: number, day: number): void {
datePicker.android.updateDate(year, month - 1, day);
}

View File

@@ -9,4 +9,6 @@ export declare function getNativeMinDate(datePicker: datePickerModule.DatePicker
export declare function setNativeYear(datePicker: datePickerModule.DatePicker, value: number): void;
export declare function setNativeMonth(datePicker: datePickerModule.DatePicker, value: number): void;
export declare function setNativeDay(datePicker: datePickerModule.DatePicker, value: number): void;
export declare function setNativeDay(datePicker: datePickerModule.DatePicker, value: number): void;
export declare function setNativeDate(datePicker: datePickerModule.DatePicker, year: number, month: number, day: number): void;

View File

@@ -41,4 +41,11 @@ export function setNativeDay(datePicker: datePickerModule.DatePicker, value: num
(<any>datePicker)._changeHandler.valueChanged(datePicker.ios);
}
export function setNativeDate(datePicker: datePickerModule.DatePicker, year: number, month: number, day: number): void {
var comps = NSCalendar.currentCalendar().componentsFromDate(NSCalendarUnit.NSCalendarUnitYear | NSCalendarUnit.NSCalendarUnitMonth | NSCalendarUnit.NSCalendarUnitDay, datePicker.ios.date);
comps.year = year;
comps.month = month;
comps.day = day;
datePicker.ios.setDateAnimated(NSCalendar.currentCalendar().dateFromComponents(comps), false);
(<any>datePicker)._changeHandler.valueChanged(datePicker.ios);
}

View File

@@ -11,7 +11,7 @@ import datePickerModule = require("ui/date-picker");
// ```
// </snippet>
function _createDatePicker(): datePickerModule.DatePicker {
function _createDatePicker(year?: number, month?: number, day?: number): datePickerModule.DatePicker {
// <snippet module="ui/date-picker" title="DatePicker">
// ## Creating a DatePicker
// ``` JavaScript
@@ -19,10 +19,23 @@ function _createDatePicker(): datePickerModule.DatePicker {
// ```
// </snippet>
datePicker.id = "DatePicker";
if (year) {
datePicker.year = year;
}
if (month) {
datePicker.month = month;
}
if (day) {
datePicker.day = day;
}
return datePicker;
}
export var test_DummyForCodeSnippet = function () {
export function test_DummyForCodeSnippet() {
helper.buildUIAndRunTest(_createDatePicker(), function (views: Array<viewModule.View>) {
var datePicker = <datePickerModule.DatePicker>views[0];
// <snippet module="ui/date-picker" title="DatePicker">
@@ -38,7 +51,7 @@ export var test_DummyForCodeSnippet = function () {
});
}
export var test_WhenCreated_YearIsUndefined = function () {
export function test_WhenCreated_YearIsUndefined() {
helper.buildUIAndRunTest(_createDatePicker(), function (views: Array<viewModule.View>) {
var datePicker = <datePickerModule.DatePicker>views[0];
var actualValue = datePicker.year;
@@ -47,7 +60,7 @@ export var test_WhenCreated_YearIsUndefined = function () {
});
}
export var test_WhenCreated_MonthIsUndefined = function () {
export function test_WhenCreated_MonthIsUndefined() {
helper.buildUIAndRunTest(_createDatePicker(), function (views: Array<viewModule.View>) {
var datePicker = <datePickerModule.DatePicker>views[0];
var actualValue = datePicker.month;
@@ -56,7 +69,7 @@ export var test_WhenCreated_MonthIsUndefined = function () {
});
}
export var test_WhenCreated_DayIsUndefined = function () {
export function test_WhenCreated_DayIsUndefined() {
helper.buildUIAndRunTest(_createDatePicker(), function (views: Array<viewModule.View>) {
var datePicker = <datePickerModule.DatePicker>views[0];
var actualValue = datePicker.day;
@@ -65,7 +78,7 @@ export var test_WhenCreated_DayIsUndefined = function () {
});
}
export var testYearFromLocalToNative = function () {
export function testYearFromLocalToNative() {
helper.buildUIAndRunTest(_createDatePicker(), function (views: Array<viewModule.View>) {
var datePicker = <datePickerModule.DatePicker>views[0];
var expectedValue = 1980;
@@ -75,7 +88,7 @@ export var testYearFromLocalToNative = function () {
});
}
export var testMonthFromLocalToNative = function () {
export function testMonthFromLocalToNative() {
helper.buildUIAndRunTest(_createDatePicker(), function (views: Array<viewModule.View>) {
var datePicker = <datePickerModule.DatePicker>views[0];
var expectedValue = 5;
@@ -85,7 +98,7 @@ export var testMonthFromLocalToNative = function () {
});
}
export var testDayFromLocalToNative = function () {
export function testDayFromLocalToNative() {
helper.buildUIAndRunTest(_createDatePicker(), function (views: Array<viewModule.View>) {
var datePicker = <datePickerModule.DatePicker>views[0];
var expectedValue = 19;
@@ -95,7 +108,7 @@ export var testDayFromLocalToNative = function () {
});
}
export var testMaxDateFromLocalToNative = function () {
export function testMaxDateFromLocalToNative() {
helper.buildUIAndRunTest(_createDatePicker(), function (views: Array<viewModule.View>) {
var datePicker = <datePickerModule.DatePicker>views[0];
var expectedValue = new Date(1980, 1, 9);
@@ -105,7 +118,7 @@ export var testMaxDateFromLocalToNative = function () {
});
}
export var testMinDateFromLocalToNative = function () {
export function testMinDateFromLocalToNative() {
helper.buildUIAndRunTest(_createDatePicker(), function (views: Array<viewModule.View>) {
var datePicker = <datePickerModule.DatePicker>views[0];
var expectedValue = new Date(1980, 1, 9);
@@ -115,7 +128,7 @@ export var testMinDateFromLocalToNative = function () {
});
}
export var testYearFromNativeToLocal = function () {
export function testYearFromNativeToLocal() {
helper.buildUIAndRunTest(_createDatePicker(), function (views: Array<viewModule.View>) {
var datePicker = <datePickerModule.DatePicker>views[0];
var expectedValue = 1981;
@@ -125,7 +138,7 @@ export var testYearFromNativeToLocal = function () {
});
}
export var testMonthFromNativeToLocal = function () {
export function testMonthFromNativeToLocal() {
helper.buildUIAndRunTest(_createDatePicker(), function (views: Array<viewModule.View>) {
var datePicker = <datePickerModule.DatePicker>views[0];
var expectedValue = 6;
@@ -135,7 +148,19 @@ export var testMonthFromNativeToLocal = function () {
});
}
export var testDayFromNativeToLocal = function () {
export function testYearMonthDayFromNativeToLocal() {
var testYear = 2000;
var testMonth = 3;
var testDay = 24;
helper.buildUIAndRunTest(_createDatePicker(), function (views: Array<viewModule.View>) {
var datePicker = <datePickerModule.DatePicker>views[0];
datePickerTestsNative.setNativeDate(datePicker, testYear, testMonth, testDay);
assertDate(datePicker, testYear, testMonth, testDay);
});
}
export function testDayFromNativeToLocal() {
helper.buildUIAndRunTest(_createDatePicker(), function (views: Array<viewModule.View>) {
var datePicker = <datePickerModule.DatePicker>views[0];
var expectedValue = 20;
@@ -145,7 +170,50 @@ export var testDayFromNativeToLocal = function () {
});
}
//export var testWTF = function () {
export function testSetYearMonthDay_BeforeLoaded() {
var testYear = 2000;
var testMonth = 3;
var testDay = 24;
helper.buildUIAndRunTest(_createDatePicker(testYear, testMonth, testDay), function (views: Array<viewModule.View>) {
var datePicker = <datePickerModule.DatePicker>views[0];
TKUnit.assertEqual(datePicker.year, testYear, "datePicker.year");
TKUnit.assertEqual(datePicker.month, testMonth, "datePicker.month");
TKUnit.assertEqual(datePicker.day, testDay, "datePicker.day");
TKUnit.assertEqual(datePickerTestsNative.getNativeYear(datePicker), testYear, "Native datePicker.year");
TKUnit.assertEqual(datePickerTestsNative.getNativeMonth(datePicker), testMonth, "Native datePicker.month");
TKUnit.assertEqual(datePickerTestsNative.getNativeDay(datePicker), testDay, "Native datePicker.day");
});
}
export function testSetYearMonthDay_AfterLoaded() {
var testYear = 2000;
var testMonth = 3;
var testDay = 24;
helper.buildUIAndRunTest(_createDatePicker(), function (views: Array<viewModule.View>) {
var datePicker = <datePickerModule.DatePicker>views[0];
datePicker.year = testYear;
datePicker.month = testMonth;
datePicker.day = testDay;
assertDate(datePicker, testYear, testMonth, testDay);
});
}
function assertDate(datePicker: datePickerModule.DatePicker, expectedYear: number, expectedMonth: number, expectedDay: number) {
TKUnit.assertEqual(datePicker.year, expectedYear, "datePicker.year");
TKUnit.assertEqual(datePicker.month, expectedMonth, "datePicker.month");
TKUnit.assertEqual(datePicker.day, expectedDay, "datePicker.day");
TKUnit.assertEqual(datePickerTestsNative.getNativeYear(datePicker), expectedYear, "Native datePicker.year");
TKUnit.assertEqual(datePickerTestsNative.getNativeMonth(datePicker), expectedMonth, "Native datePicker.month");
TKUnit.assertEqual(datePickerTestsNative.getNativeDay(datePicker), expectedDay, "Native datePicker.day");
}
//export function testWTF() {
// var picker = new UIDatePicker();
// picker.datePickerMode = UIDatePickerMode.UIDatePickerModeDate;
// var jsDate = new Date(1980, 1, 9);

View File

@@ -14,4 +14,9 @@ export function setNativeHour(timePicker: timePickerModule.TimePicker, value: nu
export function setNativeMinute(timePicker: timePickerModule.TimePicker, value: number): void {
timePicker.android.setCurrentMinute(new java.lang.Integer(value));
}
export function setNativeTime(timePicker: timePickerModule.TimePicker, hour: number, minute: number): void {
timePicker.android.setCurrentHour(new java.lang.Integer(hour));
timePicker.android.setCurrentMinute(new java.lang.Integer(minute));
}

View File

@@ -5,4 +5,6 @@ export declare function getNativeHour(timePicker: timePickerModule.TimePicker):
export declare function getNativeMinute(timePicker: timePickerModule.TimePicker): number;
export declare function setNativeHour(timePicker: timePickerModule.TimePicker, value: number): void;
export declare function setNativeMinute(timePicker: timePickerModule.TimePicker, value: number): void;
export declare function setNativeMinute(timePicker: timePickerModule.TimePicker, value: number): void;
export declare function setNativeTime(timePicker: timePickerModule.TimePicker, hour: number, minute: number): void;

View File

@@ -21,4 +21,12 @@ export function setNativeMinute(timePicker: timePickerModule.TimePicker, value:
timePicker.ios.setDateAnimated(NSCalendar.currentCalendar().dateFromComponents(comps), false);
(<any>timePicker)._changeHandler.valueChanged(timePicker.ios);
}
export function setNativeTime(timePicker: timePickerModule.TimePicker, hour: number, minute: number): void {
var comps = NSCalendar.currentCalendar().componentsFromDate(NSCalendarUnit.NSCalendarUnitHour | NSCalendarUnit.NSCalendarUnitMinute, timePicker.ios.date);
comps.hour = hour;
comps.minute = minute;
timePicker.ios.setDateAnimated(NSCalendar.currentCalendar().dateFromComponents(comps), false);
(<any>timePicker)._changeHandler.valueChanged(timePicker.ios);
}

View File

@@ -11,7 +11,7 @@ import timePickerModule = require("ui/time-picker");
// ```
// </snippet>
function _createTimePicker(): timePickerModule.TimePicker {
function _createTimePicker(hour?: number, minute?: number): timePickerModule.TimePicker {
// <snippet module="ui/time-picker" title="TimePicker">
// ## Creating a TimePicker
// ``` JavaScript
@@ -19,10 +19,19 @@ function _createTimePicker(): timePickerModule.TimePicker {
// ```
// </snippet>
timePicker.id = "timePicker";
if (hour) {
timePicker.hour = hour;
}
if (minute) {
timePicker.minute = minute;
}
return timePicker;
}
export var test_DummyForCodeSnippet = function () {
export function test_DummyForCodeSnippet() {
helper.buildUIAndRunTest(_createTimePicker(), function (views: Array<viewModule.View>) {
var timePicker = <timePickerModule.TimePicker>views[0];
// <snippet module="ui/time-picker" title="TimePicker">
@@ -35,7 +44,7 @@ export var test_DummyForCodeSnippet = function () {
});
}
export var test_WhenCreated_HourIsUndefined = function () {
export function test_WhenCreated_HourIsUndefined() {
helper.buildUIAndRunTest(_createTimePicker(), function (views: Array<viewModule.View>) {
var timePicker = <timePickerModule.TimePicker>views[0];
var actualValue = timePicker.hour;
@@ -44,7 +53,7 @@ export var test_WhenCreated_HourIsUndefined = function () {
});
}
export var test_WhenCreated_MinuteIsUndefined = function () {
export function test_WhenCreated_MinuteIsUndefined() {
helper.buildUIAndRunTest(_createTimePicker(), function (views: Array<viewModule.View>) {
var timePicker = <timePickerModule.TimePicker>views[0];
var actualValue = timePicker.minute;
@@ -53,7 +62,7 @@ export var test_WhenCreated_MinuteIsUndefined = function () {
});
}
export var testHourFromLocalToNative = function () {
export function testHourFromLocalToNative() {
helper.buildUIAndRunTest(_createTimePicker(), function (views: Array<viewModule.View>) {
var timePicker = <timePickerModule.TimePicker>views[0];
var expectedValue = 13;
@@ -63,7 +72,7 @@ export var testHourFromLocalToNative = function () {
});
}
export var testMinuteFromLocalToNative = function () {
export function testMinuteFromLocalToNative() {
helper.buildUIAndRunTest(_createTimePicker(), function (views: Array<viewModule.View>) {
var timePicker = <timePickerModule.TimePicker>views[0];
var expectedValue = 59;
@@ -73,7 +82,7 @@ export var testMinuteFromLocalToNative = function () {
});
}
export var testHourFromNativeToLocal = function () {
export function testHourFromNativeToLocal() {
helper.buildUIAndRunTest(_createTimePicker(), function (views: Array<viewModule.View>) {
var timePicker = <timePickerModule.TimePicker>views[0];
var expectedValue = 14;
@@ -83,7 +92,7 @@ export var testHourFromNativeToLocal = function () {
});
}
export var testMinuteFromNativeToLocal = function () {
export function testMinuteFromNativeToLocal() {
helper.buildUIAndRunTest(_createTimePicker(), function (views: Array<viewModule.View>) {
var timePicker = <timePickerModule.TimePicker>views[0];
var expectedValue = 33;
@@ -91,4 +100,46 @@ export var testMinuteFromNativeToLocal = function () {
var actualValue = timePicker.minute;
TKUnit.assert(actualValue === expectedValue, "Actual: " + actualValue + "; Expected: " + expectedValue);
});
}
export function testHourAndMinuteFromNativeToLocal() {
var expectedHour = 12;
var expectedMinute = 34;
helper.buildUIAndRunTest(_createTimePicker(), function (views: Array<viewModule.View>) {
var timePicker = <timePickerModule.TimePicker>views[0];
timePickerTestsNative.setNativeTime(timePicker, expectedHour, expectedMinute);
assertTime(timePicker, expectedHour, expectedMinute);
});
}
export function testSetHourMinute_BeforeLoaded() {
var expectedHour = 12;
var expectedMinute = 34;
helper.buildUIAndRunTest(_createTimePicker(expectedHour, expectedMinute), function (views: Array<viewModule.View>) {
var timePicker = <timePickerModule.TimePicker>views[0];
assertTime(timePicker, expectedHour, expectedMinute);
});
}
export function testSetHourMinute_AfterLoaded() {
var expectedHour = 12;
var expectedMinute = 34;
helper.buildUIAndRunTest(_createTimePicker(), function (views: Array<viewModule.View>) {
var timePicker = <timePickerModule.TimePicker>views[0];
timePicker.hour = expectedHour;
timePicker.minute = expectedMinute;
assertTime(timePicker, expectedHour, expectedMinute);
});
}
function assertTime(timePicker: timePickerModule.TimePicker, expectedHour: number, expectedMinute) {
TKUnit.assertEqual(timePicker.hour, expectedHour, "timePicker.hour");
TKUnit.assertEqual(timePicker.minute, expectedMinute, "timePicker.minute");
TKUnit.assertEqual(timePickerTestsNative.getNativeHour(timePicker), expectedHour, "Native timePicker.hour");
TKUnit.assertEqual(timePickerTestsNative.getNativeMinute(timePicker), expectedMinute, "Native timePicker.minute");
}

View File

@@ -81,4 +81,8 @@ export class Border extends contentView.ContentView implements definition.Border
var borderSize = this.borderWidth * density;
viewModule.View.layoutChild(this, this.content, borderSize, borderSize, right - left - borderSize, bottom - top - borderSize);
}
public _updateAndroidBorder() {
// This is android specific method.
}
}

View File

@@ -1,63 +1,51 @@
import borderCommon = require("ui/border/border-common");
import proxy = require("ui/core/proxy");
import dependencyObservable = require("ui/core/dependency-observable");
import color = require("color");
import utils = require("utils/utils");
// merge the exports of the common file with the exports of this file
declare var exports;
require("utils/module-merge").merge(borderCommon, exports);
function onCornerRadiusPropertyChanged(data: dependencyObservable.PropertyChangeData) {
var view = <Border>data.object;
if (!view._nativeView) {
return;
}
if (view._nativeView instanceof android.view.ViewGroup) {
var gd = new android.graphics.drawable.GradientDrawable();
gd.setCornerRadius(data.newValue);
gd.setStroke(view.borderWidth, view.borderColor.android);
(<android.view.View>view._nativeView).setBackgroundDrawable(gd);
}
function onBorderPropertyChanged(data: dependencyObservable.PropertyChangeData) {
var border = <Border>data.object;
border._updateAndroidBorder();
}
(<proxy.PropertyMetadata>borderCommon.Border.cornerRadiusProperty.metadata).onSetNativeValue = onCornerRadiusPropertyChanged;
function onBorderWidthPropertyChanged(data: dependencyObservable.PropertyChangeData) {
var view = <Border>data.object;
if (!view._nativeView) {
return;
}
if (view._nativeView instanceof android.view.ViewGroup) {
var gd = new android.graphics.drawable.GradientDrawable();
gd.setCornerRadius(view.cornerRadius);
gd.setStroke(data.newValue, view.borderColor.android);
(<android.view.View>view._nativeView).setBackgroundDrawable(gd);
}
}
(<proxy.PropertyMetadata>borderCommon.Border.borderWidthProperty.metadata).onSetNativeValue = onBorderWidthPropertyChanged;
function onBorderColorPropertyChanged(data: dependencyObservable.PropertyChangeData) {
var view = <Border>data.object;
if (!view._nativeView) {
return;
}
if (view._nativeView instanceof android.view.ViewGroup && data.newValue instanceof color.Color) {
var gd = new android.graphics.drawable.GradientDrawable();
gd.setCornerRadius(view.cornerRadius);
gd.setStroke(view.borderWidth, data.newValue.android);
(<android.view.View>view._nativeView).setBackgroundDrawable(gd);
}
}
(<proxy.PropertyMetadata>borderCommon.Border.borderColorProperty.metadata).onSetNativeValue = onBorderColorPropertyChanged;
(<proxy.PropertyMetadata>borderCommon.Border.cornerRadiusProperty.metadata).onSetNativeValue = onBorderPropertyChanged;
(<proxy.PropertyMetadata>borderCommon.Border.borderWidthProperty.metadata).onSetNativeValue = onBorderPropertyChanged;
(<proxy.PropertyMetadata>borderCommon.Border.borderColorProperty.metadata).onSetNativeValue = onBorderPropertyChanged;
export class Border extends borderCommon.Border {
//
public _updateAndroidBorder() {
if (!this._nativeView) {
return;
}
var nativeView = <android.view.ViewGroup>this._nativeView;
var backgroundDrawable = nativeView.getBackground();
if (!(backgroundDrawable instanceof android.graphics.drawable.GradientDrawable)) {
backgroundDrawable = new android.graphics.drawable.GradientDrawable();
nativeView.setBackgroundDrawable(backgroundDrawable);
}
var gd = <android.graphics.drawable.GradientDrawable>backgroundDrawable;
var density = utils.layout.getDisplayDensity();
gd.setCornerRadius(this.cornerRadius * density);
if (this.borderColor) {
gd.setStroke(this.borderWidth * density, this.borderColor.android);
}
else {
gd.setStroke(this.borderWidth * density, android.graphics.Color.TRANSPARENT);
}
if (this.backgroundColor) {
gd.setColor(this.backgroundColor.android);
}
else {
gd.setColor(android.graphics.Color.TRANSPARENT);
}
}
}

View File

@@ -28,5 +28,9 @@ declare module "ui/border" {
* Gets or sets the border color of the border component.
*/
borderColor: color.Color;
//@private
_updateAndroidBorder();
//@endprivate
}
}

View File

@@ -1,12 +1,13 @@
import common = require("ui/date-picker/date-picker-common");
import dependencyObservable = require("ui/core/dependency-observable");
import proxy = require("ui/core/proxy");
import types = require("utils/types");
function onYearPropertyChanged(data: dependencyObservable.PropertyChangeData) {
var picker = <DatePicker>data.object;
if (picker.android && picker.android.getYear() !== data.newValue) {
picker.android.updateDate(data.newValue, picker.android.getMonth(), picker.android.getDayOfMonth());
updateNativeDate(picker);
}
}
@@ -16,7 +17,7 @@ function onMonthPropertyChanged(data: dependencyObservable.PropertyChangeData) {
var picker = <DatePicker>data.object;
if (picker.android && picker.android.getMonth() !== (data.newValue - 1)) {
picker.android.updateDate(picker.android.getYear(), data.newValue - 1, picker.android.getDayOfMonth());
updateNativeDate(picker);
}
}
@@ -26,12 +27,20 @@ function onDayPropertyChanged(data: dependencyObservable.PropertyChangeData) {
var picker = <DatePicker>data.object;
if (picker.android && picker.android.getDayOfMonth !== data.newValue) {
picker.android.updateDate(picker.android.getYear(), picker.android.getMonth(), data.newValue);
updateNativeDate(picker);
}
}
(<proxy.PropertyMetadata>common.DatePicker.dayProperty.metadata).onSetNativeValue = onDayPropertyChanged;
function updateNativeDate(picker: DatePicker) {
var year = types.isNumber(picker.year) ? picker.year : picker.android.getYear();
var month = types.isNumber(picker.month) ? (picker.month - 1) : picker.android.getMonth();
var day = types.isNumber(picker.day) ? picker.day : picker.android.getDayOfMonth();
picker.android.updateDate(year, month, day);
}
function onMaxDatePropertyChanged(data: dependencyObservable.PropertyChangeData) {
var picker = <DatePicker>data.object;
@@ -89,7 +98,7 @@ export class DatePicker extends common.DatePicker {
if (day !== this.owner.day) {
this.owner._onPropertyChangedFromNative(common.DatePicker.dayProperty, day);
}
}
}
}
});

View File

@@ -1,6 +1,7 @@
import types = require("utils/types");
import trace = require("trace");
import view = require("ui/core/view");
import border = require("ui/border");
import constants = require("utils/android_constants");
import style = require("ui/styling/style");
import definition = require("ui/styling");
@@ -343,6 +344,25 @@ export class SearchBarStyler implements definition.stylers.Styler {
}
}
export class BorderStyler implements definition.stylers.Styler {
//Background methods
private static setBackgroundProperty(view: view.View, newValue: any) {
var border = <border.Border>view;
border._updateAndroidBorder();
}
private static resetBackgroundProperty(view: view.View, nativeValue: any) {
var border = <border.Border>view;
border._updateAndroidBorder();
}
public static registerHandlers() {
style.registerHandler(style.backgroundColorProperty, new stylersCommon.StylePropertyChangedHandler(
BorderStyler.setBackgroundProperty,
BorderStyler.resetBackgroundProperty), "Border");
}
}
export function _registerDefaultStylers() {
style.registerNoStylingClass("Frame");
DefaultStyler.registerHandlers();
@@ -351,4 +371,5 @@ export function _registerDefaultStylers() {
ActivityIndicatorStyler.registerHandlers();
SegmentedBarStyler.registerHandlers();
SearchBarStyler.registerHandlers();
BorderStyler.registerHandlers();
}

View File

@@ -4,20 +4,14 @@ import proxy = require("ui/core/proxy");
function onHourPropertyChanged(data: dependencyObservable.PropertyChangeData) {
var picker = <TimePicker>data.object;
if (picker.android) {
picker.android.setCurrentHour(new java.lang.Integer(data.newValue));
}
picker._setNativeHourSilently(data.newValue);
}
(<proxy.PropertyMetadata>common.TimePicker.hourProperty.metadata).onSetNativeValue = onHourPropertyChanged;
function onMinutePropertyChanged(data: dependencyObservable.PropertyChangeData) {
var picker = <TimePicker>data.object;
if (picker.android) {
picker.android.setCurrentMinute(new java.lang.Integer(data.newValue));
}
picker._setNativeMinuteSilently(data.newValue);
}
(<proxy.PropertyMetadata>common.TimePicker.minuteProperty.metadata).onSetNativeValue = onMinutePropertyChanged;
@@ -29,6 +23,7 @@ require("utils/module-merge").merge(common, exports);
export class TimePicker extends common.TimePicker {
private _android: android.widget.TimePicker;
private _listener: android.widget.TimePicker.OnTimeChangedListener;
private _isSettingTime: boolean = false;
get android(): android.widget.TimePicker {
return this._android;
@@ -45,12 +40,12 @@ export class TimePicker extends common.TimePicker {
},
onTimeChanged: function (picker: android.widget.TimePicker, hour: number, minute: number) {
if (this.owner) {
if (this.owner && !this.owner._isSettingTime) {
if (hour !== this.owner.hour) {
this.owner._onPropertyChangedFromNative(common.TimePicker.hourProperty, hour);
}
if (minute !== this.owner.minute) {
this.owner._onPropertyChangedFromNative(common.TimePicker.minuteProperty, minute);
}
@@ -59,4 +54,32 @@ export class TimePicker extends common.TimePicker {
});
this._android.setOnTimeChangedListener(this._listener);
}
public _setNativeHourSilently(newValue: number) {
if (!this.android) {
return;
}
this._isSettingTime = true;
try {
this.android.setCurrentHour(new java.lang.Integer(newValue));
}
finally {
this._isSettingTime = false;
}
}
public _setNativeMinuteSilently(newValue: number) {
if (!this.android) {
return;
}
this._isSettingTime = true;
try {
this.android.setCurrentMinute(new java.lang.Integer(newValue));
}
finally {
this._isSettingTime = false;
}
}
}