

Ask HN: expanding on MVC with frameworks for declarative UI description? - DenisM

Having written a bunch of UI code for iPhone I am now tempted to design my own framework to factor out reusable parts. However, before I begin I would like to tap into collective wisdom of this community - surely someone has done similar work before and if so I would be glad to learn rather than reinvent.<p>Here's how I see the structure of a single "page" in an application, expanding on MVC:<p>1. The Model - a software component and backing storage which provide access to the data. The important thing here is that Model itself must represent data how it's structured in the user's head, not how it's really stored in e.g. a relational database.<p>2. The Model Schema - a declarative description of types,  relationships, and arity of the data entities stored in the Model. Model Schema could be an XML file, for example.<p>3. Text (Copy), possibly localized. A simple key-value text file would likely suffice.<p>4. Layout description - list of UI controls and their design attributes (colors, fonts, margins, alignment, grouping/proximity etc). This also includes binding from controls to the Model Schema and to Copy. Layout description also can be a declarative description, such as an XML file.<p>To make this whole thing come alive I would need a layout engine that can take layout description, create UI controls, populate them with data according to bindings and place them on screen according to design attributes, taking content into account. The difficult part is handling arity.<p>If I can pull this off, I can see enormous benefit: a designer, a developer, and a copy writer could be iterating independently based on a single common document - the Model Schema - and seeing the complete animated result of their work as they make progress.<p>So what are the closest things to this that someone else has already done or tried to do?<p>Note that existing iPhone UIKit cannot do content-sensitive layout, all layout positioning is independent of content and so often looks poor with truncated text or large areas of whitespace - this deficiency and the countless hours spent aligning text on screen were the primary motivators behind my thinking.
======
draegtun
Might be worth looking at Reaction for ideas:
<http://search.cpan.org/dist/Reaction/>

In Reaction the model is split into "Domain Model" and "Interface Model". Also
the View is broken down into layoutsets, widgets & viewport components.

Here's some inks which may (or may not!) show some enlightenment on the
methodology behind Reaction:

* [http://search.cpan.org/dist/Reaction/lib/Reaction/Manual/Int...](http://search.cpan.org/dist/Reaction/lib/Reaction/Manual/Intro.pod)

* [http://search.cpan.org/dist/Reaction/lib/Reaction/Manual/Ove...](http://search.cpan.org/dist/Reaction/lib/Reaction/Manual/Overview.pod)

* <http://search.cpan.org/dist/Reaction/old/Manual/FAQ.pod>

------
micheljansen
Although not a direct answer to your question, I do think Qt's Kinetic
(<http://labs.trolltech.com/page/Projects/Graphics/Kinetic>) might be a good
source for inspiration. It contains a declarative UI markup and scripting
language called QML, that looks roughly like JS/JSON. An old example can be
seen here: [http://labs.trolltech.com/blogs/2009/05/13/qt-declarative-
ui...](http://labs.trolltech.com/blogs/2009/05/13/qt-declarative-ui/)

I am very curious about how Apple would react to something like this though.
It's obviously a good idea, but they have been really frantic about
alternative solutions to these kinds of problems :)

~~~
DenisM
Thanks for the links, guys, I will look into them.

I'm not worried about Apple for two reasons:

\- The layout engine I have prototyped (there is no binding, only layout
proper) operates on native iPhone controls, i.e. it does not create a new
abstraction layer on top of UIKit but rather extends it form the side with
smart sizing and positioning. I think it's very important to avoid creating
leaky abstractions and I plan to keep doing things this way. In other words
the layout description describes layout of native UIKit controls, not some
abstract presentation of data.

\- I'm no Adobe, and I'm not likely to attract attention to myself.

------
jhorman
You should read more about how to build an application on Android, at least in
terms of defining UI. I am tempted to try to create a UI framework that can
parse these same xml documents and create iPhone UI.

<http://developer.android.com/guide/topics/ui/index.html>

