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
1344export 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