Reputation: 4332
1) in Android (Java) :
There are different folders for Phone and Tablet
Layout
Layout-large
layout-xlarge
2) in iOS : use Universal setting.
I have not tried In Xamarin forms. I need some help.
What are the things I need to do if the app is for Phone and tablet ? and there are so many screenSizes.
How to design the Page for multiple screen sizes?
If I start from Tablet size, the page display in phone may be not fit?
Upvotes: 3
Views: 2751
Reputation: 3276
Xamarin.Forms uses something called 'AutoLayout' which means it uses a system of constraints in order to adjust the content for any screen size, which is why when your designing your app you should always test it on multiple devices.
Xamarin.Forms uses xaml as it's base markup language for renderng displays, and converts this into the native counterparts at runtime. for iOS it translates to their unified api which uses autolayout to resize views for different screen sizes. Information on xamarin's xaml quirks can be found here.
The long and short of it is that using Xamarin.Forms you don't have to worry too much about screen sizes, it will adjust the views based on your layout and constraints. So theres one interface designer per page, no need for multiple storyboards (iOS) or the android alternatives.
That being said you can still micro manage your visuals, setting dynamic font sizes, dynamically sized controls based on ratios, or specific sizes that you have in mind. I would honestly start with one of the Xamarin.Forms sample applications to see them at work on different devices.
We use Xamarin.Forms for one of our cross-platform applications and without any real adjustment to the underlying components we use in the Forms xaml, I can say with certainty that it currently supports and works on all android tablets, all apple devices (apart from their Mac family), all windows devices (Phones, tablets, and desktop pc's). So I don't think you should worry too much.
Some useful links:
Layout for Tablet and Desktop apps. - Heres some more detailed information on Xamarin.Forms.
Master Detail Pages - Ideal for focusing on just large screen devices
Cross-platform Image optimisation - You mentioned this, about different folders for android etc, that is still the case.
Xamarin.Forms Adaptive UI explained - Blog article about how adaptive UI in Xamarin.Forms actually works.
Upvotes: 3