Skip to content

Commit 38e6f66

Browse files
author
Alexander Vakrilov
authored
fix(style): Styles are not applied to dialogs (#5612)
1 parent 70f0112 commit 38e6f66

3 files changed

Lines changed: 52 additions & 61 deletions

File tree

‎tns-core-modules/ui/dialogs/dialogs-common.ts‎

Lines changed: 36 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
// Deifinitions.
1+
// Types.
22
import { View } from "../core/view";
33
import { Color } from "../../color";
44
import { Page } from "../page";
@@ -42,77 +42,68 @@ export function getCurrentPage(): Page {
4242
if (topmostFrame) {
4343
return topmostFrame.currentPage;
4444
}
45-
45+
4646
return undefined;
4747
}
4848

49-
function applySelectors(view: View) {
49+
function applySelectors<T extends View>(view: T, callback: (view: T) => void) {
5050
let currentPage = getCurrentPage();
5151
if (currentPage) {
5252
let styleScope = currentPage._styleScope;
5353
if (styleScope) {
54-
styleScope.matchSelectors(view);
54+
view._inheritStyleScope(styleScope);
55+
view.onLoaded();
56+
callback(view);
57+
view.onUnloaded();
5558
}
5659
}
5760
}
5861

59-
let buttonColor: Color;
60-
let buttonBackgroundColor: Color;
61-
62-
function getButtonColors(): void {
63-
const Button = require("ui/button").Button;
64-
const btn = new Button();
65-
applySelectors(btn);
66-
buttonColor = btn.color;
67-
buttonBackgroundColor = btn.backgroundColor;
68-
btn.onUnloaded();
69-
}
62+
let button: View;
63+
let label: View;
64+
let textField: View;
7065

71-
// NOTE: This will fail if app.css is changed.
72-
export function getButtonColor(): Color {
73-
if (!buttonColor) {
74-
getButtonColors();
66+
export function getButtonColors(): { color: Color, backgroundColor: Color } {
67+
if (!button) {
68+
const Button = require("ui/button").Button;
69+
button = new Button;
7570
}
7671

77-
return buttonColor;
72+
let buttonColor: Color;
73+
let buttonBackgroundColor: Color;
74+
applySelectors(button, (btn) => {
75+
buttonColor = btn.color;
76+
buttonBackgroundColor = <Color>btn.backgroundColor;
77+
});
78+
return { color: buttonColor, backgroundColor: buttonBackgroundColor };
7879
}
7980

80-
// NOTE: This will fail if app.css is changed.
81-
export function getButtonBackgroundColor(): Color {
82-
if (!buttonBackgroundColor) {
83-
getButtonColors();
81+
export function getLabelColor(): Color {
82+
if (!label) {
83+
const Label = require("ui/label").Label;
84+
label = new Label;
8485
}
8586

86-
return buttonBackgroundColor;
87+
let labelColor: Color;
88+
applySelectors(label, (lbl) => {
89+
labelColor = lbl.color;
90+
});
91+
return labelColor;
8792
}
8893

89-
let textFieldColor: Color;
9094
export function getTextFieldColor(): Color {
91-
if (!textFieldColor) {
95+
if (!textField) {
9296
const TextField = require("ui/text-field").TextField;
93-
const tf = new TextField();
94-
applySelectors(tf);
95-
textFieldColor = tf.color;
96-
tf.onUnloaded();
97+
textField = new TextField();
9798
}
9899

100+
let textFieldColor: Color;
101+
applySelectors(textField, (tf) => {
102+
textFieldColor = tf.color;
103+
});
99104
return textFieldColor;
100105
}
101106

102-
let labelColor: Color;
103-
// NOTE: This will fail if app.css is changed.
104-
export function getLabelColor(): Color {
105-
if (!labelColor) {
106-
const Label = require("ui/label").Label;
107-
let lbl = new Label();
108-
applySelectors(lbl);
109-
labelColor = lbl.color;
110-
lbl.onUnloaded();
111-
}
112-
113-
return labelColor;
114-
}
115-
116107
export function isDialogOptions(arg): boolean {
117108
return arg && (arg.message || arg.title);
118109
}

‎tns-core-modules/ui/dialogs/dialogs.android.ts‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
* Android specific dialogs functions implementation.
33
*/
44
import { DialogOptions, ConfirmOptions, PromptOptions, PromptResult, LoginOptions, LoginResult, ActionOptions } from ".";
5-
import { getLabelColor, getButtonColor, getButtonBackgroundColor, isDialogOptions, inputType, ALERT, OK, CONFIRM, CANCEL, PROMPT, LOGIN } from "./dialogs-common";
5+
import { getLabelColor, getButtonColors, isDialogOptions, inputType, ALERT, OK, CONFIRM, CANCEL, PROMPT, LOGIN } from "./dialogs-common";
66
import { android as androidApp } from "../../application";
77

88
export * from "./dialogs-common";
@@ -43,9 +43,9 @@ function showDialog(builder: android.app.AlertDialog.Builder) {
4343
}
4444
}
4545

46-
let buttonColor = getButtonColor();
47-
let buttonBackgroundColor = getButtonBackgroundColor();
48-
if (buttonColor) {
46+
let { color, backgroundColor } = getButtonColors();
47+
48+
if (color) {
4949
let buttons: android.widget.Button[] = [];
5050
for (let i = 0; i < 3; i++) {
5151
let id = dlg.getContext().getResources().getIdentifier("android:id/button" + i, null, null);
@@ -54,11 +54,11 @@ function showDialog(builder: android.app.AlertDialog.Builder) {
5454

5555
buttons.forEach(button => {
5656
if (button) {
57-
if (buttonColor) {
58-
button.setTextColor(buttonColor.android);
57+
if (color) {
58+
button.setTextColor(color.android);
5959
}
60-
if (buttonBackgroundColor) {
61-
button.setBackgroundColor(buttonBackgroundColor.android);
60+
if (backgroundColor) {
61+
button.setBackgroundColor(backgroundColor.android);
6262
}
6363
}
6464
});

‎tns-core-modules/ui/dialogs/dialogs.ios.ts‎

Lines changed: 8 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
*/
44

55
import { ConfirmOptions, PromptOptions, PromptResult, LoginOptions, LoginResult, ActionOptions } from ".";
6-
import { getCurrentPage, getLabelColor, getButtonColor, getTextFieldColor, isDialogOptions, inputType, ALERT, OK, CONFIRM, CANCEL, PROMPT, LOGIN } from "./dialogs-common";
6+
import { getCurrentPage, getLabelColor, getButtonColors, getTextFieldColor, isDialogOptions, inputType, ALERT, OK, CONFIRM, CANCEL, PROMPT, LOGIN } from "./dialogs-common";
77
import { isString, isDefined, isFunction } from "../../utils/types";
88

99
export * from "./dialogs-common";
@@ -162,13 +162,14 @@ export function login(arg: any): Promise<LoginResult> {
162162
let passwordTextField: UITextField;
163163
let alertController = UIAlertController.alertControllerWithTitleMessagePreferredStyle(options.title, options.message, UIAlertControllerStyle.Alert);
164164

165+
let textFieldColor = getTextFieldColor();
166+
165167
alertController.addTextFieldWithConfigurationHandler((arg: UITextField) => {
166168
arg.placeholder = "Login";
167169
arg.text = isString(options.userName) ? options.userName : "";
168170

169-
let color = getTextFieldColor();
170-
if (color) {
171-
arg.textColor = arg.tintColor = color.ios;
171+
if (textFieldColor) {
172+
arg.textColor = arg.tintColor = textFieldColor.ios;
172173
}
173174
});
174175

@@ -177,9 +178,8 @@ export function login(arg: any): Promise<LoginResult> {
177178
arg.secureTextEntry = true;
178179
arg.text = isString(options.password) ? options.password : "";
179180

180-
let color = getTextFieldColor();
181-
if (color) {
182-
arg.textColor = arg.tintColor = color.ios;
181+
if (textFieldColor) {
182+
arg.textColor = arg.tintColor = textFieldColor.ios;
183183
}
184184
});
185185

@@ -214,7 +214,7 @@ function showUIAlertController(alertController: UIAlertController) {
214214
alertController.popoverPresentationController.permittedArrowDirections = 0;
215215
}
216216

217-
let color = getButtonColor();
217+
let color = getButtonColors().color;
218218
if (color) {
219219
alertController.view.tintColor = color.ios;
220220
}

0 commit comments

Comments
 (0)