[TIMOB-26805] Implement Margin property for all Views
| GitHub Issue | n/a |
|---|---|
| Type | New Feature |
| Priority | None |
| Status | Open |
| Resolution | Unresolved |
| Affected Version/s | n/a |
| Fix Version/s | n/a |
| Components | TiAPI |
| Labels | margin, padding |
| Reporter | Brenton House |
| Assignee | Unknown |
| Created | 2019-02-06T20:02:47.000+0000 |
| Updated | 2019-03-05T04:05:57.000+0000 |
Description
Add
Margin property to Ti.UI.View.
Now that I think about it, we already do support margins. If you set a view's "width" property, then its "left" and "right" properties will act as margins. If you set a view's "height" property, then its "top" and "bottom" properties will act as margins. For example, the below will set up an auto-sized label with a margin of "5dp" around it. Note that it's important that you set the width and height to
Ti.UI.SIZEor else the top/bottom/left/right properties will be used to size the view instead via our pinning feature.var label = Ti.UI.createLabel({ text: "My Margin Test", width: Ti.UI.SIZE, height: Ti.UI.SIZE, top: "5dp", bottom: "5dp", left: "5dp", right: "5dp", });The problem is that setting the size to Ti.UI.SIZE isn't always possible. For example, if you are trying to create a gridview w/ tiles . You might want each one to be a certain width/height. I've been able to work around it w/ embedded views but I usually have one embedded view for margin and and second embedded view for padding.
It'll work for your case too. As long as you set the "width" and "height" properties to a value of some kind, then the top/bottom/left/right properties will act as margins. This works on all platforms (Android, iOS, and Windows).
cool! let me try it out. Maybe we can add a helper property called margin that sets the top,bottom,left, and right.