How to give multi-device support in Xamarin Forms - xamarin

I am newbie to Xamarin development.
In android we have different values folder for multi-device support.
But In Xamarin forms how we give multi-device support for Android & iOS?
Anyone don't know about what is multi-device support pls check the sample document by Android
https://developer.android.com/guide/practices/screens_support.html
I want similar like this for Xamarin forms.
Note: I am asking about Xamarin forms not in native code.
Any suggestions or ideas are welcome. Thanks for your answers.

How to give multi-device support in Xamarin Forms
Xamarin.Forms XAML Support :
Xamarin.Forms use the platform-specific mechanisms to calculate the absolute pixel dimensions. As Digitalsa1nt said, Xamarin.Forms uses xaml as it's base markup language for renderng displays, and converts this into the native counterparts at runtime. Usually, you don't have to care about the resolution, it will adjust the views based on your layout and constraints.
Some useful link about Xamarin.Forms multi-device support :
Bringing Xamarin.Forms Apps to Tablets
Provides a few nice helper methods to extend the app for a better tablet experience
Device Class
The Device class contains a number of properties and methods to help developers customize layout and functionality on a per-platform basis.
Layout for Tablet and Desktop apps
Discuss about the supported device types, and how to optimize layouts for tablets versus phones.
Cross-platform Image optimisation
Images can be shared across platforms with Xamarin.Forms, they can be loaded specifically for each platform, or they can be downloaded for display.
Master Detail Pages
Ideal for focusing on just large screen devices
Update :
You could read this official document: Dealing with sizes and the related sample. It demonstrates many solutions to solve your problem :
Platform-specific font size
Metrical sizes
Estimated font sizes
Fitting text to available size
Empirically fitting text
A fit-to-size clock
Accessibility issues
For example : the Platform-specific font size at no cost
In some cases we need to assign a different font size to controls based on the specific operating system's styles, avoiding hard-coded values. Through the Device class, Xamarin.Forms makes this possible at no cost.
In your Page OnAppearing() method :
protected override void OnAppearing()
{
base.OnAppearing();
this.LargeLabel.FontSize = Device.GetNamedSize(NamedSize.Large, typeof(Label));
this.SmallLabel.FontSize = Device.GetNamedSize(NamedSize.Small, typeof(Label));
this.MediumLabel.FontSize = Device.GetNamedSize(NamedSize.Medium, typeof(Label));
}
Effect :

Related

How to create same UI as given UX in xamarin forms?

I am working in xamarin forms. I have some UX given by the designer. Now I want to create exactly same UI(same height of control, width of control, colors etc) in xamarin forms. My xaml view should be exactly xame like given UX.
Is there any tool that can guide me to create same UI like UX. I mean through that tool I can get the height, widths and colors of controls of screens and then can use it.
it's not good idea to use exact length of UI since the app will run on different screen and different devices. Xamarin forms uses native views for each platform which will also change the look of basic views.
What you need to do is to use grids or other layouts for sizing and control the height and the width of your views.
I also suggested that you always use scroll view incase if a mobile has a small screen size.
Finally, regarding the actual UI components and UX interactions, there are many ready components like calendars, custom checkboxes, sliders,... . If you can't find a component that cover what you need, you have 2 options:
combine different components and try to customize them with absolute
and Relative layouts.
Create the components yourself which will require some knowledge
on each platform to create the view component by drawing it and do
all the handling for each platform.
Regarding the UX, there are many libraries for animations and most components allow customizability.
Your question was very general so this answer is general. Please try to be more specific next time.

Bind/set short text data from Android MainActivity.cs to a shared Xamarin Forms Label?

