5

Rather surprised that I haven't been able to found detailed information about Android's box model. I mean how padding, margins, gravities, etc. they all interact together.

Other than this note about margin and padding in the dev site and this SO question there's not much information out there.

What I'm looking for:

  • What are the defaults for margins, paddings, gravities, etc.
  • Can manufacturers alter those defaults. If so, is it a good practice ignoring those defaults so your app looks consistent across different manufacturers?
  • How are conflicts resolved, specially between a component and its children.
  • Any difference between Android versions?

Is it really that simple that is not worth a deeper explanation in the docs?

Thanks,

Juan

Community
  • 1
  • 1
Juan Delgado
  • 2,030
  • 15
  • 18

2 Answers2

5

Rather surprised that I haven't been able to found detailed information about Android's box model.

Note that little in your question has anything to do with LinearLayout, the Android equivalent of the "box model" found in XUL or Flex. Perhaps you have a different definition of "box model" than I use.

What are the defaults for margins, paddings, gravities, etc.

0 pixels for the default margin and padding. Default gravity varies by widget/container.

Can manufacturers alter those defaults.

Technically, yes, though I am not aware of this being done in practice.

How are conflicts resolved, specially between a component and its children.

There are no possible conflicts in margin, padding, or gravity.

Any difference between Android versions?

Not that I am aware of.

Is it really that simple that is not worth a deeper explanation in the docs?

IMHO, yes.

CommonsWare
  • 986,068
  • 189
  • 2,389
  • 2,491
  • With conflicts I mean things like defining a padding for the same element in styles.xml, in line and in a 9.patch asset. Granted, that's not something you want to do on purpose, but it CAN happen and drive you mad, right? Maybe I should've said precedence instead of conflict? – Juan Delgado Jun 27 '11 at 16:41
  • AFAIK precedence is as follows, in decending priority order. **1)** Any attribute values in the given `AttributeSet` _(these are generally individual attrs specified in the layout file)_ **2)** The `style` resource specified in the AttributeSet _(named "style" in layout file)_ **3)** The default styles specified by defStyleAttr _(attribute in the current theme that points to a style)_ and `defStyleRes` _(a actual style reference specifies in the overloaded constructor)_ ... – Dori Oct 03 '12 at 08:01
  • ...and finally **4)** The base values in the current contexts `theme`. These are grabbed from the context used when calling `Context.obtainStyledResults(...)` – Dori Oct 03 '12 at 08:02
  • In regards to 9-patches. Explicitly setting a padding on a view with a background 9 patch with a content area that is smaller than the source image (i.e. has a padding explicitly defined by the 9-patch) **will override** the 9-patch padding - usually to ill-effect! – Dori Oct 03 '12 at 08:04
0

If you compare Android's box model to CSS's box model, I find Android's indeed easier to grasp, and of much lower complexity. You don't have those shenanigans like the padding getting added up to the element's width. IMHO, positioning logic (CSS: float/absolute/relative etc.) is very well and elegantly encapsulated in Android's layout components. While some things are hard to do in Android (like having a toolbar at the view's bottom and filling the rest with a list - but this also involves evil hackery in CSS), it's much more predictable than CSS.

I would suggest that you read up on all layout components, as the box model is straightforward (margin, padding, width, height), and most of positioning and alignment is layout-component-specific (e.g., "gravity" in LinearLayout, "layout_above/below/toLeftOf/toRightOf" in RelativeLayout,...).

BUT: I agree that a complete guide (+ good examples and analogies) on that topic would help novices to come to terms with Android layouts much quicker, since some in-depth info is only available as case-based code snippets (speaking only of the web, books surely do a better job).

As a side-note on the box-model: One "peculiarity" I have stumbled upon is that 9-patch-drawables which are set as a background to an element affect the element's padding. If the box-padding of the 9-patch is not 0, the element's padding is set accordingly, if not overridden. This really bit me in the butt once.

manmal
  • 3,900
  • 2
  • 30
  • 42