Hi Cos, have a look at this :) https://developer.ubuntu.com/api/apps/qml/sdk-15.04/Ubuntu.Layouts.ConditionalLayout/
On Mon, Jul 27, 2015 at 6:51 PM, Cos64 <co...@staticdot.com> wrote: > On 18.06.2015 10:52, Sebastien Bacher wrote: > > Hey there, > > > > (I hope some of the designers are on this list ;-) > > > > I've been reading the design blog entries about the grid system [1] [2] > > and I'm trying to make sense of what is described. > > > > The guidelines say that a panel should be 40/50/90 gus. What happens if > > I'm using an application in "window mode" on a desktop and that its > > width is 70gu, does it mean I should have 2 panels having respective > > widths of 50gu and then 20gu? > > > > That feels weird, if you take an example of an application listing > > messages on the left and content on the right you get less space for the > > content than for the titles. > > > > You can imagine a similar example on a tablet in landscape mode. Taking > > the blog example of a landscape of 90gu, the layout should be 40/50, but > > what if my left panel is a list of short labels and I would only need > > 20gu to display them, does it mean I should use 40 anyway and waste the > > space on the right of the layout for the actual content? > > > > > > Did I understand the guideline correct or am I overlooking something > there? > > > > Cheers, > > Sebastien Bacher > > > > > > [1] > > > http://design.canonical.com/2015/05/to-converge-onto-mobile-tablet-and-desktop-think-grid-units/ > > [2] http://design.canonical.com/2015/06/the-grid-system-in-detail/ > > > > > > > > > > Hi, > > Could someone help me understand some things about this grid system? > > I read the Resolution Independence article [1] and understood that a > grid unit is a fixed number of pixels, depending on the device. > Then I found this thread mentioning the two blog articles [2] [3]. One > of them says that for Aquaris E4.5 it's recommended to use a width of 40 > units, while for Meizu MX4 50 units are preferred. > The tutorial [4] uses 100 (but I understand it's for desktop and only an > example). > The Ubuntu UI Toolkit [5] uses a width of 120. > > My question is: how can I make sure my UI looks good on any device? If I > use 50 units, it won't fit on Aquaris E4.5. If I use 40, there will be > wasted space on tablets. Is it possible to make 3 layouts for the same > view (one for 40, one for 50 and one for 90)? Maybe something similar to > Android [6]? > > I tried to > > import QtQuick.Window 2.2 > > and to declare > > width: Math.min(Screen.width, units.gu(50)) > > but I doubt that's the way to go (I also ran into some trouble with the > screen size not being immediately available). > > Ciao, > Cos > > [1]: > > https://developer.ubuntu.com/api/qml/current/UbuntuUserInterfaceToolkit.resolution-independence/ > [2]: > > http://design.canonical.com/2015/05/to-converge-onto-mobile-tablet-and-desktop-think-grid-units/ > [3]: http://design.canonical.com/2015/06/the-grid-system-in-detail/ > [4]: > > https://developer.ubuntu.com/en/apps/qml/tutorials/building-your-first-qml-app/ > [5]: > > http://bazaar.launchpad.net/~ubuntu-sdk-team/ubuntu-ui-toolkit/trunk/view/head:/examples/ubuntu-ui-toolkit-gallery/ubuntu-ui-toolkit-gallery.qml > [6]: https://developer.android.com/guide/practices/screens_support.html > > > -- > Mailing list: https://launchpad.net/~ubuntu-phone > Post to : ubuntu-phone@lists.launchpad.net > Unsubscribe : https://launchpad.net/~ubuntu-phone > More help : https://help.launchpad.net/ListHelp >
-- Mailing list: https://launchpad.net/~ubuntu-phone Post to : ubuntu-phone@lists.launchpad.net Unsubscribe : https://launchpad.net/~ubuntu-phone More help : https://help.launchpad.net/ListHelp
