mirror of
https://github.com/NativeScript/NativeScript.git
synced 2025-08-26 21:00:16 +08:00
Animated nav-bar
This commit is contained in:
@ -17,8 +17,7 @@ export function applyTapOnStyledActionBar(args) {
|
||||
reset(page);
|
||||
|
||||
page.actionBar.backgroundColor = new Color("#5DFC0A");
|
||||
var css = "#test-element { " + args.object.tag + " }";
|
||||
page.css = css;
|
||||
page.css = "#test-element { " + args.object.tag + " }";
|
||||
}
|
||||
|
||||
export function applyTapWithHiddenActionBar(args) {
|
||||
@ -27,8 +26,7 @@ export function applyTapWithHiddenActionBar(args) {
|
||||
reset(page);
|
||||
|
||||
page.actionBarHidden = true;
|
||||
var css = "#test-element { " + args.object.tag + " }";
|
||||
page.css = css;
|
||||
page.css = "#test-element { " + args.object.tag + " }";
|
||||
}
|
||||
|
||||
export function applyTapWithSpan(args) {
|
||||
@ -37,8 +35,7 @@ export function applyTapWithSpan(args) {
|
||||
reset(page);
|
||||
|
||||
page.backgroundSpanUnderStatusBar = true;
|
||||
var css = "#test-element { " + args.object.tag + " }";
|
||||
page.css = css;
|
||||
page.css = "#test-element { " + args.object.tag + " }";
|
||||
}
|
||||
|
||||
export function applyTapOnStyledActionBarAndSpan(args) {
|
||||
@ -48,8 +45,7 @@ export function applyTapOnStyledActionBarAndSpan(args) {
|
||||
|
||||
page.backgroundSpanUnderStatusBar = true;
|
||||
page.actionBar.backgroundColor = new Color("#E0115F");
|
||||
var css = "#test-element { " + args.object.tag + " }";
|
||||
page.css = css;
|
||||
page.css = "#test-element { " + args.object.tag + " }";
|
||||
}
|
||||
|
||||
export function applyTapWithActionBarHiddenAndSpan(args) {
|
||||
@ -59,8 +55,7 @@ export function applyTapWithActionBarHiddenAndSpan(args) {
|
||||
|
||||
page.backgroundSpanUnderStatusBar = true;
|
||||
page.actionBarHidden = true;
|
||||
var css = "#test-element { " + args.object.tag + " }";
|
||||
page.css = css;
|
||||
page.css = "#test-element { " + args.object.tag + " }";
|
||||
}
|
||||
|
||||
function reset(page: Page) {
|
||||
|
@ -142,9 +142,6 @@ export class FileNameResolver implements definition.FileNameResolver {
|
||||
var candidates = this.getFileCandidatesFromFolder(path, ext);
|
||||
result = _findFileMatch(path, ext, candidates, this._context);
|
||||
|
||||
if (trace.isEnabled()) {
|
||||
trace.write("Resolved file name for \"" + path + ext + "\" result: " + (result ? result : "no match found"), trace.categories.Navigation);
|
||||
}
|
||||
return result;
|
||||
}
|
||||
|
||||
@ -179,9 +176,6 @@ export function _findFileMatch(path: string, ext: string, candidates: Array<stri
|
||||
var bestValue = -1
|
||||
var result: string = null;
|
||||
|
||||
if (trace.isEnabled()) {
|
||||
trace.write("Candidates for " + path + ext + ": " + candidates.join(", "), trace.categories.Navigation);
|
||||
}
|
||||
for (var i = 0; i < candidates.length; i++) {
|
||||
var filePath = candidates[i];
|
||||
var qualifiersStr: string = filePath.substr(path.length, filePath.length - path.length - ext.length);
|
||||
|
@ -261,7 +261,7 @@ export class ActionBar extends ActionBarBase {
|
||||
View.layoutChild(this, this.titleView, 0, 0, right - left, this._navigationBarHeight);
|
||||
this.actionItems.getItems().forEach((actionItem) => {
|
||||
if (actionItem.actionView && actionItem.actionView.ios) {
|
||||
let measuredWidth = actionItem.actionView.getMeasuredWidth();
|
||||
let measuredWidth = actionItem.actionView.getMeasuredWidth();
|
||||
let measuredHeight = actionItem.actionView.getMeasuredHeight();
|
||||
View.layoutChild(this, actionItem.actionView, 0, 0, measuredWidth, measuredHeight);
|
||||
}
|
||||
@ -314,10 +314,11 @@ export class ActionBar extends ActionBarBase {
|
||||
}
|
||||
return null;
|
||||
}
|
||||
set [backgroundColorProperty.native](value: UIColor) {
|
||||
set [backgroundColorProperty.native](value: UIColor | Color) {
|
||||
let navBar = this.navBar;
|
||||
if (navBar) {
|
||||
navBar.barTintColor = value;
|
||||
if (navBar && value) {
|
||||
let color = value instanceof Color ? value.ios : value;
|
||||
navBar.barTintColor = color;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -310,7 +310,7 @@ export class FrameBase extends CustomLayoutView implements FrameDefinition {
|
||||
return !backstackHidden;
|
||||
}
|
||||
|
||||
public _updateActionBar(page?: Page) {
|
||||
public _updateActionBar(page?: Page, disableNavBarAnimation?: boolean) {
|
||||
//traceWrite("calling _updateActionBar on Frame", traceCategories.Navigation);
|
||||
}
|
||||
|
||||
|
2
tns-core-modules/ui/frame/frame.d.ts
vendored
2
tns-core-modules/ui/frame/frame.d.ts
vendored
@ -104,7 +104,7 @@ declare module "ui/frame" {
|
||||
navigationQueueIsEmpty(): boolean;
|
||||
navigationBarHeight: number;
|
||||
_processNavigationQueue(page: Page);
|
||||
_updateActionBar(page?: Page);
|
||||
_updateActionBar(page?: Page, disableNavBarAnimation?: boolean);
|
||||
_getNavBarVisible(page: Page): boolean;
|
||||
//@endprivate
|
||||
|
||||
|
@ -114,10 +114,10 @@ export class Frame extends FrameBase {
|
||||
backstackEntry[NAV_DEPTH] = navDepth;
|
||||
viewController[ENTRY] = backstackEntry;
|
||||
|
||||
this._updateActionBar(backstackEntry.resolvedPage);
|
||||
|
||||
// First navigation.
|
||||
if (!this._currentEntry) {
|
||||
// Update action-bar with disabled animations before the initial navigation.
|
||||
this._updateActionBar(backstackEntry.resolvedPage, true);
|
||||
this._ios.controller.pushViewControllerAnimated(viewController, animated);
|
||||
if (traceEnabled()) {
|
||||
traceWrite(`${this}.pushViewControllerAnimated(${viewController}, ${animated}); depth = ${navDepth}`, traceCategories.Navigation);
|
||||
@ -194,16 +194,23 @@ export class Frame extends FrameBase {
|
||||
}
|
||||
}
|
||||
|
||||
public _updateActionBar(page?: Page): void {
|
||||
public _updateActionBar(page?: Page, disableNavBarAnimation: boolean = false): void {
|
||||
|
||||
super._updateActionBar(page);
|
||||
|
||||
page = page || this.currentPage;
|
||||
let newValue = this._getNavBarVisible(page);
|
||||
let disableNavBarAnimationCache = this._ios._disableNavBarAnimation;
|
||||
|
||||
var disableNavBarAnimation = this._ios._disableNavBarAnimation;
|
||||
if (disableNavBarAnimation) {
|
||||
this._ios._disableNavBarAnimation = true;
|
||||
}
|
||||
|
||||
this._ios.showNavigationBar = newValue;
|
||||
this._ios._disableNavBarAnimation = disableNavBarAnimation;
|
||||
|
||||
if (disableNavBarAnimation) {
|
||||
this._ios._disableNavBarAnimation = disableNavBarAnimationCache;
|
||||
}
|
||||
|
||||
if (this._ios.controller.navigationBar) {
|
||||
this._ios.controller.navigationBar.userInteractionEnabled = this.navigationQueueIsEmpty();
|
||||
@ -708,6 +715,7 @@ class iOSFrame implements iOSFrameDefinition {
|
||||
this._showNavigationBar = value;
|
||||
|
||||
let animated = !this._frame._isInitialNavigation && !this._disableNavBarAnimation;
|
||||
|
||||
this._controller.setNavigationBarHiddenAnimated(!value, animated);
|
||||
|
||||
let currentPage = this._controller.owner.currentPage;
|
||||
|
@ -42,11 +42,6 @@ export class PageBase extends ContentView implements PageDefinition {
|
||||
this.actionBar = new ActionBar();
|
||||
}
|
||||
|
||||
// public onLoaded() {
|
||||
// this._applyCss();
|
||||
// super.onLoaded();
|
||||
// }
|
||||
|
||||
get navigationContext(): any {
|
||||
return this._navigationContext;
|
||||
}
|
||||
|
@ -122,7 +122,7 @@ export class Page extends PageBase {
|
||||
public onLoaded() {
|
||||
super.onLoaded();
|
||||
if (this.actionBarHidden !== undefined) {
|
||||
this.updateActionBar(this.actionBarHidden);
|
||||
this.updateActionBar();
|
||||
}
|
||||
}
|
||||
|
||||
@ -170,7 +170,7 @@ export class Page extends PageBase {
|
||||
super._hideNativeModalView(parent);
|
||||
}
|
||||
|
||||
private updateActionBar(hidden: boolean) {
|
||||
private updateActionBar() {
|
||||
this.actionBar.update();
|
||||
}
|
||||
|
||||
@ -178,7 +178,7 @@ export class Page extends PageBase {
|
||||
return undefined;
|
||||
}
|
||||
set [actionBarHiddenProperty.native](value: boolean) {
|
||||
this.updateActionBar(value);
|
||||
this.updateActionBar();
|
||||
}
|
||||
|
||||
get [statusBarStyleProperty.native](): { color: number, systemUiVisibility: number } {
|
||||
|
@ -147,11 +147,11 @@ class UIViewControllerImpl extends UIViewController {
|
||||
super.viewWillAppear(animated);
|
||||
this.shown = false;
|
||||
let page = this._owner.get();
|
||||
if (traceEnabled()) {
|
||||
if (traceEnabled()) {
|
||||
|
||||
if (traceEnabled) {
|
||||
traceWrite(page + " viewWillAppear", traceCategories.Navigation);
|
||||
}
|
||||
}
|
||||
|
||||
if (!page) {
|
||||
return;
|
||||
}
|
||||
@ -249,6 +249,8 @@ class UIViewControllerImpl extends UIViewController {
|
||||
};
|
||||
|
||||
public viewWillDisappear(animated: boolean): void {
|
||||
super.viewWillDisappear(animated);
|
||||
|
||||
let page = this._owner.get();
|
||||
if (traceEnabled()) {
|
||||
traceWrite(page + " viewWillDisappear", traceCategories.Navigation);
|
||||
@ -275,6 +277,8 @@ class UIViewControllerImpl extends UIViewController {
|
||||
}
|
||||
|
||||
public viewDidDisappear(animated: boolean): void {
|
||||
super.viewDidDisappear(animated);
|
||||
|
||||
let page = this._owner.get();
|
||||
if (traceEnabled()) {
|
||||
traceWrite(page + " viewDidDisappear", traceCategories.Navigation);
|
||||
@ -362,9 +366,7 @@ export class Page extends PageBase {
|
||||
super.onLoaded();
|
||||
}
|
||||
|
||||
if (this.actionBarHidden !== undefined) {
|
||||
this.updateActionBar(this.actionBarHidden);
|
||||
}
|
||||
this.updateActionBar();
|
||||
}
|
||||
|
||||
public onUnloaded() {
|
||||
@ -448,10 +450,10 @@ export class Page extends PageBase {
|
||||
super._hideNativeModalView(parent);
|
||||
}
|
||||
|
||||
private updateActionBar(hidden: boolean) {
|
||||
private updateActionBar(disableNavBarAnimation: boolean = false) {
|
||||
const frame = this.frame;
|
||||
if (frame) {
|
||||
frame._updateActionBar(this);
|
||||
frame._updateActionBar(this, disableNavBarAnimation);
|
||||
}
|
||||
}
|
||||
|
||||
@ -585,7 +587,8 @@ export class Page extends PageBase {
|
||||
set [actionBarHiddenProperty.native](value: boolean) {
|
||||
this._updateEnableSwipeBackNavigation(value);
|
||||
if (this.isLoaded) {
|
||||
this.updateActionBar(value);
|
||||
// Update nav-bar visibility with disabled animations
|
||||
this.updateActionBar(true);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -44,12 +44,9 @@ export class Progress extends ProgressBase {
|
||||
get [backgroundColorProperty.native](): UIColor {
|
||||
return this._ios.trackTintColor;
|
||||
}
|
||||
set [backgroundColorProperty.native](value: Color) {
|
||||
if (value instanceof Color) {
|
||||
this._ios.trackTintColor = value.ios;
|
||||
} else {
|
||||
this._ios.trackTintColor = value;
|
||||
}
|
||||
set [backgroundColorProperty.native](value: UIColor | Color) {
|
||||
let color = value instanceof Color ? value.ios : value;
|
||||
this._ios.trackTintColor = color;
|
||||
}
|
||||
|
||||
get [backgroundInternalProperty.native](): UIColor {
|
||||
|
Reference in New Issue
Block a user