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

Mon Jun 20 00:20:52 UTC 2016

Hi Charles

Thanks for a great book. I understand that the text would be about the same
size which works in many cases but what if I wanted to have the views look
the same proportionally, so the Nexus 10 would have a larger text size and
a thicker blue bar? I wouldn't want to remove or change the current sizing
system but have a option to cherry pick proportional sizes when we need
them.

Thanks

*Michael Ridland | Technical Director | Xamarin MVP*

XAM Consulting - Mobile Technology Specialists

www.xam-consulting.com

Blog: www.michaelridland.com

On Sat, Jun 18, 2016 at 12:07 AM, Charles Petzold <
charles.petzold at xamarin.com> wrote:

> 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/20160620/5e598981/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/20160620/5e598981/attachment-0001.png>