Repository navigation
Expand file tree
/
Copy pathbars.ts
More file actions
60 lines (51 loc) · 2.13 KB
/
Copy pathbars.ts
File metadata and controls
60 lines (51 loc) · 2.13 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
import { Application, Color, EventData, Frame, Observable, Page, Utils } from '@nativescript/core';
import { deviceSummary } from './shared';
class Bars extends Observable {
private dark = true;
private lightContent = false;
private tinted = false;
constructor(private page: Page) {
super();
this.publish();
const onAppearance = () => this.publish();
Application.on(Application.systemAppearanceChangedEvent, onAppearance);
this.page.on(Page.navigatedFromEvent, () => Application.off(Application.systemAppearanceChangedEvent, onAppearance));
}
toggleStyle = () => {
this.dark = !this.dark;
this.publish();
};
toggleContent = () => {
this.lightContent = !this.lightContent;
this.publish();
};
/** The colours only show up behind translucent bars, which is the edge-to-edge case. */
toggleBarColors = () => {
this.tinted = !this.tinted;
const activity = Utils.android.getCurrentActivity() as androidx.appcompat.app.AppCompatActivity;
if (this.tinted) {
Utils.android.setStatusBarColor({ activity, lightColor: new Color('#3320c997'), darkColor: new Color('#33064e3b') });
Utils.android.setNavigationBarColor({ activity, lightColor: new Color('#33f59e0b'), darkColor: new Color('#33451a03') });
} else {
Utils.android.setStatusBarColor({ activity, lightColor: new Color('transparent'), darkColor: new Color('transparent') });
Utils.android.setNavigationBarColor({ activity, lightColor: new Color('transparent'), darkColor: new Color('transparent') });
}
this.publish();
};
back = () => {
Frame.topmost().goBack();
};
private publish() {
const style = this.dark ? 'dark' : 'light';
this.set('statusBarStyle', style);
this.set('statusBarLine', `statusBarStyle: ${style}`);
this.set('contentColor', this.lightContent ? '#f8fafc' : '#111827');
this.set('appearanceLine', `system appearance: ${Application.systemAppearance()}`);
this.set('ignoreOlderLine', `ignoreEdgeToEdgeOnOlderDevices: ${Utils.android.getIgnoreEdgeToEdgeOnOlderDevices()}`);
this.set('device', deviceSummary());
}
}
export function navigatingTo(args: EventData) {
const page = <Page>args.object;
page.bindingContext = new Bars(page);
}