Skip to content

Commit

Permalink
[TIMOB-7799] Removed flex box from switch and fixed some bugs.
Browse files Browse the repository at this point in the history
  • Loading branch information
@nebrius
nebrius committed Mar 29, 2012
1 parent 7bb4184 commit d9748eb
Show file tree
Hide file tree
Showing 4 changed files with 54 additions and 56 deletions.
1 change: 1 addition & 0 deletions mobileweb/titanium/Ti/UI.js
View file
Expand Up @@ -194,6 +194,7 @@ define(
break;
}
}
parent._markedForLayout = true;

previousParent = parent;
parent = parent._parent;
Expand Down
2 changes: 1 addition & 1 deletion mobileweb/titanium/Ti/UI/Button.js
View file
Expand Up @@ -75,7 +75,7 @@ define(["Ti/_/declare", "Ti/_/UI/FontWidget", "Ti/_/dom", "Ti/_/css", "Ti/_/styl
this.borderColor = this._previousBorderColor;
css.remove(this.domNode, "TiUIElementGradient");
css.remove(this.domNode, "TiUIButtonDefault");
this._contentContainer.borderHeight = 0;
this._contentContainer.borderWidth = 0;
}
},

Expand Down
88 changes: 39 additions & 49 deletions mobileweb/titanium/Ti/UI/Switch.js
View file
Expand Up @@ -11,7 +11,7 @@ define(["Ti/_/declare", "Ti/_/UI/FontWidget", "Ti/_/dom", "Ti/_/css", "Ti/_/styl

constructor: function(args) {

// This container holds the flex boxes used to position the elements
/*// This container holds the flex boxes used to position the elements
this._contentContainer = dom.create("div", {
className: "TiUISwitchContentContainer",
style: {
Expand Down Expand Up @@ -65,7 +65,32 @@ define(["Ti/_/declare", "Ti/_/UI/FontWidget", "Ti/_/dom", "Ti/_/css", "Ti/_/styl
width: "40px"
}
}, this._indicatorContainer);
this._switchIndicator.domNode += " TiUISwitchIndicator";
this._switchIndicator.domNode += " TiUISwitchIndicator";*/

var contentContainer = this._contentContainer = UI.createView({
width: UI.INHERIT,
height: UI.INHERIT,
layout: "vertical",
borderColor: "transparent"
});
contentContainer._forceInheritenceToFillOrSize = true;
this._add(contentContainer);

contentContainer._add(this._switchTitle = UI.createLabel({
width: UI.INHERIT,
height: UI.INHERIT,
verticalAlign: UI.TEXT_VERTICAL_ALIGNMENT_CENTER,
textAlign: UI.TEXT_ALIGNMENT_CENTER
}));
this._switchTitle._forceInheritenceToFillOrSize = true;

contentContainer._add(this._switchIndicator = UI.createView({
width: 40,
height: 10,
borderRadius: 4,
borderWidth: 1,
borderColor: "#888"
}));

// Set the default look
this._setDefaultLook();
Expand All @@ -90,43 +115,25 @@ define(["Ti/_/declare", "Ti/_/UI/FontWidget", "Ti/_/dom", "Ti/_/css", "Ti/_/styl
_setDefaultLook: function() {
if (!this._hasDefaultLook) {
this._hasDefaultLook = true;
css.add(this.domNode, "TiUIElementGradient");
this._previousBorderWidth = this.borderWidth;
this._previousBorderColor = this.borderColor;
this.borderWidth = 1;
this.borderColor = "#666";
setStyle(this.domNode, {
borderRadius: "6px",
padding: "6px 6px"
});
css.add(this.domNode, "TiUIElementGradient");
css.add(this.domNode, "TiUIButtonDefault");
this._contentContainer.borderWidth = 6;
}
},

_clearDefaultLook: function() {
if (this._hasDefaultLook) {
this._hasDefaultLook = false;
var className = this.domNode.className;
css.remove(this.domNode, "TiUIElementGradient");
this.borderWidth = this._previousBorderWidth;
this.borderColor = this._previousBorderColor;
setStyle(this.domNode, {
borderRadius: "",
padding: ""
});
css.remove(this.domNode, "TiUIElementGradient");
css.remove(this.domNode, "TiUIButtonDefault");
this._contentContainer.borderWidth = 0;
}
},

_getContentSize: function(width, height) {
var defaultLookOffset = (this._hasDefaultLook ? 12 : 0);
return {
width: Math.max(this._measureText(this._switchTitle.innerHTML, this._switchTitle).width, this._switchIndicator.offsetWidth) + defaultLookOffset,
height: this._measureText(this._switchTitle.innerHTML, this._switchTitle).height + // Text height
this._switchIndicator.offsetHeight + // Indicator height
3 + // Padding between the indicator and text
defaultLookOffset // Border of the default style
};
},

_defaultWidth: UI.SIZE,

_defaultHeight: UI.SIZE,
Expand Down Expand Up @@ -172,22 +179,15 @@ define(["Ti/_/declare", "Ti/_/UI/FontWidget", "Ti/_/dom", "Ti/_/css", "Ti/_/styl

textAlign: {
set: function(value) {
var cssValue = "";
switch(value) {
case UI.TEXT_VERTICAL_ALIGNMENT_TOP: cssValue = "start"; break;
case UI.TEXT_VERTICAL_ALIGNMENT_CENTER: cssValue = "center"; break;
case UI.TEXT_VERTICAL_ALIGNMENT_BOTTOM: cssValue = "end"; break;
}
setStyle(this._titleContainer, "boxAlign", cssValue);
this._switchTitle.textAlign = value;
return value;
}
},

titleOff: {
set: function(value) {
if (!this.value) {
this._switchTitle.innerHTML = value;
this._hasSizeDimensions() && this._triggerLayout();
this._switchTitle.text = value;
}
return value;
},
Expand All @@ -197,8 +197,7 @@ define(["Ti/_/declare", "Ti/_/UI/FontWidget", "Ti/_/dom", "Ti/_/css", "Ti/_/styl
titleOn: {
set: function(value) {
if (this.value) {
this._switchTitle.innerHTML = value;
this._hasSizeDimensions() && this._triggerLayout();
this._switchTitle.text = value;
}
return value;
},
Expand All @@ -207,12 +206,9 @@ define(["Ti/_/declare", "Ti/_/UI/FontWidget", "Ti/_/dom", "Ti/_/css", "Ti/_/styl

value: {
set: function(value) {
setStyle(this._switchIndicator,{
backgroundColor: value ? "#0f0" : "#aaa"
});
this._switchIndicator.backgroundColor = value ? "#0f0" : "#aaa";
value = !!value;
this._switchTitle.innerHTML = value ? this.titleOn : this.titleOff;
this._hasSizeDimensions() && this._triggerLayout();
this._switchTitle.text = value ? this.titleOn : this.titleOff;
return value;
},
post: function() {
Expand All @@ -224,13 +220,7 @@ define(["Ti/_/declare", "Ti/_/UI/FontWidget", "Ti/_/dom", "Ti/_/css", "Ti/_/styl

verticalAlign: {
set: function(value) {
var cssValue = "";
switch(value) {
case UI.TEXT_VERTICAL_ALIGNMENT_TOP: cssValue = "start"; break;
case UI.TEXT_VERTICAL_ALIGNMENT_CENTER: cssValue = "center"; break;
case UI.TEXT_VERTICAL_ALIGNMENT_BOTTOM: cssValue = "end"; break;
}
setStyle(this._titleContainer, "boxPack", cssValue);
this._switchTitle.verticalAlign = value;
},
value: UI.TEXT_VERTICAL_ALIGNMENT_CENTER
}
Expand Down
19 changes: 13 additions & 6 deletions mobileweb/titanium/Ti/_/UI/Element.js
View file
Expand Up @@ -219,7 +219,8 @@ define(
parentWidth;
if (parent) {
parentWidth = lang.val(parent.width,parent._defaultWidth);
return parentWidth === UI.INHERIT ? parent._getInheritedWidth() : parentWidth;
parentWidth = parentWidth === UI.INHERIT ? parent._getInheritedWidth() : parentWidth
return this._forceInheritenceToFillOrSize ? parentWidth === UI.SIZE ? UI.SIZE : UI.FILL : parentWidth;
}
},

Expand All @@ -228,15 +229,21 @@ define(
parentHeight;
if (parent) {
parentHeight = lang.val(parent.height,parent._defaultHeight);
return parentHeight === UI.INHERIT ? parent._getInheritedHeight() : parentHeight;
parentHeight = parentHeight === UI.INHERIT ? parent._getInheritedHeight() : parentHeight
return this._forceInheritenceToFillOrSize ? parentHeight === UI.SIZE ? UI.SIZE : UI.FILL : parentHeight;
}
},

_hasSizeDimensions: function() {
var width = this._getInheritedWidth(),
height = this._getInheritedHeight()
return (this._width === UI.SIZE || width === UI.SIZE) ||
(this._height === UI.SIZE || height === UI.SIZE);
var widthOverride = isDef(this.left) + isDef(this.right) + isDef(this.center && this.center.x) > 1,
heightOverride = isDef(this.top) + isDef(this.bottom) + isDef(this.center && this.center.y) > 1,
isWidthSize,
isHeightSize,
width = lang.val(this.width,this._defaultWidth),
height = lang.val(this.height,this._defaultHeight);
(isDef(this.width) || !widthOverride) && (isWidthSize = (width === UI.INHERIT ? this._getInheritedWidth() : width) === UI.SIZE);
(isDef(this.width) || !heightOverride) && (isHeightSize = (width === UI.INHERIT ? this._getInheritedWidth() : width) === UI.SIZE);
return isWidthSize || isHeightSize;
},

_hasFillWidth: function() {
Expand Down

0 comments on commit d9748eb

Please sign in to comment.