diff --git a/CrossPlatformModules.csproj b/CrossPlatformModules.csproj
index 7acaf01a7..bedf36d76 100644
--- a/CrossPlatformModules.csproj
+++ b/CrossPlatformModules.csproj
@@ -107,6 +107,9 @@
+
+ Always
+
Designer
@@ -1921,7 +1924,7 @@
False
-
+
diff --git a/apps/editable-text-demo/main-page.css b/apps/editable-text-demo/main-page.css
new file mode 100644
index 000000000..105339b84
--- /dev/null
+++ b/apps/editable-text-demo/main-page.css
@@ -0,0 +1,14 @@
+Button, Label, TextView, TextField {
+ border-color: black;
+ border-width: 10;
+ border-radius: 3;
+ padding: 10;
+ /*padding-left: 20;
+ padding-top: 20;
+ padding-right: 20;
+ padding-bottom: 20;*/
+ margin: 10;
+ font-size: 24;
+ text-align: left;
+ color: black;
+}
\ No newline at end of file
diff --git a/apps/editable-text-demo/main-page.ts b/apps/editable-text-demo/main-page.ts
index 6c28bddde..ee6790b57 100644
--- a/apps/editable-text-demo/main-page.ts
+++ b/apps/editable-text-demo/main-page.ts
@@ -1,51 +1,51 @@
-import observableModule = require("data/observable");
-import pagesModule = require("ui/page");
-import textFieldModule = require("ui/text-field");
-import textViewModule = require("ui/text-view");
-import buttonModule = require("ui/button");
-import labelModule = require("ui/label");
-import model = require("./model");
-import colorModule = require("color");
-import stackLayoutModule = require("ui/layouts/stack-layout");
-import enums = require("ui/enums");
+//import observableModule = require("data/observable");
+//import pagesModule = require("ui/page");
+//import textFieldModule = require("ui/text-field");
+//import textViewModule = require("ui/text-view");
+//import buttonModule = require("ui/button");
+//import labelModule = require("ui/label");
+//import model = require("./model");
+//import colorModule = require("color");
+//import stackLayoutModule = require("ui/layouts/stack-layout");
+//import enums = require("ui/enums");
-var stackLayout: stackLayoutModule.StackLayout;
-var textField: textFieldModule.TextField;
-var textView: textViewModule.TextView;
-var button: buttonModule.Button;
-var label: labelModule.Label;
+//var stackLayout: stackLayoutModule.StackLayout;
+//var textField: textFieldModule.TextField;
+//var textView: textViewModule.TextView;
+//var button: buttonModule.Button;
+//var label: labelModule.Label;
-export function onPageLoaded(args: observableModule.EventData) {
- var page = args.object;
+//export function onPageLoaded(args: observableModule.EventData) {
+// var page = args.object;
- stackLayout = page.getViewById("stack");
- button = page.getViewById("button");
- label = page.getViewById("label");
+// stackLayout = page.getViewById("stack");
+// button = page.getViewById("button");
+// label = page.getViewById("label");
- if (stackLayout.android) {
- stackLayout.android.setClickable(true);
- stackLayout.android.setFocusableInTouchMode(true);
- }
+// if (stackLayout.android) {
+// stackLayout.android.setClickable(true);
+// stackLayout.android.setFocusableInTouchMode(true);
+// }
- textField = page.getViewById("textField");
- textField.style.backgroundColor = new colorModule.Color("LightGray");
+// textField = page.getViewById("textField");
+// textField.style.backgroundColor = new colorModule.Color("LightGray");
- textView = page.getViewById("textView");
- textView.style.backgroundColor = new colorModule.Color("BlanchedAlmond");
+// textView = page.getViewById("textView");
+// textView.style.backgroundColor = new colorModule.Color("BlanchedAlmond");
- var viewModel = new model.WebViewModel();
- page.bindingContext = viewModel;
-}
+// var viewModel = new model.WebViewModel();
+// page.bindingContext = viewModel;
+//}
-export function onTap(args: observableModule.EventData) {
- if (textField.updateTextTrigger === enums.UpdateTextTrigger.focusLost) {
- textField.updateTextTrigger = enums.UpdateTextTrigger.textChanged;
- textView.updateTextTrigger = enums.UpdateTextTrigger.textChanged;
- button.text = "textChanged";
- }
- else {
- textField.updateTextTrigger = enums.UpdateTextTrigger.focusLost;
- textView.updateTextTrigger = enums.UpdateTextTrigger.focusLost;
- button.text = "focusLost";
- }
-}
\ No newline at end of file
+//export function onTap(args: observableModule.EventData) {
+// if (textField.updateTextTrigger === enums.UpdateTextTrigger.focusLost) {
+// textField.updateTextTrigger = enums.UpdateTextTrigger.textChanged;
+// textView.updateTextTrigger = enums.UpdateTextTrigger.textChanged;
+// button.text = "textChanged";
+// }
+// else {
+// textField.updateTextTrigger = enums.UpdateTextTrigger.focusLost;
+// textView.updateTextTrigger = enums.UpdateTextTrigger.focusLost;
+// button.text = "focusLost";
+// }
+//}
\ No newline at end of file
diff --git a/apps/editable-text-demo/main-page.xml b/apps/editable-text-demo/main-page.xml
index 3bec025a2..d6499a113 100644
--- a/apps/editable-text-demo/main-page.xml
+++ b/apps/editable-text-demo/main-page.xml
@@ -1,8 +1,8 @@
-
-
-
-
-
-
+
+
+
+
+
+
\ No newline at end of file
diff --git a/ui/core/view-common.ts b/ui/core/view-common.ts
index 4529918a3..5eb040a04 100644
--- a/ui/core/view-common.ts
+++ b/ui/core/view-common.ts
@@ -752,10 +752,6 @@ export class View extends proxy.ProxyObject implements definition.View {
//@endandroid
// TODO: We need to implement some kind of build step that includes these members only when building for iOS
- //@ios
- public _prepareNativeView(view: UIView) {
- //
- }
//@endios
get _childrenCount(): number {
diff --git a/ui/core/view.d.ts b/ui/core/view.d.ts
index 598ceb762..9b86188ff 100644
--- a/ui/core/view.d.ts
+++ b/ui/core/view.d.ts
@@ -418,8 +418,6 @@ declare module "ui/core/view" {
_onDetached(force?: boolean): void;
_createUI(): void;
- _prepareNativeView(view: UIView);
-
_checkMetadataOnPropertyChanged(metadata: dependencyObservable.PropertyMetadata);
_updateLayout(): void;
diff --git a/ui/core/view.ios.ts b/ui/core/view.ios.ts
index 1e1e4127d..448b2a730 100644
--- a/ui/core/view.ios.ts
+++ b/ui/core/view.ios.ts
@@ -82,11 +82,6 @@ export class View extends viewCommon.View {
return this.ios;
}
- public _prepareNativeView(view: UIView) {
- // For UILabel and UIImage.
- view.userInteractionEnabled = true;
- }
-
get isLayoutRequested(): boolean {
return (this._privateFlags & PFLAG_FORCE_LAYOUT) === PFLAG_FORCE_LAYOUT;
}
@@ -257,7 +252,7 @@ export class CustomLayoutView extends View {
if (this._nativeView && child._nativeView) {
if (types.isNullOrUndefined(atIndex) || atIndex >= this._nativeView.subviews.count) {
- this._nativeView.addSubview(child._nativeView);
+ this._nativeView.addSubview(child._nativeView);
}
else {
this._nativeView.insertSubviewAtIndex(child._nativeView, atIndex);
diff --git a/ui/html-view/html-view.ios.ts b/ui/html-view/html-view.ios.ts
index 02af1152a..b1ede80ef 100644
--- a/ui/html-view/html-view.ios.ts
+++ b/ui/html-view/html-view.ios.ts
@@ -33,7 +33,7 @@ export class HtmlView extends common.HtmlView {
super(options);
this._ios = new UILabel();
- super._prepareNativeView(this._ios);
+ this._ios.userInteractionEnabled = true;
}
get ios(): UILabel {
diff --git a/ui/image/image.ios.ts b/ui/image/image.ios.ts
index 54bb91752..138848449 100644
--- a/ui/image/image.ios.ts
+++ b/ui/image/image.ios.ts
@@ -48,7 +48,7 @@ export class Image extends imageCommon.Image {
this._ios = new UIImageView();
this._ios.contentMode = UIViewContentMode.UIViewContentModeScaleAspectFit;
this._ios.clipsToBounds = true;
- super._prepareNativeView(this._ios);
+ this._ios.userInteractionEnabled = true;
}
get ios(): UIImageView {
diff --git a/ui/label/label.ios.ts b/ui/label/label.ios.ts
index b65cd831b..42afd0f68 100644
--- a/ui/label/label.ios.ts
+++ b/ui/label/label.ios.ts
@@ -24,14 +24,49 @@ function onTextWrapPropertyChanged(data: dependencyObservable.PropertyChangeData
global.moduleMerge(common, exports);
+class UILabelImpl extends UILabel {
+ static new(): UILabelImpl {
+ return super.new();
+ }
+
+ private _owner: Label;
+
+ public initWithOwner(owner: Label): UILabelImpl {
+ this._owner = owner;
+ return this;
+ }
+
+ public textRectForBoundsLimitedToNumberOfLines(bounds: CGRect, numberOfLines: number): CGRect {
+ var rect = super.textRectForBoundsLimitedToNumberOfLines(bounds, numberOfLines);
+ var textRect = CGRectMake(
+ - (this._owner.borderWidth + this._owner.style.paddingLeft),
+ - (this._owner.borderWidth + this._owner.style.paddingTop),
+ rect.size.width + (this._owner.borderWidth + this._owner.style.paddingLeft + this._owner.style.paddingRight + this._owner.borderWidth),
+ rect.size.height + (this._owner.borderWidth + this._owner.style.paddingTop + this._owner.style.paddingBottom + this._owner.borderWidth)
+ );
+ return textRect;
+ }
+
+ public drawTextInRect(rect: CGRect): void {
+ var textRect = CGRectMake(
+ (this._owner.borderWidth + this._owner.style.paddingLeft),
+ (this._owner.borderWidth + this._owner.style.paddingTop),
+ rect.size.width - (this._owner.borderWidth + this._owner.style.paddingLeft + this._owner.style.paddingRight + this._owner.borderWidth),
+ rect.size.height - (this._owner.borderWidth + this._owner.style.paddingTop + this._owner.style.paddingBottom + this._owner.borderWidth)
+ );
+ super.drawTextInRect(textRect);
+ }
+}
+
export class Label extends common.Label {
private _ios: UILabel;
constructor(options?: definition.Options) {
super(options);
- this._ios = new UILabel();
- super._prepareNativeView(this._ios);
+ //this._ios = new UILabel();
+ this._ios = UILabelImpl.new().initWithOwner(this);
+ this._ios.userInteractionEnabled = true;
}
get ios(): UILabel {
diff --git a/ui/styling/style.ts b/ui/styling/style.ts
index dcaaef4b1..e38f910ae 100644
--- a/ui/styling/style.ts
+++ b/ui/styling/style.ts
@@ -847,8 +847,7 @@ export var marginTopProperty = new styleProperty.Property("marginTop", "margin-t
export var marginBottomProperty = new styleProperty.Property("marginBottom", "margin-bottom",
new observable.PropertyMetadata(0, AffectsLayout, onLayoutParamsChanged, isMarginValid), converters.numberConverter);
-export var paddingProperty = new styleProperty.Property("padding", "padding",
- new observable.PropertyMetadata(null, null, onPaddingChanged));
+export var paddingProperty = new styleProperty.Property("padding", "padding", new observable.PropertyMetadata(null, null, onPaddingChanged));
export var paddingLeftProperty = new styleProperty.Property("paddingLeft", "padding-left",
new observable.PropertyMetadata(0, AffectsLayout, onPaddingValueChanged, isPaddingValid), converters.numberConverter);
diff --git a/ui/styling/stylers.android.ts b/ui/styling/stylers.android.ts
index 6346f14c1..685e01360 100644
--- a/ui/styling/stylers.android.ts
+++ b/ui/styling/stylers.android.ts
@@ -34,9 +34,13 @@ function onBackgroundOrBorderPropertyChanged(v: view.View) {
nativeView.setBackground(bkg);
}
- var padding = v.borderWidth * utils.layout.getDisplayDensity();
-
- nativeView.setPadding(padding, padding, padding, padding);
+ var density = utils.layout.getDisplayDensity();
+ nativeView.setPadding(
+ (v.borderWidth + v.style.paddingLeft) * density,
+ (v.borderWidth + v.style.paddingTop) * density,
+ (v.borderWidth + v.style.paddingRight) * density,
+ (v.borderWidth + v.style.paddingBottom) * density
+ );
bkg.borderWidth = v.borderWidth;
bkg.cornerRadius = v.borderRadius;
@@ -202,6 +206,24 @@ export class DefaultStyler implements definition.stylers.Styler {
nativeView.setLayoutParams(lp);
}
+ private static setPaddingProperty(view: view.View, newValue: any) {
+ var density = utils.layout.getDisplayDensity();
+ var left = (newValue.left + view.borderWidth) * density;
+ var top = (newValue.top + view.borderWidth) * density;
+ var right = (newValue.right + view.borderWidth) * density;
+ var bottom = (newValue.bottom + view.borderWidth) * density;
+ (view._nativeView).setPadding(left, top, right, bottom);
+ }
+
+ private static resetPaddingProperty(view: view.View, nativeValue: any) {
+ var density = utils.layout.getDisplayDensity();
+ var left = view.borderWidth * density;
+ var top = view.borderWidth * density;
+ var right = view.borderWidth * density;
+ var bottom = view.borderWidth * density;
+ (view._nativeView).setPadding(left, top, right, bottom);
+ }
+
public static registerHandlers() {
style.registerHandler(style.visibilityProperty, new stylersCommon.StylePropertyChangedHandler(
DefaultStyler.setVisibilityProperty,
@@ -233,6 +255,18 @@ export class DefaultStyler implements definition.stylers.Styler {
style.registerHandler(style.nativeLayoutParamsProperty, new stylersCommon.StylePropertyChangedHandler(
DefaultStyler.setNativeLayoutParamsProperty,
DefaultStyler.resetNativeLayoutParamsProperty));
+
+ style.registerHandler(style.nativePaddingsProperty, new stylersCommon.StylePropertyChangedHandler(
+ DefaultStyler.setPaddingProperty,
+ DefaultStyler.resetPaddingProperty), "TextBase");
+
+ style.registerHandler(style.nativePaddingsProperty, new stylersCommon.StylePropertyChangedHandler(
+ DefaultStyler.setPaddingProperty,
+ DefaultStyler.resetPaddingProperty), "Button");
+
+ style.registerHandler(style.nativePaddingsProperty, new stylersCommon.StylePropertyChangedHandler(
+ DefaultStyler.setPaddingProperty,
+ DefaultStyler.resetPaddingProperty), "LayoutBase");
}
}
@@ -343,7 +377,6 @@ export class TextViewStyler implements definition.stylers.Styler {
TextViewStyler.setTextAlignmentProperty,
TextViewStyler.resetTextAlignmentProperty,
TextViewStyler.getNativeTextAlignmentValue), "Button");
-
}
}
@@ -475,28 +508,6 @@ export class SearchBarStyler implements definition.stylers.Styler {
}
}
-export class LayoutBaseStyler implements definition.stylers.Styler {
-
- //nativePadding methods
- private static setPaddingNativeProperty(view: view.View, newValue: style.Thickness): void {
- var left = (newValue.left * utils.layout.getDisplayDensity());
- var top = (newValue.top * utils.layout.getDisplayDensity());
- var right = (newValue.right * utils.layout.getDisplayDensity());
- var bottom = (newValue.bottom * utils.layout.getDisplayDensity());
- (view._nativeView).setPadding(left, top, right, bottom);
- }
-
- private static resetPaddingNativeProperty(view: view.View, nativeValue: any): void {
- (view._nativeView).setPadding(0, 0, 0, 0);
- }
-
- public static registerHandlers() {
- style.registerHandler(style.nativePaddingsProperty, new stylersCommon.StylePropertyChangedHandler(
- LayoutBaseStyler.setPaddingNativeProperty,
- LayoutBaseStyler.resetPaddingNativeProperty), "LayoutBase");
- }
-}
-
// Register all styler at the end.
export function _registerDefaultStylers() {
style.registerNoStylingClass("Frame");
@@ -505,5 +516,4 @@ export function _registerDefaultStylers() {
ActivityIndicatorStyler.registerHandlers();
SegmentedBarStyler.registerHandlers();
SearchBarStyler.registerHandlers();
- LayoutBaseStyler.registerHandlers();
}
diff --git a/ui/styling/stylers.ios.ts b/ui/styling/stylers.ios.ts
index e7c66fd26..1fd3a3aea 100644
--- a/ui/styling/stylers.ios.ts
+++ b/ui/styling/stylers.ios.ts
@@ -227,6 +227,19 @@ export class ButtonStyler implements definition.stylers.Styler {
}
}
+ // Padding
+ private static setPaddingProperty(view: view.View, newValue: any) {
+ var top = newValue.top + view.borderWidth;
+ var left = newValue.left + view.borderWidth;
+ var bottom = newValue.bottom + view.borderWidth;
+ var right = newValue.right + view.borderWidth;
+ (view._nativeView).contentEdgeInsets = UIEdgeInsetsFromString(`{${top},${left},${bottom},${right}}`);
+ }
+
+ private static resetPaddingProperty(view: view.View, nativeValue: any) {
+ (view._nativeView).contentEdgeInsets = UIEdgeInsetsFromString("{0,0,0,0}");
+ }
+
public static registerHandlers() {
style.registerHandler(style.colorProperty, new stylersCommon.StylePropertyChangedHandler(
ButtonStyler.setColorProperty,
@@ -242,6 +255,10 @@ export class ButtonStyler implements definition.stylers.Styler {
ButtonStyler.setTextAlignmentProperty,
ButtonStyler.resetTextAlignmentProperty,
ButtonStyler.getNativeTextAlignmentValue), "Button");
+
+ style.registerHandler(style.nativePaddingsProperty, new stylersCommon.StylePropertyChangedHandler(
+ ButtonStyler.setPaddingProperty,
+ ButtonStyler.resetPaddingProperty), "Button");
}
}
diff --git a/ui/text-field/text-field.ios.ts b/ui/text-field/text-field.ios.ts
index ecdcea5a4..77ecbfcc7 100644
--- a/ui/text-field/text-field.ios.ts
+++ b/ui/text-field/text-field.ios.ts
@@ -69,15 +69,48 @@ class UITextFieldDelegateImpl extends NSObject implements UITextFieldDelegate {
}
}
+class UITextFieldImpl extends UITextField {
+ static new(): UITextFieldImpl {
+ return super.new();
+ }
+
+ private _owner: TextField;
+
+ public initWithOwner(owner: TextField): UITextFieldImpl {
+ this._owner = owner;
+ return this;
+ }
+
+ private _getTextRectForBounds(bounds: CGRect): CGRect {
+ if (!this._owner) {
+ return bounds;
+ }
+
+ return CGRectMake(
+ this._owner.borderWidth + this._owner.style.paddingLeft,
+ this._owner.borderWidth + this._owner.style.paddingTop,
+ bounds.size.width - (this._owner.borderWidth + this._owner.style.paddingLeft + this._owner.style.paddingRight + this._owner.borderWidth),
+ bounds.size.height - (this._owner.borderWidth + this._owner.style.paddingTop + this._owner.style.paddingBottom + this._owner.borderWidth)
+ );
+ }
+
+ public textRectForBounds(bounds: CGRect): CGRect {
+ return this._getTextRectForBounds(bounds);
+ }
+
+ public editingRectForBounds(bounds: CGRect): CGRect {
+ return this._getTextRectForBounds(bounds);
+ }
+}
+
export class TextField extends common.TextField {
private _ios: UITextField;
- private _delegate: any;
+ private _delegate: UITextFieldDelegateImpl;
constructor() {
super();
- this._ios = new UITextField();
-
+ this._ios = UITextFieldImpl.new().initWithOwner(this);
this._delegate = UITextFieldDelegateImpl.new().initWithOwner(this);
}
diff --git a/ui/text-view/text-view.ios.ts b/ui/text-view/text-view.ios.ts
index 5639cd00e..1afc83ef1 100644
--- a/ui/text-view/text-view.ios.ts
+++ b/ui/text-view/text-view.ios.ts
@@ -42,17 +42,15 @@ class UITextViewDelegateImpl extends NSObject implements UITextViewDelegate {
export class TextView extends common.TextView {
private _ios: UITextView;
- private _delegate: any;
+ private _delegate: UITextViewDelegateImpl;
constructor() {
super();
- this._ios = UITextView.new();
+ this._ios = new UITextView();
if (!this._ios.font) {
- // For some reason font is null, not like stated in the docs.
this._ios.font = UIFont.systemFontOfSize(12);
}
-
this._delegate = UITextViewDelegateImpl.new().initWithOwner(this);
}