Skip to content

Commit 401c52b

Browse files
triniwiztriniwiz
committed
{N} V3 update
1 parent dc74c11 commit 401c52b

File tree

11 files changed

+412
-391
lines changed

11 files changed

+412
-391
lines changed

‎checkbox.android.ts

Lines changed: 103 additions & 150 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,55 @@
1-
import { CheckBoxInterface } from "./";
2-
import { View } from "ui/core/view";
3-
import { Color } from "color";
4-
import { isAndroid, device } from "platform";
5-
import { Property, PropertyChangeData } from "ui/core/dependency-observable";
6-
import { PropertyMetadata } from "ui/core/proxy";
7-
import { Font } from "ui/styling/font";
8-
import enums = require("ui/enums");
9-
import style = require("ui/styling/style");
10-
import app = require("application");
11-
declare var android: any;
1+
import { Color } from "tns-core-modules/color";
2+
import { device } from "tns-core-modules/platform";
3+
import app = require("tns-core-modules/application");
4+
import {CheckBoxInterface} from ".";
5+
import {
6+
View,
7+
Property,
8+
CssProperty,
9+
Style,
10+
booleanConverter
11+
} from "tns-core-modules/ui/core/view";
12+
declare const android: any;
13+
14+
export const checkedProperty = new Property<CheckBox, boolean>({
15+
name: 'checked',
16+
defaultValue: false,
17+
valueConverter: booleanConverter,
18+
valueChanged: onCheckedPropertyChanged
19+
});
20+
21+
export const textProperty = new Property<CheckBox, string>({
22+
name: 'text',
23+
defaultValue: '',
24+
valueChanged: onTextPropertyChanged
25+
});
26+
27+
export const fillColorProperty = new CssProperty<Style, string>({
28+
name: 'fillColor',
29+
cssName: 'fill-color',
30+
valueConverter: v => {
31+
return String(v)
32+
}
33+
});
34+
35+
export const tintColorProperty = new CssProperty<Style, string>({
36+
name: 'tintColor',
37+
cssName: 'tint-color',
38+
defaultValue: '#0075ff',
39+
valueConverter: v => {
40+
return String(v)
41+
}
42+
});
1243