Is there a way to define a Label in Xamarin Forms (XAML or code-behind) AppXYZ that can be updated from the Xamarin Android AppXYZ.Android: MainActivity.cs and AppXYZ.iOS:Main.cs? i.e. upon an event in Android (e.g. BlueTooth) set a short text in a common Forms elements? After viewing many example, no clarity yet. MessageCenter perhaps?
In Android Project: MainActivity.cs (for example):
FormsAppXYZ.LabelXYZ.Text = "Updated string";
If not possible, then proper way to do this with Xamarin Android Native ? appreciated since I'll have to mix in the label into a shared Xamarin Forms Tabbed GUI.
Depending on how much Bluetooth work you need to do, my first suggestion would be to use MessagingCenter as you have already alluded to.
The other obvious approach would be to use a third party plugin, as I don't believe Xamarin have released one. I am currently aware of these two:
https://github.com/aritchie/bluetoothle
https://github.com/xabre/xamarin-bluetooth-le

Xamarin Forms NavigationPage Icon Sizes

I'm trying to create a navigation bar for my Xamarin Forms app. I'm adding some primary ToolbarItems which will have an icon associated with them using the following syntax:
ToolbarItems.Add(new ToolbarItem("Search", "ic_action_search.png", ActionSearch, ToolbarItemOrder.Primary));
I've searched everywhere but I cannot find the recommended images sizes for each platform (Android, iOS, UWP, Windows, and WinPhone).
Does anyone know what they should be?
A google search for "recommended tool bar icon sizes [Android|iOS|UWP] was very useful here.
iOS:
https://developer.apple.com/ios/human-interface-guidelines/graphics/custom-icons/
Android:
https://developer.android.com/guide/practices/ui_guidelines/icon_design_action_bar.html
UWP:
https://msdn.microsoft.com/en-us/windows/uwp/controls-and-patterns/tiles-and-notifications-app-assets
No good chart that I found for UWP as it is quite a bit more complex due to support of Tablets, Phones, and Desktop, but the needed info is in the guide above.

Xamarin - mixing Forms and Storyboards

Is it possible to mix iOS Storyboards and Xamarin Forms within one application? I have a bunch of views that are easier to be created in Forms, but some which are heavily customized so we would need to create some of them in native code.
I would like to use Storyboards to create the native parts, but can't seem to find a way to navigate from a Forms page to a Storyboard and vice versa.
I don't mind doing it from code, just need to know the direction to look into and if it's even possible.
You can create native views using the concept of Custom Renderers (see links below). The idea is that you create a Xamarin Forms Control that's shared between all platforms and which old common properties (like colors, general data etc), and do the native rendering on the iOS/Android/WP projects.
So, for your storyboard, you can create it usign Xamarin.iOS, and render using a Custom Renderer. The link posted by #GSerg in the comments have some information and examples, but you can take a closer look at the oficial documentation as well:
Introduction to Custom Renderers
Customizing Controls on Each Platform
Customizing Control Rendering in Xamarin.Forms (video)
Also, for more real world examples you can take a look at the Xamarin Forms XLabs project.
Thanks to Rafael Steil's answer. I looked at the links and a few more samples.
Notably:
Custom Renderer Map
Using Xamarin Forms alongside Storyboard
And I created a sample project to show the back-and-forth navigation between Xamarin Forms and pages created in Storyboards. You can find it over here:
Xamarin Forms Mixed with Native

BlackBerry App for different BlackBerry devices - Design Suggestion

I am writing an app and willing to package it for different BlackBerry devices with different properties/features and resolutions.
My problem is how do I go about creating a DeviceConfigurationManager that will give me device specific properties/paddings/margins/resolutions etc? I have read here on SO about using Ui.UNITS_pt for fonts, having multiple images for different resolution devices and other things that has helped me in designing my DeviceConfigurationManager . For example in my buttons I have used margins and so for various devices I kept one device as a reference and relatively returned margins for other devices on width(Display.getWidth()>320) check. But I have seen I still don't get exact perfection for other devices (Buttons set centered for the base device doesn't also get perfectly centered for other devices). Please suggest some other or a better way about designing my DeviceConfigurationManager class. Thanks a lot.
Can't offer too much help - but plenty of sympathy. If you're developing for the BlackBerry Java OS you're just going to have to get used to having lots of boiler-plate to handle the different devices. I suspect you do the same as me; have a class that runs on startup, reads the screen size and then sets all kinds of static params for font sizes, padding etc etc.

Resources