Jump to: navigation, search

Changes


Xamarin XAML

1,972 bytes added, 14:41, 9 June 2020
/* Performance */
{{Hint|There is a default "HeadlessLayout" style available in the app you can use on elements such as Grids, StackLayouts, ContentViews, etc. It turns on layout compression on the applied elements in Xamarin.Android (since we find it not worth the effort in Xamarin.iOS).}}
{{Attention|If possible, one should always favor designing the UI with less wrapping elements over turning on layout compression on unnecessary ones.}}
 
=== General performance tips ===
* Reduce number of views per page
* Don’t bind things if they could be set static easily
* If you do not change the default, don’t set it explicit. For example, [https://docs.microsoft.com/en-us/dotnet/api/Xamarin.Forms.StackLayout.Orientation?view=xamarin-forms Orientation of StackLayout] is “Vertical” by default. No need to set it manually if you don’t want to change it.
* Transparency is expensive.
* Use async/await to avoid blocking user interface.
* Do not put ListViews into ScrollViews.
* To stack elements, create a grid and add them to the same cell one after another. It’s cheaper than RelativeLayout.
* Use Margins instead of Paddings.
 
=== Layouts ===
* Choose correct Layout, e.g. no need to add a StackLayout if it only has 1 child.
* [https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/layouts/layout-options LayoutOptions].Fill or .FillAndExpand are best choice in most cases. And they are already default, so no need to set.
* Autosize of rows and columns in grids should used as few as possible.
* RelativeLayout is very expensive. Try to avoid.
* In StackLayout, make sure there is only 1 LayoutOptions Expand.
 
=== Labels ===
* Use [https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/text/label#formatted-text FormattedText] instead of multiple labels.
* Use [https://docs.microsoft.com/en-us/dotnet/api/xamarin.forms.linebreakmode?view=xamarin-forms Linebreakmode] NoWrap (which is already the default).
* Avoid [https://docs.microsoft.com/en-us/dotnet/api/Xamarin.Forms.Label.VerticalTextAlignment?view=xamarin-forms VerticalTextAlignment]. Anyway, if needed, use VerticalTextAligment instead of VerticalOptions.
 
=== Images ===
* Provide images in optimized width and size. Provide multiple resolutions for different usage.
* Set [https://docs.microsoft.com/en-us/dotnet/api/Xamarin.Forms.Image.IsOpaque?view=xamarin-forms IsOpaque] to true if image is opaque.
=== Layout compression examples ===