In Xamarin.Forms ,
FlexLayout and is enabled with xamarin version 3.0 and above. It is also known as flex layout or flex-box, because it includes many flexible options to arrange children within the layout.
FlexLayout is similar to the Xamarin.Forms
StackLayout in that it can arrange its children horizontally and vertically in a stack. However, the
FlexLayout is also capable of wrapping many childrens and it has many options for orientation, alignment, and adapting to various screen sizes.
This tutorial is based on Using flex layout.
We are using xmlns:ios=“…………….. ios:Page.UseSafeArea=“true” code so that our layout will be adaptive to every screen sizes.
At first we are going to define <Style for “Frame,Label and image “> so that we are going to call all those styles in upcoming code. It’s a good precise for localization.
Then we are going to set <ScrollView Orientation=”Both”> So that our scrollview will have horizontal scrolling. Now next part is to Add frame of width and height to some value inside flexlayout . Inside which we are going to give <FlexLayout Direction=”Column”> and add the contents inside it. That’s all please show up the code 🙂
Your MainPage.xaml will beLike this:
Step2: We are going to initialize the MainPage to start as a start up page inside App.xaml.cs.