ubuntu-phone team mailing list archive

[Bruno Girin <brunogirin@xxxxxxxxx>]

Calum,

I completely agree that we should use responsive layout techniques.
Having done that in Qt before (on my old N900), here are the sort of
things I would be looking for in order to be able to implement this
properly.

Expose what is in the QScreen class, in particular:
- availableSize (converted to grid units) both for full screen and
side-stage
- isLandscape / isPortrait / orientation
- orientationChanged signal

Provide containers that can have their layout orientation changed at
runtime. Qt's QBoxLayout can do that using its setDirection method but
the only layout components that I know of in QML are Column, Row and
Grid that are presumably implemented using QVBoxLayout, QHBoxLayout and
QGridLayout, all of which have a fixed orientation.

Cheers,

Bruno

On 25/02/13 10:45, Calum K Pringle wrote:
>
> Hey guys,
>
> We are working on getting some guidance for this up on the app design
> guides <http://design.ubuntu.com/apps> site soon as it's clearly a big
> piece in the process for designing our apps! Essentially, consider
> your app a touch app, which can scale (the 'how' depends on the
> context), to different screen sizes.
>
> As an introduction, your app needs to handle all aspect ratios for
> handling different devices and orientations (and remember a phone app
> automatically fits in the side stage, with a flexible height either
> 'fixed' with space below, or stretched to the full height available). 
>
> So there are two main things to think about for an app to scale across
> screen sizes and shapes;
>
> *Design a responsive layout*
>
>   * Position UI components relatively
>   * Reflow content based on space available, for example increase /
>     decrease the number of rows and columns of content
>
> *Design for responsive content*
> Consider showing more or less content, for example
>
>  1. An app in the side stage with a list of content will show more
>     content than when it is on the phone
>  2. An app on the tablet might show more information than on the phone
>  3. An app where the content is larger than what fits in view, might
>     consider showing more or less content depending on shape and
>     orientation (e.g. a map)
>
> Or, show the same content, for example
>
>  1. An app on the phone simply scales up on the tablet
>  2. A fixed height app on the phone, will maintain a fixed height in
>     the side stage
>
>
> For handling screen sizes and densities, also for asset creation,
> please refer to resolution independence
> <http://developer.ubuntu.com/api/ubuntu-12.10/qml/mobile/resolution-independence.html>.
> We are working on this right now, so let us know any other ideas /
> problems you're coming across!
>
> Cheers,
> Calum
>
>
> On 24 Feb 2013, at 12:09, Matt Richardson wrote:
>
>>
>> On 24/02/13 11:51, Dalius wrote:
>>> Hi,
>>>
>>> I would advice to preview Ubuntu Phone presentations video. The idea
>>> is that apps not necessary should be full screen on tablet. While I
>>> would agree that some apps (e.g. calendar, mail) should reuse full
>>> estate, while others can be the same on phone and tablet.
>>>
>>
>> I absolutely agree. For example (in a matter close to your heart), on
>> anything larger than a phone, the calculator should never be used
>> fullscreen. However, for apps such as email, the full screen real
>> estate should be used by default, certainly on up to 10" screens and
>> potentially even larger.
>>
>> The question is that for such apps, shouldn't we try to reuse the
>> same backend (as Petko suggested) and load different UI's? This would
>> enable switching between phones/tablets/desktop via a "pick up where
>> you left off" system or by docking (as demonstrated in the preview
>> video).
>>
>> The other question is that if we have a design for such apps, should
>> we submit it as separate phone and tablet designs, or as a single
>> design indicating how to switch between.
>>
>> Thanks,
>> Matt
>>
>>> Regards,
>>> Dalius
>>>
>>>
>>> On Sun, Feb 24, 2013 at 1:45 PM, Petko <pditchev@xxxxxxxxx
>>> <mailto:pditchev@xxxxxxxxx>> wrote:
>>>
>>>     I'm also very curious on that matter . Are there some specs on
>>>     how to change app behaviour or is the current style just to
>>>     rewrite the apps for a phone/tablet/desktop factor . The latter
>>>     seems suboptimal . It would be great to have 3 GUIs for the same
>>>     app backend (you download the same app, but it loads differently
>>>     under different form factors) , but as far as I know everyone's
>>>     pushing QML for writing the full apps , so there's no
>>>     abstraction between GUI<->engine .
>>>
>>>     Petko
>>>
>>>
>>>     -- 
>>>     Mailing list: https://launchpad.net/~ubuntu-phone
>>>     <https://launchpad.net/%7Eubuntu-phone>
>>>     Post to     : ubuntu-phone@xxxxxxxxxxxxxxxxxxx
>>>     <mailto:ubuntu-phone@xxxxxxxxxxxxxxxxxxx>
>>>     Unsubscribe : https://launchpad.net/~ubuntu-phone
>>>     <https://launchpad.net/%7Eubuntu-phone>
>>>     More help   : https://help.launchpad.net/ListHelp
>>>
>>>
>>>
>>>
>>
>> -- 
>> Mailing list: https://launchpad.net/~ubuntu-phone
>> <https://launchpad.net/%7Eubuntu-phone>
>> Post to     : ubuntu-phone@xxxxxxxxxxxxxxxxxxx
>> <mailto:ubuntu-phone@xxxxxxxxxxxxxxxxxxx>
>> Unsubscribe : https://launchpad.net/~ubuntu-phone
>> <https://launchpad.net/%7Eubuntu-phone>
>> More help   : https://help.launchpad.net/ListHelp
>
>
>