Skip to content

Commit 5195da9

Browse files
farfromrefugfarfromrefug
committed
fix(textfield): some textfield color related fixes
1 parent 21dcefb commit 5195da9

File tree

3 files changed

+40
-31
lines changed

3 files changed

+40
-31
lines changed

‎src/core/textbase/cssproperties.ts‎

Lines changed: 15 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,17 @@
11
import { Color, CoreTypes, CssProperty, Length, Style, booleanConverter } from '@nativescript/core';
22

3+
function convertColor(value) {
4+
if (typeof value === 'string') {
5+
return new Color(value);
6+
}
7+
return value;
8+
}
9+
310
export const errorColorProperty = new CssProperty<Style, Color>({
411
name: 'errorColor',
512
cssName: 'error-color',
613
equalityComparer: Color.equals,
7-
valueConverter: (v) => new Color(v)
14+
valueConverter: convertColor
815
});
916
errorColorProperty.register(Style);
1017
export const helperProperty = new CssProperty<Style, string>({
@@ -16,7 +23,7 @@ export const helperColorProperty = new CssProperty<Style, Color>({
1623
name: 'helperColor',
1724
cssName: 'helper-color',
1825
equalityComparer: Color.equals,
19-
valueConverter: (v) => new Color(v)
26+
valueConverter: convertColor
2027
});
2128
helperColorProperty.register(Style);
2229
export const errorProperty = new CssProperty<Style, string>({
@@ -40,42 +47,42 @@ export const floatingColorProperty = new CssProperty<Style, Color>({
4047
name: 'floatingColor',
4148
cssName: 'floating-color',
4249
equalityComparer: Color.equals,
43-
valueConverter: (v) => new Color(v)
50+
valueConverter: convertColor
4451
});
4552
floatingColorProperty.register(Style);
4653
export const floatingInactiveColorProperty = new CssProperty<Style, Color>({
4754
name: 'floatingInactiveColor',
4855
cssName: 'floating-inactive-color',
4956
equalityComparer: Color.equals,
50-
valueConverter: (v) => new Color(v)
57+
valueConverter: convertColor
5158
});
5259
floatingInactiveColorProperty.register(Style);
5360
export const strokeColorProperty = new CssProperty<Style, Color>({
5461
name: 'strokeColor',
5562
cssName: 'stroke-color',
5663
equalityComparer: Color.equals,
57-
valueConverter: (v) => new Color(v)
64+
valueConverter: convertColor
5865
});
5966
strokeColorProperty.register(Style);
6067
export const strokeInactiveColorProperty = new CssProperty<Style, Color>({
6168
name: 'strokeInactiveColor',
6269
cssName: 'stroke-inactive-color',
6370
equalityComparer: Color.equals,
64-
valueConverter: (v) => new Color(v)
71+
valueConverter: convertColor
6572
});
6673
strokeInactiveColorProperty.register(Style);
6774
export const strokeDisabledColorProperty = new CssProperty<Style, Color>({
6875
name: 'strokeDisabledColor',
6976
cssName: 'stroke-disabled-color',
7077
equalityComparer: Color.equals,
71-
valueConverter: (v) => new Color(v)
78+
valueConverter: convertColor
7279
});
7380
strokeDisabledColorProperty.register(Style);
7481
export const buttonColorProperty = new CssProperty<Style, Color>({
7582
name: 'buttonColor',
7683
cssName: 'button-color',
7784
equalityComparer: Color.equals,
78-
valueConverter: (v) => new Color(v)
85+
valueConverter: convertColor
7986
});
8087
buttonColorProperty.register(Style);
8188
export const digitsProperty = new CssProperty<Style, string>({

‎src/textfield/textfield.android.ts‎

Lines changed: 19 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -147,8 +147,10 @@ export class TextField extends TextFieldBase {
147147

148148
[floatingInactiveColorProperty.setNative](value: Color) {
149149
const floatingInactiveColor = value instanceof Color ? value.android : value;
150-
const floatingColor = (this.floatingColor || (themer.getPrimaryColor() as Color)).android;
151-
this.layoutView.setDefaultHintTextColor(getFullColorStateList(floatingColor, floatingInactiveColor));
150+
151+
const primaryColor = themer.getPrimaryColor();
152+
const floatingColor = this.floatingColor || (primaryColor instanceof Color ? primaryColor : new Color(primaryColor));
153+
this.layoutView.setDefaultHintTextColor(getFullColorStateList(floatingColor instanceof Color ? floatingColor.android : floatingColor, floatingInactiveColor));
152154
}
153155
[helperColorProperty.setNative](value) {
154156
const color = value instanceof Color ? value.android : value;
@@ -213,17 +215,6 @@ export class TextField extends TextFieldBase {
213215
[floatingProperty.setNative](value: boolean) {
214216
this.layoutView.setHintEnabled(!!value);
215217
}
216-
217-
[strokeInactiveColorProperty.setNative](value: Color) {
218-
const color = value instanceof Color ? value.android : value;
219-
if (this.layoutView.setBoxStrokeColorStateList) {
220-
const activeColor = this.strokeColor instanceof Color ? this.strokeColor.android : this.layoutView.getBoxStrokeColor();
221-
const disabledColor = this.strokeDisabledColor instanceof Color ? this.strokeDisabledColor.android : undefined;
222-
const colorStateList = getFullColorStateList(activeColor, color, disabledColor);
223-
this.layoutView.setBoxStrokeColorStateList(colorStateList);
224-
}
225-
}
226-
227218
[strokeWidthProperty.setNative](value: CoreTypes.LengthType) {
228219
this.layoutView.setBoxStrokeWidth(Length.toDevicePixels(value, 0));
229220
}
@@ -232,8 +223,8 @@ export class TextField extends TextFieldBase {
232223
this.layoutView.setBoxStrokeWidthFocused(Length.toDevicePixels(value, 0));
233224
}
234225

235-
[strokeColorProperty.setNative](value: Color) {
236-
const color = value instanceof Color ? value.android : value;
226+
[strokeColorProperty.setNative](value: Color | string) {
227+
const color = value ? (value instanceof Color ? value.android : new Color(value).android) : null;
237228
if (this.layoutView.setBoxStrokeColorStateList) {
238229
const inactiveColor = this.strokeInactiveColor instanceof Color ? this.strokeInactiveColor.android : undefined;
239230
const disabledColor = this.strokeDisabledColor instanceof Color ? this.strokeDisabledColor.android : undefined;
@@ -243,8 +234,19 @@ export class TextField extends TextFieldBase {
243234
this.layoutView.setBoxStrokeColor(color);
244235
}
245236
}
246-
[strokeDisabledColorProperty.setNative](value: Color) {
247-
const color = value instanceof Color ? value.android : value;
237+
238+
[strokeInactiveColorProperty.setNative](value: Color | string) {
239+
const color = value ? (value instanceof Color ? value.android : new Color(value).android) : null;
240+
if (this.layoutView.setBoxStrokeColorStateList) {
241+
const activeColor = this.strokeColor instanceof Color ? this.strokeColor.android : this.layoutView.getBoxStrokeColor();
242+
const disabledColor = this.strokeDisabledColor instanceof Color ? this.strokeDisabledColor.android : undefined;
243+
const colorStateList = getFullColorStateList(activeColor, color, disabledColor);
244+
this.layoutView.setBoxStrokeColorStateList(colorStateList);
245+
}
246+
}
247+
248+
[strokeDisabledColorProperty.setNative](value: Color | string) {
249+
const color = value ? (value instanceof Color ? value.android : new Color(value).android) : null;
248250
if (this.layoutView.setBoxStrokeColorStateList) {
249251
const activeColor = this.strokeColor instanceof Color ? this.strokeColor.android : this.layoutView.getBoxStrokeColor();
250252
const inactiveColor = this.strokeInactiveColor instanceof Color ? this.strokeInactiveColor.android : undefined;

‎src/textfield/textfield.ios.ts‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -315,26 +315,26 @@ export class TextField extends TextFieldBase {
315315
[strokeWidthFocusedProperty.setNative](value: CoreTypes.LengthType) {
316316
// possible?
317317
}
318-
[strokeColorProperty.setNative](value: Color) {
319-
const color = value instanceof Color ? value.ios : value;
318+
[strokeColorProperty.setNative](value: Color | string) {
319+
const color = value ? (value instanceof Color ? value.ios : new Color(value).ios) : null;
320320
const view = this.nativeViewProtected;
321321
if (view instanceof MDCOutlinedTextFieldImpl) {
322322
view.setOutlineColorForState(color, MDCTextControlState.Editing);
323323
} else {
324324
(view as MDCFilledTextFieldImpl).setUnderlineColorForState(color, MDCTextControlState.Editing);
325325
}
326326
}
327-
[strokeInactiveColorProperty.setNative](value: Color) {
328-
const color = value instanceof Color ? value.ios : value;
327+
[strokeInactiveColorProperty.setNative](value: Color | string) {
328+
const color = value ? (value instanceof Color ? value.ios : new Color(value).ios) : null;
329329
const view = this.nativeViewProtected;
330330
if (view instanceof MDCOutlinedTextFieldImpl) {
331331
view.setOutlineColorForState(color, MDCTextControlState.Normal);
332332
} else {
333333
(view as MDCFilledTextFieldImpl).setUnderlineColorForState(color, MDCTextControlState.Normal);
334334
}
335335
}
336-
[strokeDisabledColorProperty.setNative](value: Color) {
337-
const color = value instanceof Color ? value.ios : value;
336+
[strokeDisabledColorProperty.setNative](value: Color | string) {
337+
const color = value ? (value instanceof Color ? value.ios : new Color(value).ios) : null;
338338
const view = this.nativeViewProtected;
339339
if (view instanceof MDCOutlinedTextFieldImpl) {
340340
view.setOutlineColorForState(color, MDCTextControlState.Disabled);

0 commit comments

Comments
 (0)