Demonstrates changing a Xamarin Forms CollectionView from a vertical list to a horizontal list based on device orientation. This code accompanies my blog post Rotating a list in Xamarin.Forms using CollectionView.
Xamarin.Essentials DeviceDisplay is unreliable, returning the previous orientation when using the MainDisplayInfoChanged event. See xamarin/Essentials#1355.
Using the page's OnSizeAllocated event is more reliable, override the OnSizeAllocated event to call a view-model method which updates the layout. This is usually done using a base page but since this app has only one page the event is overridden in the code behind.
Uses a binding on CollectionView.ItemTemplate to specify different data templates for portrait and landscape orientation.
Uses a binding on CollectionView.ItemLayout to specify different layouts / orientation for portrait and landscape. On tablets multiple column layouts could be used instead.
| Portrait | Landscape |
|---|---|
 |
 |
Icons made by Freepik from www.flaticon.com.
Text from Zombie Ipsum.
Colours by Nord.