1344
export class CheckBox extends View implements CheckBoxInterface {
1445
private _android: any; /// android.widget.CheckBox
15-
private _fillColor: string;
1646
private _checkStyle: string;
1747
private _checkPadding: string;
1848
private _checkPaddingLeft: string;
1949
private _checkPaddingTop: string;
2050
private _checkPaddingRight: string;
2151
private _checkPaddingBottom: string;
22-
public static checkedProperty = new Property(
23-
"checked",
24-
"CheckBox",
25-
new PropertyMetadata(false)
26-
);
27-
28-
public static textProperty = new Property(
29-
"text",
30-
"CheckBox",
31-
new PropertyMetadata(false)
32-
);
33-
52+
public checked:boolean;
3453
constructor() {
3554
super();
3655
}
@@ -39,10 +58,6 @@ export class CheckBox extends View implements CheckBoxInterface {
3958
return this._android;
4059
}
4160

42-
get _nativeView() {
43-
return this._android;
44-
}
45-
4661
get checkStyle() {
4762
return this._checkStyle;
4863
}
@@ -91,49 +106,40 @@ export class CheckBox extends View implements CheckBoxInterface {
91106
get checkPaddingBottom() {
92107
return this._checkPaddingBottom;
93108
}
94-
95-
get checked(): boolean {
96-
return this._getValue(CheckBox.checkedProperty);
109+
[checkedProperty.getDefault](): boolean {
110+
return false;
97111
}
98-
99-
set checked(value: boolean) {
100-
this._setValue(CheckBox.checkedProperty, value);
112+
[checkedProperty.setNative](value: boolean) {
113+
this.nativeView.setChecked(Boolean(value));
101114
}
102-
103-
get text(): string {
104-
return this._getValue(CheckBox.textProperty);
115+
[textProperty.getDefault](): string {
116+
return '';
105117
}
106-
107-
set text(value: string) {
108-
this._setValue(CheckBox.textProperty, value);
118+
[textProperty.setNative](value: string) {
119+
this.nativeView.setText(value);
109120
}
110121

111-
get fillColor(): string {
112-
return this._fillColor;
122+
get fillColor():string{
123+
return (<any>this.style).fillColor;
113124
}
114-
115-
set fillColor(color: string) {
116-
this._fillColor = color;
117-
125+
set fillColor(color:string){
126+
(<any>this.style).fillColor = color;
118127
if (this._android && device.sdkVersion >= "21")
119-
this._android.setButtonTintList(android.content.res.ColorStateList.valueOf(new Color(this._fillColor).android));
128+
this._android.setButtonTintList(android.content.res.ColorStateList.valueOf(new Color(color).android));
120129
}
121130

122131
//There is no difference between tint and fill on the android widget
123132
get tintColor(): string {
124-
return this.fillColor;
133+
return (<any>this.style).fillColor;
125134
}
126135

127136
set tintColor(color: string) {
128-
this.fillColor = color;
137+
(<any>this.style).fillColor = color;
129138
}
130139

140+
public createNativeView() {
131141

132-
public _createUI() {
133-
134-
// this._android = new android.widget.CheckBox(this._context, null);
135142
this._android = new android.support.v7.widget.AppCompatCheckBox(this._context, null);
136-
137143
if (this.checkPaddingLeft) {
138144
this._android.setPadding(parseInt(this.checkPaddingLeft), this._android.getPaddingTop(), this._android.getPaddingRight(), this._android.getPaddingBottom());
139145
}
@@ -167,13 +173,21 @@ export class CheckBox extends View implements CheckBoxInterface {
167173
break;
168174
}
169175
}
170-
if (this.text) {
171-
this._android.setText(this.text);
176+
177+
178+
if(this.style.color){
179+
this._android.setTextColor(this.style.color.android);
180+
}
181+
182+
if (!this.style.fontSize) {
183+
this.style.fontSize = 15;
172184
}
173185

174-
/// works with class styling - Brad
175-
if (!this.fontSize) {
176-
this.fontSize = 15;
186+
this._android.setTextSize(this.style.fontSize);
187+
188+
var typeface = this.style.fontInternal.getAndroidTypeface();
189+
if (typeface) {
190+
this._android.setTypeface(typeface);
177191
}
178192

179193
if (this._checkStyle) {
@@ -184,122 +198,61 @@ export class CheckBox extends View implements CheckBoxInterface {
184198

185199
if (this._android) {
186200
if (this.fillColor) {
187-
android.support.v4.widget.CompoundButtonCompat.setButtonTintList(this._android, android.content.res.ColorStateList.valueOf(new Color(this._fillColor).android));
201+
android.support.v4.widget.CompoundButtonCompat.setButtonTintList(this._android, android.content.res.ColorStateList.valueOf(new Color(this.fillColor).android));
188202
}
189203
}
190204

191-
var that = new WeakRef(this);
205+
return this._android;
206+
}
192207

193-
this._android.setOnCheckedChangeListener(new android.widget.CompoundButton.OnCheckedChangeListener({
194-
get owner() {
208+
public initNativeView() {
209+
var that = new WeakRef(this);
210+
this.nativeView.setOnCheckedChangeListener(new android.widget.CompoundButton.OnCheckedChangeListener({
211+
get owner(): CheckBox {
195212
return that.get();
196213
},
197214

198215
onCheckedChanged: function (sender, isChecked) {
199216
if (this.owner) {
200-
this.owner._onPropertyChangedFromNative(CheckBox.checkedProperty, isChecked);
217+
checkedProperty.nativeValueChange(this.owner, isChecked);
201218
}
202219
}
203220
}));
204-
205-
}
206-
207-
public toggle(): void {
208-
this._android.toggle();
209-
}
210-
}
211-
212-
213-
function onCheckedPropertyChanged(data: PropertyChangeData) {
214-
var cBox = <CheckBox>data.object;
215-
if (!cBox.android) {
216-
return;
217221
}
218222

219-
cBox.android.setChecked(data.newValue);
220-
}
221-
222-
// register the setNativeValue callbacks
223-
(<PropertyMetadata>CheckBox.checkedProperty.metadata).onSetNativeValue = onCheckedPropertyChanged;
224-
225-
226-
function onTextPropertyChanged(data: PropertyChangeData) {
227-
var cBox = <CheckBox>data.object;
228-
if (!cBox.android) {
229-
return;
223+
public disposeNativeView() {
224+
this.nativeView.setOnCheckedChangeListener(null);
230225
}
231226

232-
cBox.android.setText(data.newValue);
233-
}
234-
235-
// register the setNativeValue callbacks
236-
(<PropertyMetadata>CheckBox.textProperty.metadata).onSetNativeValue = onTextPropertyChanged;
237-
238-
239-
export class CheckBoxStyler implements style.Styler {
240-
private static setColorLabelProperty(view: any, newValue: any) {
241-
var cb = <android.widget.CheckBox>view._nativeView;
242-
if (cb) {
243-
(<any>cb).setTextColor(new Color(newValue).android);
244-
}
227+
public toggle(): void {
228+
this.nativeView.toggle();
245229
}
246230

247-
// font
248-
private static setFontInternalProperty(view: any, newValue: any, nativeValue?: any) {
249-
var tv = <android.widget.CheckBox>view._nativeView;
250-
var fontValue = <Font>newValue;
251-
252-
var typeface = fontValue.getAndroidTypeface();
253-
if (typeface) {
254-
tv.setTypeface(typeface);
255-
}
256-
else {
257-
tv.setTypeface(nativeValue.typeface);
258-
}
259-
260-
if (fontValue.fontSize) {
261-
tv.setTextSize(fontValue.fontSize);
262-
}
263-
else {
264-
tv.setTextSize(android.util.TypedValue.COMPLEX_UNIT_PX, nativeValue.size);
231+
_onCheckedPropertyChanged(checkbox: CheckBox, oldValue, newValue) {
232+
if (!this.nativeView) {
233+
return
265234
}
235+
checkedProperty.nativeValueChange(this, newValue);
266236
}
267-
268-
private static resetFontInternalProperty(view: any, nativeValue: any) {
269-
var tv: android.widget.CheckBox = <android.widget.CheckBox>view._nativeView;
270-
if (tv && nativeValue) {
271-
tv.setTypeface(nativeValue.typeface);
272-
tv.setTextSize(android.util.TypedValue.COMPLEX_UNIT_PX, nativeValue.size);
237+
_onTextPropertyChanged(checkbox: CheckBox, oldValue, newValue) {
238+
if (!this.nativeView) {
239+
return
273240
}
241+
textProperty.nativeValueChange(this, newValue);
274242
}
275243

276-
private static getNativeFontInternalValue(view: any): any {
277-
var tv: android.widget.TextView = <android.widget.CheckBox>view._nativeView;
278-
return {
279-
typeface: tv.getTypeface(),
280-
size: tv.getTextSize()
281-
};
282-
}
283-
284-
private static resetColorProperty(view: View, nativeValue: number) {
285-
// Do nothing.
286-
}
287-
288-
289-
public static registerHandlers() {
290-
style.registerHandler(style.colorProperty, new style.StylePropertyChangedHandler(
291-
CheckBoxStyler.setColorLabelProperty,
292-
CheckBoxStyler.resetColorProperty), "CheckBox");
244+
}
293245

294-
style.registerHandler(style.fontInternalProperty, new style.StylePropertyChangedHandler(
295-
CheckBoxStyler.setFontInternalProperty,
296-
CheckBoxStyler.resetFontInternalProperty,
297-
CheckBoxStyler.getNativeFontInternalValue), "CheckBox");
298246

299-
style.registerHandler(style.backgroundColorProperty, new style.StylePropertyChangedHandler(
300-
CheckBoxStyler.setColorLabelProperty,
301-
CheckBoxStyler.resetColorProperty), "CheckBox");
302-
}
247+
function onCheckedPropertyChanged(checkbox: CheckBox, oldValue, newValue) {
248+
checkbox._onCheckedPropertyChanged(checkbox, oldValue, newValue);
249+
}
250+
function onTextPropertyChanged(checkbox: CheckBox, oldValue, newValue) {
251+
checkbox._onTextPropertyChanged(checkbox, oldValue, newValue);
303252
}
304253

305-
CheckBoxStyler.registerHandlers();
254+
255+
checkedProperty.register(CheckBox);
256+
textProperty.register(CheckBox);
257+
fillColorProperty.register(Style);
258+
tintColorProperty.register(Style);

0 commit comments

Comments
 (0)