feat(frame): add new actionBarVisibility property (#6449)

This commit is contained in:
Martin Yankov
2018-10-24 14:51:43 +03:00
committed by GitHub
parent af651d6e83
commit 0002624d3c
6 changed files with 132 additions and 22 deletions

View File

@ -4,8 +4,9 @@ import * as builder from "tns-core-modules/ui/builder";
import { Label } from "tns-core-modules/ui/label";
import { Button } from "tns-core-modules/ui/button";
import { Page } from "tns-core-modules/ui/page";
import { View } from "tns-core-modules/ui/core/view";
import { View, isIOS } from "tns-core-modules/ui/core/view";
import { fromObject } from "tns-core-modules/data/observable";
import { topmost } from "tns-core-modules/ui/frame";
// >> actionbar-common-require
import * as actionBarModule from "tns-core-modules/ui/action-bar";
@ -302,6 +303,87 @@ export function test_LoadedEventsOrder_WithoutPageContent() {
TKUnit.arrayAssert(loadedEvents, new Array<string>("action-bar", "page"));
}
export function test_ActionBarVisibility_Never_ShouldNotShowDeclaredActionBar() {
const frame = topmost();
frame.actionBarVisibility = "never";
const page = <Page>builder.parse(
`<Page>
<ActionBar>
<ActionBar.titleView>
<Button text="test" />
</ActionBar.titleView>
</ActionBar>
</Page>
`);
helper.navigate(() => page);
let actionBarHidden = false;
if (isIOS) {
actionBarHidden = page.actionBar.nativeView.hidden;
} else {
actionBarHidden = !page.actionBar.nativeView.isShown();
}
TKUnit.assertTrue(actionBarHidden, `ActionBar hidden: expected true, actual ${actionBarHidden}`);
// restore default actionBarVisibility
frame.actionBarVisibility = "auto";
}
export function test_ActionBarVisibility_Always_ShouldShownHiddenActionBar() {
const frame = topmost();
frame.actionBarVisibility = "always";
const page = <Page>builder.parse(
`<Page actionBarHidden="true">
<ActionBar>
<ActionBar.titleView>
<Button text="test" />
</ActionBar.titleView>
</ActionBar>
</Page>
`);
helper.navigate(() => page);
let actionBarHidden = false;
if (isIOS) {
actionBarHidden = page.actionBar.nativeView.hidden;
} else {
actionBarHidden = !page.actionBar.nativeView.isShown();
}
TKUnit.assertFalse(actionBarHidden, `ActionBar hidden: expected false, actual ${actionBarHidden}`);
// restore default actionBarVisibility
frame.actionBarVisibility = "auto";
}
export function test_ActionBarVisibility_Auto_ShouldRespectPageActionBarHiddenProperty() {
const frame = topmost();
frame.actionBarVisibility = "auto";
const page = <Page>builder.parse(
`<Page actionBarHidden="true">
<ActionBar>
<ActionBar.titleView>
<Button text="test" />
</ActionBar.titleView>
</ActionBar>
</Page>
`);
helper.navigate(() => page);
let actionBarHidden = false;
if (isIOS) {
actionBarHidden = page.actionBar.nativeView.hidden;
} else {
actionBarHidden = !page.actionBar.nativeView.isShown();
}
TKUnit.assertTrue(actionBarHidden, `ActionBar hidden: expected true, actual ${actionBarHidden}`);
// restore default actionBarVisibility
frame.actionBarVisibility = "auto";
}
export function test_setId() {
const pageFactory = function (): Page {
const page = new Page();

View File

@ -17,7 +17,9 @@ export function test_NavBar_isVisible_when_MenuItems_areSet() {
var handler = function (data) {
page.off(PageModule.Page.navigatedToEvent, handler);
navBarIsVisible = (<any>page.frame.ios).showNavigationBar;
navBarIsVisible = !page.actionBar.nativeView.hidden;
console.log(navBarIsVisible);
console.log(page.actionBar.nativeView.hidden);
}
var pageFactory = function (): PageModule.Page {

View File

@ -42,6 +42,7 @@ export class FrameBase extends CustomLayoutView implements FrameDefinition {
private _backStack = new Array<BackstackEntry>();
private _navigationQueue = new Array<NavigationContext>();
public actionBarVisibility: "auto" | "never" | "always";
public _currentEntry: BackstackEntry;
public _executingEntry: BackstackEntry;
public _isInFrameStack = false;
@ -612,5 +613,7 @@ export const defaultPage = new Property<FrameBase, string>({
frame.navigate({ moduleName: newValue });
}
});
defaultPage.register(FrameBase)
export const actionBarVisibilityProperty = new Property<FrameBase, "auto" | "never" | "always">({ name: "actionBarVisibility", defaultValue: "auto", affectsLayout: isIOS });
actionBarVisibilityProperty.register(FrameBase);

View File

@ -436,6 +436,14 @@ export class Frame extends FrameBase {
}
public _getNavBarVisible(page: Page): boolean {
switch (this.actionBarVisibility) {
case "never":
return false;
case "always":
return true;
default:
if (page.actionBarHidden !== undefined) {
return !page.actionBarHidden;
}
@ -446,6 +454,7 @@ export class Frame extends FrameBase {
return true;
}
}
public _saveFragmentsState(): void {
// We save only fragments in backstack.

View File

@ -56,6 +56,11 @@ export class Frame extends View {
*/
navigate(entry: NavigationEntry);
/**
* Used to control the visibility the Navigation Bar in iOS and the Action Bar in Android.
*/
public actionBarVisibility: "auto" | "never" | "always";
/**
* Gets the back stack of this instance.
*/

View File

@ -208,6 +208,14 @@ export class Frame extends FrameBase {
}
public _getNavBarVisible(page: Page): boolean {
switch (this.actionBarVisibility) {
case "always":
return true;
case "never":
return false;
case "auto":
switch (this._ios.navBarVisibility) {
case "always":
return true;
@ -229,6 +237,7 @@ export class Frame extends FrameBase {
return newValue;
}
}
}
public static get defaultAnimatedNavigation(): boolean {
return FrameBase.defaultAnimatedNavigation;