[forms-devel] Scaling sizes (Fonts/Width/Height) of across devices

Fri Jun 17 14:07:59 UTC 2016

I look at the issue of platform-independent sizing in Chapter 5 of my book (
https://developer.xamarin.com/guides/xamarin-forms/creating-mobile-apps-xamarin-forms/)
and come to the conclusion that for all three phone platforms you can
generally assume an equivalence of 160 units to the inch, or 64 units to
the centimeter.

Using that equivalence actually works better for making consistent font
sizes than Device.GetNamedSize.

The screenshot shown earlier of an iPhone 6 and a Nexus 10 side-by-side is
somewhat deceptive because the iPhone 6 has a screen size of 4.7" diagonal,
and the Nexus 10 has a screen size of 10.1". If the two screens were shown
in their true relative sizes, I think the text would be about the same size.

On Fri, Jun 17, 2016 at 1:47 AM, Michael Ridland <rid00z at gmail.com> wrote:

>
> *To me a useful system would be a reliable way to get a scale-factor for
> manually mapping sizes in Xamarin-Forms to cm or inches, that way I could
> make sure the UI is readable/usable in all cases no matter the device. This
> could then be applied to all GUI elements, not just fonts.*
>
> This is what I'm looking for, eg making sure the UI is usable in all
> devices and it would need to work with Xaml. It seems like a missing
> piece that should be in the core framework.
>
> Thanks
>
> *Michael Ridland | Technical Director | Xamarin MVP*
>
> XAM Consulting - Mobile Technology Specialists
>
> www.xam-consulting.com
>
> Blog: www.michaelridland.com
>
>
>
> On Fri, Jun 17, 2016 at 3:32 PM, Christoffer Årstrand <
> christoffer.arstrand at yooba.com> wrote:
>
>> Hi,
>>
>> First I want to apologize if I am sending an email to a list which was
>> intended to be Xamarin internal. I mainly subscribed out of interest of
>> seeing what was worked on.
>>
>> ---
>>
>> I have been following this thread now and I think one first needs to
>> clearly define what exactly it is that one wants to achieve.
>>
>> In the given example you are comparing a 6” device with a 10” device but
>> what is the end goal here? Should the label font be scaled so they appear
>> the same height physically on all devices or the same height based on a
>> percentage of the screen size (or height I guess)?
>>
>> The former is what I would expect from such a system, but the latter is
>> what would make the GUI “look the same” across devices of different screen
>> sizes and resolutions, disregarding aspect ratios.
>>
>> Coming from iOS side I am already used to never talk about pixels but
>> instead points which the system then maps internally to screen pixels.
>> However, iOS is blessed with devices with roughly the same points (not
>> pixels!) per inch which makes it a lot easier.
>>
>> To me a useful system would be a reliable way to get a scale-factor for
>> manually mapping sizes in Xamarin-Forms to cm or inches, that way I could
>> make sure the UI is readable/usable in all cases no matter the device. This
>> could then be applied to all GUI elements, not just fonts.
>>
>> Cheers,
>>
>> Christoffer Årstrand
>> Development Lead
>>
>> Yooba Head Office +46 11 - 12 20 90
>> Visit: Västgötegatan 7, 602 21 Norrköping
>>
>> Yooba Stockholm +46 8 - 410 035 40
>> Visit: Engelbrektsgatan 7, 114 32 Stockholm
>> www.yooba.se | christoffer.arstrand at yooba.com
>> se.linkedin.com/in/arstrand
>>
>>
>> From: <forms-devel-bounces at lists.xamarin.com> on behalf of Michael
>> Ridland <rid00z at gmail.com>
>> Date: Friday 17 June 2016 at 06:29
>> To: Jason Smith <jason.smith at xamarin.com>
>> Cc: Forms devel <forms-devel at lists.xamarin.com>
>> Subject: Re: [forms-devel] Scaling sizes (Fonts/Width/Height) of across
>> devices
>>
>>
>> This is the same Forms code, on iPhone 6 and Nexus 10. I would expect if
>> I used a dynamic/scaled size they would match more evenly, just a idea, not
>> sure if it's bad or good.
>>
>> <StackLayout>
>>         <BoxView HeightRequest="20"  ></BoxView>
>>         <BoxView HeightRequest="20" BackgroundColor="Blue" ></BoxView>
>>         <Label FontSize="16" Text="Welcome to Xamarin Forms!"
>> VerticalOptions="Center" HorizontalOptions="Center" />
>> </StackLayout>
>>
>> [image: Inline image 1]
>>
>> Thanks
>>
>> *Michael Ridland | Technical Director | Xamarin MVP*
>>
>> XAM Consulting - Mobile Technology Specialists
>>
>> www.xam-consulting.com
>>
>> Blog: www.michaelridland.com
>>
>>
>>
>> On Fri, Jun 17, 2016 at 2:14 PM, Jason Smith <jason.smith at xamarin.com>
>> wrote:
>>
>>> So what would <Label DynamicFontSize="8" FontSize="20" /> produce?
>>>
>>> On Thu, Jun 16, 2016 at 8:40 PM, Michael Ridland <rid00z at gmail.com>
>>> wrote:
>>>
>>>>
>>>> I'm wondering if something like this would work, as a user I would like
>>>> to be able to set a width/height/font that dynamically changes to look the
>>>> same on all devices.
>>>>
>>>> <Label DynamicFontSize="8"  DynamicPadding="16"
>>>> DynamicHeightRequest="20"
>>>>
>>>> Does that make sense at all? There might be a better word than
>>>> dynamic.. scaled..
>>>>
>>>> Thanks
>>>>
>>>> *Michael Ridland | Technical Director | Xamarin MVP*
>>>>
>>>> XAM Consulting - Mobile Technology Specialists
>>>>
>>>> www.xam-consulting.com
>>>>
>>>> Blog: www.michaelridland.com
>>>>
>>>>
>>>>
>>>> On Thu, Jun 16, 2016 at 3:22 AM, Jason Smith <jason.smith at xamarin.com>
>>>> wrote:
>>>>
>>>>> As a side note, a better API would probably be
>>>>>
>>>>> double fontSize = Device.GetUnitFontSize (double size, MeasurementUnit
>>>>> unit); where MeasurementUnit is some enum that contains something like:
>>>>>
>>>>> ScaledPixels,
>>>>> ScreenPixels,
>>>>> Point
>>>>>
>>>>> On Wed, Jun 15, 2016 at 10:20 AM, Jason Smith <jason.smith at xamarin.com
>>>>> > wrote:
>>>>>
>>>>>> The best idea we have come up with is as follows:
>>>>>>
>>>>>> double fontSize = Device.GetPixelFontSize (double pixelSize);
>>>>>>
>>>>>> However this has some implementation issues around the fact that
>>>>>> point size doesn't always perfectly map to pixel size due to a bunch of
>>>>>> tiny factors. So a good solution would be do change FontSize from a double
>>>>>> to a FontSize struct which could be a double + unit combination, however
>>>>>> this would represent a breaking change we cannot take, so the above is the
>>>>>> best we got which appears to be quite misleading in some edge cases. This
>>>>>> is the reason we haven't done it so far.
>>>>>>
>>>>>> On Tue, Jun 14, 2016 at 6:25 PM, Michael Ridland <rid00z at gmail.com>
>>>>>> wrote:
>>>>>>
>>>>>>> Hi
>>>>>>>
>>>>>>> One limitation of Forms that I come up with in all projects is the
>>>>>>> limited ability to set sizes which scale based on platform density etc.
>>>>>>> I've been pondering some solutions I can put onto nuget, but that's the old
>>>>>>> way now Forms is open source.
>>>>>>>
>>>>>>> What idea's does the Forms team have for this and would you like any
>>>>>>> help to build this into core?
>>>>>>>
>>>>>>> Thanks
>>>>>>>
>>>>>>> *Michael Ridland | Technical Director | Xamarin MVP*
>>>>>>>
>>>>>>> XAM Consulting - Mobile Technology Specialists
>>>>>>>
>>>>>>> www.xam-consulting.com
>>>>>>>
>>>>>>> Blog: www.michaelridland.com
>>>>>>>
>>>>>>>
>>>>>>>
>>>>>>> _______________________________________________
>>>>>>> forms-devel mailing list
>>>>>>> forms-devel at lists.xamarin.com
>>>>>>> http://lists.ximian.com/mailman/listinfo/forms-devel
>>>>>>>
>>>>>>>
>>>>>>
>>>>>
>>>>
>>>
>> _______________________________________________ forms-devel mailing list
>> forms-devel at lists.xamarin.com
>> http://lists.ximian.com/mailman/listinfo/forms-devel
>>
>> _______________________________________________
>> forms-devel mailing list
>> forms-devel at lists.xamarin.com
>> http://lists.ximian.com/mailman/listinfo/forms-devel
>>
>>
>
> _______________________________________________
> forms-devel mailing list
> forms-devel at lists.xamarin.com
> http://lists.ximian.com/mailman/listinfo/forms-devel
>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.ximian.com/pipermail/forms-devel/attachments/20160617/29ec2e93/attachment-0001.html>
-------------- next part --------------
A non-text attachment was scrubbed...
Name: Screen Shot 2016-06-17 at 2.22.29 PM.png
Type: image/png
Size: 40767 bytes
Desc: not available
URL: <http://lists.ximian.com/pipermail/forms-devel/attachments/20160617/29ec2e93/attachment-0001.png>