I'm quite new to using Xamarin and I'm developing a cross-platform (between iOS and Android) mobile app. I've been working with a Grid to display some instructions, since the instructions are long enough that they need to be scrolled through, I've been using a ScrollView spanning across multiple columns to display the scrollable instructions.
The problem is ever since I changed the minimum Android build target to be Api Level 21 from 15, my Grids background colour appears for a split second when the app is ran inside an emulator, then disappears (See attached images). On iOS everything still works normally.
If I remove the ScrollView from the Grid then the background colour doesn't disappear so I assume it's something to do with having a ScrollView inside a Grid on the Android side. Here's my code for defining the Grid and the ScrollView:
Grid pageGrid = new Grid
{
VerticalOptions = LayoutOptions.CenterAndExpand,
HorizontalOptions = LayoutOptions.CenterAndExpand,
BackgroundColor = Color.White,
Opacity = 0.8,
RowSpacing = 2,
ColumnSpacing = 2,
Padding = new Thickness(.5, 1, .5, 0),
RowDefinitions = {
new RowDefinition {Height = 0},
new RowDefinition {Height = 30},
new RowDefinition {Height = App.screenHeight - 140},
new RowDefinition {Height = 30},
new RowDefinition {Height = 0}
},
ColumnDefinitions =
{
new ColumnDefinition {Width = 0},
new ColumnDefinition {Width = App.screenWidth / 4 - 20},
new ColumnDefinition {Width = App.screenWidth / 4 - 20},
new ColumnDefinition {Width = App.screenWidth / 4 - 20},
new ColumnDefinition {Width = App.screenWidth / 4},
new ColumnDefinition {Width = 0}
}
};
Label instructionLbl = new Label
{
Text = "l",
TextColor = Color.Gray,
BackgroundColor = Color.Black,
};
ScrollView instructions = new ScrollView
{
Padding = new Thickness(5, 0, 2, 0),
BackgroundColor = Color.Black,
IsClippedToBounds = true,
Content = instructionLbl
};
pageGrid.Children.Add(instructions``, 1, 5, 2, 3);
I've tried to place the ScrollView inside a StackLayout before placing it inside the Grid, and also tried placing the Label with the instruction text inside a StackLayout before placing it inside the ScrollView, both of which didn't work out.
So I'm asking if anyone has any idea how to fix this, or could recommend some other method of creating the same kind of layout?