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

Center View

Browse Source
This commit is contained in:
vakrilov
2015-07-10 18:47:12 +03:00
parent 53dc1c65bf
commit 53c7bebfec
17 changed files with 209 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
ui/action-bar/action-bar-common.ts
View File

@@ -4,6 +4,9 @@ import bindable = require("ui/core/bindable");
import dependencyObservable = require("ui/core/dependency-observable");
import enums = require("ui/enums");
import proxy = require("ui/core/proxy");
import view = require("ui/core/view");
import style = require("ui/styling/style");
import observable = require("ui/core/dependency-observable");
var ACTION_ITEMS = "actionItems";
@@ -21,7 +24,7 @@ function onIconPropertyChanged(data: dependencyObservable.PropertyChangeData) {
actionBar._onIconPropertyChanged();
}
export class ActionBar extends bindable.Bindable implements dts.ActionBar {
export class ActionBar extends view.View implements dts.ActionBar {
public static titleProperty = new dependencyObservable.Property("title", "ActionBar", new proxy.PropertyMetadata(undefined, dependencyObservable.PropertyMetadataSettings.None, onTitlePropertyChanged));
public static iconProperty = new dependencyObservable.Property("icon", "ActionBar", new proxy.PropertyMetadata(undefined, dependencyObservable.PropertyMetadataSettings.None, onIconPropertyChanged));
public static androidIconVisibilityProperty = new dependencyObservable.Property("androidIconVisibility", "ActionBar", new proxy.PropertyMetadata("auto", dependencyObservable.PropertyMetadataSettings.None, onIconPropertyChanged));
@@ -29,6 +32,7 @@ export class ActionBar extends bindable.Bindable implements dts.ActionBar {
private _actionItems: ActionItems;
private _navigationButton: NavigationButton;
private _page: pages.Page;
private _centerView: view.View;
get title(): string {
return this._getValue(ActionBar.titleProperty);
@@ -77,6 +81,29 @@ export class ActionBar extends bindable.Bindable implements dts.ActionBar {
throw new Error("actionItems property is read-only");
}
get centerView(): view.View {
return this._centerView;
}
set centerView(value: view.View) {
if (this._centerView !== value) {
if (this._centerView) {
this._removeView(this._centerView);
this._centerView.style._resetValue(style.horizontalAlignmentProperty, observable.ValueSource.Inherited);
this._centerView.style._resetValue(style.verticalAlignmentProperty, observable.ValueSource.Inherited);
}
this._centerView = value;
if (this._centerView) {
this._centerView.style._setValue(style.horizontalAlignmentProperty, enums.HorizontalAlignment.center, observable.ValueSource.Inherited);
this._centerView.style._setValue(style.verticalAlignmentProperty, enums.VerticalAlignment.center, observable.ValueSource.Inherited);
this._addView(this._centerView);
}
this.updateActionBar();
}
}
get page(): pages.Page {
return this._page;
}
@@ -90,6 +117,10 @@ export class ActionBar extends bindable.Bindable implements dts.ActionBar {
}, this._page);
}
get _childrenCount(): number {
return this.centerView ? 1 : 0;
}
constructor() {
super();
this._actionItems = new ActionItems(this);
@@ -124,10 +155,13 @@ export class ActionBar extends bindable.Bindable implements dts.ActionBar {
}
public _addChildFromBuilder(name: string, value: any) {
if (value instanceof NavigationButton) {
this.navigationButton = value;
}
if (value instanceof view.View) {
this.centerView = value;
}
}
public _onBindingContextChanged(oldValue: any, newValue: any) {
@@ -139,6 +173,12 @@ export class ActionBar extends bindable.Bindable implements dts.ActionBar {
this._actionItems.getItems().forEach((item, i, arr) => { item.bindingContext = newValue; });
}
public _eachChildView(callback: (child: view.View) => boolean) {
if (this.centerView) {
callback(this.centerView);
}
}
public shouldShow(): boolean {
if (this.title ||
this.icon ||

32
ui/action-bar/action-bar.android.ts
View File

@@ -51,14 +51,13 @@ export class ActionBar extends common.ActionBar {
this._addActionItems(menu);
// Set title
this._updateTitle(actionBar);
this._updateTitleAndCenterView(actionBar);
// Set home icon
this._updateIcon(actionBar);
// Set navigation button
this._updateNavigationButton(actionBar);
}
public _updateNavigationButton(actionBar: android.app.ActionBar) {
@@ -102,13 +101,25 @@ export class ActionBar extends common.ActionBar {
actionBar.setDisplayShowHomeEnabled(visibility);
}
public _updateTitle(actionBar: android.app.ActionBar) {
var title = this.title;
if (types.isDefined(title)) {
actionBar.setTitle(title);
} else {
var defaultLabel = application.android.nativeApp.getApplicationInfo().labelRes;
actionBar.setTitle(defaultLabel);
public _updateTitleAndCenterView(actionBar: android.app.ActionBar) {
if (this.centerView) {
actionBar.setCustomView(this.centerView.android);
actionBar.setDisplayShowCustomEnabled(true);
actionBar.setDisplayShowTitleEnabled(false);
}
else {
actionBar.setCustomView(null);
actionBar.setDisplayShowCustomEnabled(false);
actionBar.setDisplayShowTitleEnabled(true);
// No center view - show the title
var title = this.title;
if (types.isDefined(title)) {
actionBar.setTitle(title);
} else {
var defaultLabel = application.android.nativeApp.getApplicationInfo().labelRes;
actionBar.setTitle(defaultLabel);
}
}
}
@@ -119,7 +130,6 @@ export class ActionBar extends common.ActionBar {
var item = items[i];
var menuItem = menu.add(android.view.Menu.NONE, i + ACTION_ITEM_ID_OFFSET, android.view.Menu.NONE, item.text);
if (item.icon) {
var drawableOrId = getDrawableOrResourceId(item.icon, this._appResources);
if (drawableOrId) {
menuItem.setIcon(drawableOrId);
@@ -133,7 +143,7 @@ export class ActionBar extends common.ActionBar {
public _onTitlePropertyChanged() {
if (frame.topmost().currentPage === this.page) {
this._updateTitle(frame.topmost().android.actionBar);
this._updateTitleAndCenterView(frame.topmost().android.actionBar);
}
}

4
ui/action-bar/action-bar.d.ts vendored
View File

@@ -4,14 +4,16 @@
import dependencyObservable = require("ui/core/dependency-observable");
import bindable = require("ui/core/bindable");
import pages = require("ui/page");
import contentView = require("ui/content-view");
export class ActionBar extends bindable.Bindable implements view.AddArrayFromBuilder, view.AddChildFromBuilder {
export class ActionBar extends view.View implements view.AddArrayFromBuilder, view.AddChildFromBuilder {
title: string;
icon: string;
androidIconVisibility: string;
navigationButton: NavigationButton;
actionItems: ActionItems;
centerView: view.View;
page: pages.Page;

34
ui/action-bar/action-bar.ios.ts
View File

@@ -3,6 +3,8 @@ import definition = require("ui/action-bar");
import imageSource = require("image-source");
import frameModule = require("ui/frame");
import enums = require("ui/enums");
import view = require("ui/core/view");
import utils = require("utils/utils");
declare var exports;
require("utils/module-merge").merge(common, exports);
@@ -23,6 +25,11 @@ export class ActionBar extends common.ActionBar {
// Set Title
navigationItem.title = this.title;
if (this.centerView && this.centerView.ios) {
console.log("setting center view: " + this.centerView.ios);
navigationItem.titleView = this.centerView.ios;
}
// Find previous ViewController in the navigation stack
var indexOfViewController = navController.viewControllers.indexOfObject(viewController);
if (indexOfViewController !== NSNotFound && indexOfViewController > 0) {
@@ -116,6 +123,33 @@ export class ActionBar extends common.ActionBar {
var navigationItem: UINavigationItem = (<UIViewController>this.page.ios).navigationItem;
navigationItem.title = this.title;
}
public onMeasure(widthMeasureSpec: number, heightMeasureSpec: number) {
if (this.centerView) {
var width = utils.layout.getMeasureSpecSize(widthMeasureSpec);
view.View.measureChild(this, this.centerView,
utils.layout.makeMeasureSpec(width, utils.layout.AT_MOST),
utils.layout.makeMeasureSpec(this.navigationBarHeight, utils.layout.AT_MOST));
}
this.setMeasuredDimension(0, 0);
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}
public onLayout(left: number, top: number, right: number, bottom: number) {
view.View.layoutChild(this, this.centerView, 0, 0, right - left, this.navigationBarHeight);
super.onLayout(left, top, right, bottom);
}
protected get navigationBarHeight(): number {
var navController = frameModule.topmost().ios.controller;
if(!navController){
return 0;
}
var navigationBar = navController.navigationBar;
return (navigationBar && !navController.navigationBarHidden) ? navigationBar.frame.size.height : 0;
}
}
class TapBarItemHandlerImpl extends NSObject {

4
ui/core/view.ios.ts
View File

@@ -172,6 +172,10 @@ export class View extends viewCommon.View {
}
public layoutNativeView(left: number, top: number, right: number, bottom: number): void {
if (!this._nativeView) {
return;
}
var frame = CGRectMake(left, top, right - left, bottom - top);
// This is done because when rotated in iOS7 there is rotation applied on the first subview on the Window which is our frame.nativeView.view.

8
ui/page/page-common.ts
View File

@@ -124,7 +124,7 @@ export class Page extends contentView.ContentView implements dts.Page {
cssFileName = fs.path.join(fs.knownFolders.currentApp().path, cssFileName.replace("~/", ""));
}
if (!this._cssFiles[cssFileName]) {
if (fs.File.exists(cssFileName)) {
if (fs.File.exists(cssFileName)) {
new fileSystemAccess.FileSystemAccess().readText(cssFileName, r => {
this._addCssInternal(r, cssFileName);
this._cssFiles[cssFileName] = true;
@@ -214,6 +214,12 @@ export class Page extends contentView.ContentView implements dts.Page {
return this._styleScope;
}
public _eachChildView(callback: (child: view.View) => boolean) {
super._eachChildView(callback);
callback(this.actionBar);
}
private _applyCss() {
if (this._cssApplied) {
return;

10
ui/page/page.ios.ts
View File

@@ -155,4 +155,14 @@ export class Page extends pageCommon.Page {
this.requestLayout();
}
}
public onMeasure(widthMeasureSpec: number, heightMeasureSpec: number) {
viewModule.View.measureChild(this, this.actionBar, widthMeasureSpec, heightMeasureSpec);
super.onMeasure(widthMeasureSpec, heightMeasureSpec);
}
public onLayout(left: number, top: number, right: number, bottom: number) {
viewModule.View.layoutChild(this, this.actionBar, 0, 0, right - left, bottom - top);
super.onLayout(left, top, right, bottom);
}
}

4
ui/styling/background.ios.ts
View File

@@ -7,6 +7,10 @@ require("utils/module-merge").merge(common, exports);
export module ios {
export function createBackgroundUIColor(view: viewModule.View): UIColor {
if(!view._nativeView){
return null;
}
var background = <common.Background> view.style._getValue(style.backgroundInternalProperty);
var frame = (<UIView>view._nativeView).frame;
var boundsWidth = frame.size.width;