javascript/NativeScript
1
0
Fork 0
mirror of https://github.com/NativeScript/NativeScript.git synced 2025-08-26 11:17:04 +08:00
Code Issues Packages Projects Releases Wiki Activity

Animated nav-bar

Browse Source
This commit is contained in:
vakrilov
2017-01-24 13:06:30 +02:00
parent da4983c6bc
commit d448f3dc7f
10 changed files with 47 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
apps/app/ui-tests-app/page/page-status-bar-css.ts
View File

@ -9,7 +9,7 @@ export function applyTap(args) {
let css = "#test-element { " + args.object.tag + " }"; let css = "#test-element { " + args.object.tag + " }";
page.css = css; page.css = css;
} }
export function applyTapOnStyledActionBar(args) { export function applyTapOnStyledActionBar(args) {
let page = <Page>(<View>args.object).page; let page = <Page>(<View>args.object).page;
@ -17,8 +17,7 @@ export function applyTapOnStyledActionBar(args) {
reset(page); reset(page);
page.actionBar.backgroundColor = new Color("#5DFC0A"); page.actionBar.backgroundColor = new Color("#5DFC0A");
var css = "#test-element { " + args.object.tag + " }"; page.css = "#test-element { " + args.object.tag + " }";
page.css = css;
} }
export function applyTapWithHiddenActionBar(args) { export function applyTapWithHiddenActionBar(args) {
@ -27,8 +26,7 @@ export function applyTapWithHiddenActionBar(args) {
reset(page); reset(page);
page.actionBarHidden = true; page.actionBarHidden = true;
var css = "#test-element { " + args.object.tag + " }"; page.css = "#test-element { " + args.object.tag + " }";
page.css = css;
} }
export function applyTapWithSpan(args) { export function applyTapWithSpan(args) {
@ -37,8 +35,7 @@ export function applyTapWithSpan(args) {
reset(page); reset(page);
page.backgroundSpanUnderStatusBar = true; page.backgroundSpanUnderStatusBar = true;
var css = "#test-element { " + args.object.tag + " }"; page.css = "#test-element { " + args.object.tag + " }";
page.css = css;
} }
export function applyTapOnStyledActionBarAndSpan(args) { export function applyTapOnStyledActionBarAndSpan(args) {
@ -48,8 +45,7 @@ export function applyTapOnStyledActionBarAndSpan(args) {
page.backgroundSpanUnderStatusBar = true; page.backgroundSpanUnderStatusBar = true;
page.actionBar.backgroundColor = new Color("#E0115F"); page.actionBar.backgroundColor = new Color("#E0115F");
var css = "#test-element { " + args.object.tag + " }"; page.css = "#test-element { " + args.object.tag + " }";
page.css = css;
} }
export function applyTapWithActionBarHiddenAndSpan(args) { export function applyTapWithActionBarHiddenAndSpan(args) {
@ -59,8 +55,7 @@ export function applyTapWithActionBarHiddenAndSpan(args) {
page.backgroundSpanUnderStatusBar = true; page.backgroundSpanUnderStatusBar = true;
page.actionBarHidden = true; page.actionBarHidden = true;
var css = "#test-element { " + args.object.tag + " }"; page.css = "#test-element { " + args.object.tag + " }";
page.css = css;
} }
function reset(page: Page) { function reset(page: Page) {

6
tns-core-modules/file-system/file-name-resolver.ts
View File

@ -142,9 +142,6 @@ export class FileNameResolver implements definition.FileNameResolver {
var candidates = this.getFileCandidatesFromFolder(path, ext); var candidates = this.getFileCandidatesFromFolder(path, ext);
result = _findFileMatch(path, ext, candidates, this._context); 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; return result;
} }
@ -179,9 +176,6 @@ export function _findFileMatch(path: string, ext: string, candidates: Array<stri
var bestValue = -1 var bestValue = -1
var result: string = null; 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++) { for (var i = 0; i < candidates.length; i++) {
var filePath = candidates[i]; var filePath = candidates[i];
var qualifiersStr: string = filePath.substr(path.length, filePath.length - path.length - ext.length); var qualifiersStr: string = filePath.substr(path.length, filePath.length - path.length - ext.length);

9
tns-core-modules/ui/action-bar/action-bar.ios.ts
View File

@ -261,7 +261,7 @@ export class ActionBar extends ActionBarBase {
View.layoutChild(this, this.titleView, 0, 0, right - left, this._navigationBarHeight); View.layoutChild(this, this.titleView, 0, 0, right - left, this._navigationBarHeight);
this.actionItems.getItems().forEach((actionItem) => { this.actionItems.getItems().forEach((actionItem) => {
if (actionItem.actionView && actionItem.actionView.ios) { if (actionItem.actionView && actionItem.actionView.ios) {
let measuredWidth = actionItem.actionView.getMeasuredWidth(); let measuredWidth = actionItem.actionView.getMeasuredWidth(); 
let measuredHeight = actionItem.actionView.getMeasuredHeight(); let measuredHeight = actionItem.actionView.getMeasuredHeight();
View.layoutChild(this, actionItem.actionView, 0, 0, measuredWidth, measuredHeight); View.layoutChild(this, actionItem.actionView, 0, 0, measuredWidth, measuredHeight);
} }
@ -314,10 +314,11 @@ export class ActionBar extends ActionBarBase {
} }
return null; return null;
} }
set [backgroundColorProperty.native](value: UIColor) { set [backgroundColorProperty.native](value: UIColor | Color) {
let navBar = this.navBar; let navBar = this.navBar;
if (navBar) { if (navBar && value) {
navBar.barTintColor = value; let color = value instanceof Color ? value.ios : value;
navBar.barTintColor = color;
} }
} }

4
tns-core-modules/ui/frame/frame-common.ts
View File

@ -211,7 +211,7 @@ export class FrameBase extends CustomLayoutView implements FrameDefinition {
// if (!this._currentEntry){ // if (!this._currentEntry){
// return; // return;
// } // }
// let currentPage = this._currentEntry.resolvedPage; // let currentPage = this._currentEntry.resolvedPage;
// let currentNavigationEntry = this._currentEntry.entry; // let currentNavigationEntry = this._currentEntry.entry;
// if (currentPage["isBiOrientational"] && currentNavigationEntry.moduleName) { // if (currentPage["isBiOrientational"] && currentNavigationEntry.moduleName) {
@ -310,7 +310,7 @@ export class FrameBase extends CustomLayoutView implements FrameDefinition {
return !backstackHidden; return !backstackHidden;
} }
public _updateActionBar(page?: Page) { public _updateActionBar(page?: Page, disableNavBarAnimation?: boolean) {
//traceWrite("calling _updateActionBar on Frame", traceCategories.Navigation); //traceWrite("calling _updateActionBar on Frame", traceCategories.Navigation);
} }

2
tns-core-modules/ui/frame/frame.d.ts vendored
View File

@ -104,7 +104,7 @@ declare module "ui/frame" {
navigationQueueIsEmpty(): boolean; navigationQueueIsEmpty(): boolean;
navigationBarHeight: number; navigationBarHeight: number;
_processNavigationQueue(page: Page); _processNavigationQueue(page: Page);
_updateActionBar(page?: Page); _updateActionBar(page?: Page, disableNavBarAnimation?: boolean);
_getNavBarVisible(page: Page): boolean; _getNavBarVisible(page: Page): boolean;
//@endprivate //@endprivate

20
tns-core-modules/ui/frame/frame.ios.ts
View File

@ -114,10 +114,10 @@ export class Frame extends FrameBase {
backstackEntry[NAV_DEPTH] = navDepth; backstackEntry[NAV_DEPTH] = navDepth;
viewController[ENTRY] = backstackEntry; viewController[ENTRY] = backstackEntry;
this._updateActionBar(backstackEntry.resolvedPage);
// First navigation. // First navigation.
if (!this._currentEntry) { if (!this._currentEntry) {
// Update action-bar with disabled animations before the initial navigation.
this._updateActionBar(backstackEntry.resolvedPage, true);
this._ios.controller.pushViewControllerAnimated(viewController, animated); this._ios.controller.pushViewControllerAnimated(viewController, animated);
if (traceEnabled()) { if (traceEnabled()) {
traceWrite(`${this}.pushViewControllerAnimated(${viewController}, ${animated}); depth = ${navDepth}`, traceCategories.Navigation); 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); super._updateActionBar(page);
page = page || this.currentPage; page = page || this.currentPage;
let newValue = this._getNavBarVisible(page); let newValue = this._getNavBarVisible(page);
let disableNavBarAnimationCache = this._ios._disableNavBarAnimation;
if (disableNavBarAnimation) {
this._ios._disableNavBarAnimation = true;
}
var disableNavBarAnimation = this._ios._disableNavBarAnimation;
this._ios._disableNavBarAnimation = true;
this._ios.showNavigationBar = newValue; this._ios.showNavigationBar = newValue;
this._ios._disableNavBarAnimation = disableNavBarAnimation;
if (disableNavBarAnimation) {
this._ios._disableNavBarAnimation = disableNavBarAnimationCache;
}
if (this._ios.controller.navigationBar) { if (this._ios.controller.navigationBar) {
this._ios.controller.navigationBar.userInteractionEnabled = this.navigationQueueIsEmpty(); this._ios.controller.navigationBar.userInteractionEnabled = this.navigationQueueIsEmpty();
@ -708,6 +715,7 @@ class iOSFrame implements iOSFrameDefinition {
this._showNavigationBar = value; this._showNavigationBar = value;
let animated = !this._frame._isInitialNavigation && !this._disableNavBarAnimation; let animated = !this._frame._isInitialNavigation && !this._disableNavBarAnimation;
this._controller.setNavigationBarHiddenAnimated(!value, animated); this._controller.setNavigationBarHiddenAnimated(!value, animated);
let currentPage = this._controller.owner.currentPage; let currentPage = this._controller.owner.currentPage;

5
tns-core-modules/ui/page/page-common.ts
View File

@ -42,11 +42,6 @@ export class PageBase extends ContentView implements PageDefinition {
this.actionBar = new ActionBar(); this.actionBar = new ActionBar();
} }
// public onLoaded() {
// this._applyCss();
// super.onLoaded();
// }
get navigationContext(): any { get navigationContext(): any {
return this._navigationContext; return this._navigationContext;
} }

6
tns-core-modules/ui/page/page.android.ts
View File

@ -122,7 +122,7 @@ export class Page extends PageBase {
public onLoaded() { public onLoaded() {
super.onLoaded(); super.onLoaded();
if (this.actionBarHidden !== undefined) { if (this.actionBarHidden !== undefined) {
this.updateActionBar(this.actionBarHidden); this.updateActionBar();
} }
} }
@ -170,7 +170,7 @@ export class Page extends PageBase {
super._hideNativeModalView(parent); super._hideNativeModalView(parent);
} }
private updateActionBar(hidden: boolean) { private updateActionBar() {
this.actionBar.update(); this.actionBar.update();
} }
@ -178,7 +178,7 @@ export class Page extends PageBase {
return undefined; return undefined;
} }
set [actionBarHiddenProperty.native](value: boolean) { set [actionBarHiddenProperty.native](value: boolean) {
this.updateActionBar(value); this.updateActionBar();
} }
get [statusBarStyleProperty.native](): { color: number, systemUiVisibility: number } { get [statusBarStyleProperty.native](): { color: number, systemUiVisibility: number } {

23
tns-core-modules/ui/page/page.ios.ts
View File

@ -147,11 +147,11 @@ class UIViewControllerImpl extends UIViewController {
super.viewWillAppear(animated); super.viewWillAppear(animated);
this.shown = false; this.shown = false;
let page = this._owner.get(); let page = this._owner.get();
if (traceEnabled()) {
if (traceEnabled()) { if (traceEnabled) {
traceWrite(page + " viewWillAppear", traceCategories.Navigation); traceWrite(page + " viewWillAppear", traceCategories.Navigation);
}
} }
if (!page) { if (!page) {
return; return;
} }
@ -249,6 +249,8 @@ class UIViewControllerImpl extends UIViewController {
}; };
public viewWillDisappear(animated: boolean): void { public viewWillDisappear(animated: boolean): void {
super.viewWillDisappear(animated);
let page = this._owner.get(); let page = this._owner.get();
if (traceEnabled()) { if (traceEnabled()) {
traceWrite(page + " viewWillDisappear", traceCategories.Navigation); traceWrite(page + " viewWillDisappear", traceCategories.Navigation);
@ -275,6 +277,8 @@ class UIViewControllerImpl extends UIViewController {
} }
public viewDidDisappear(animated: boolean): void { public viewDidDisappear(animated: boolean): void {
super.viewDidDisappear(animated);
let page = this._owner.get(); let page = this._owner.get();
if (traceEnabled()) { if (traceEnabled()) {
traceWrite(page + " viewDidDisappear", traceCategories.Navigation); traceWrite(page + " viewDidDisappear", traceCategories.Navigation);
@ -362,9 +366,7 @@ export class Page extends PageBase {
super.onLoaded(); super.onLoaded();
} }
if (this.actionBarHidden !== undefined) { this.updateActionBar();
this.updateActionBar(this.actionBarHidden);
}
} }
public onUnloaded() { public onUnloaded() {
@ -448,10 +450,10 @@ export class Page extends PageBase {
super._hideNativeModalView(parent); super._hideNativeModalView(parent);
} }
private updateActionBar(hidden: boolean) { private updateActionBar(disableNavBarAnimation: boolean = false) {
const frame = this.frame; const frame = this.frame;
if (frame) { if (frame) {
frame._updateActionBar(this); frame._updateActionBar(this, disableNavBarAnimation);
} }
} }
@ -585,7 +587,8 @@ export class Page extends PageBase {
set [actionBarHiddenProperty.native](value: boolean) { set [actionBarHiddenProperty.native](value: boolean) {
this._updateEnableSwipeBackNavigation(value); this._updateEnableSwipeBackNavigation(value);
if (this.isLoaded) { if (this.isLoaded) {
this.updateActionBar(value); // Update nav-bar visibility with disabled animations
this.updateActionBar(true);
} }
} }

9
tns-core-modules/ui/progress/progress.ios.ts
View File

@ -44,12 +44,9 @@ export class Progress extends ProgressBase {
get [backgroundColorProperty.native](): UIColor { get [backgroundColorProperty.native](): UIColor {
return this._ios.trackTintColor; return this._ios.trackTintColor;
} }
set [backgroundColorProperty.native](value: Color) { set [backgroundColorProperty.native](value: UIColor | Color) {
if (value instanceof Color) { let color = value instanceof Color ? value.ios : value;
this._ios.trackTintColor = value.ios; this._ios.trackTintColor = color;
} else {
this._ios.trackTintColor = value;
}
} }
get [backgroundInternalProperty.native](): UIColor { get [backgroundInternalProperty.native](): UIColor {