I'm learning the below Xamarin code, I would like to make each image fulfills its cell. I already tried VerticalOptions="FillAndExpand".
But it doesn't work. How to solve it?
<Grid x:Name="initialpagelayout" VerticalOptions="StartAndExpand" >
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Image VerticalOptions="FillAndExpand" BackgroundColor="Red" Grid.Row="0" Grid.Column="0" x:Name="MyIcon01"></Image>
<Image BackgroundColor="Blue" Grid.Row="0" Grid.Column="1" x:Name="MyIcon02"></Image>
<Image BackgroundColor="Green" Grid.Row="0" Grid.Column="2" x:Name="MyIcon03"></Image>
<Image BackgroundColor="Yellow" Grid.Row="1" Grid.Column="0" x:Name="MyIcon04"></Image>
<Image BackgroundColor="Pink" Grid.Row="1" Grid.Column="1" x:Name="MyIcon05"></Image>
<Image BackgroundColor="Red" Grid.Row="1" Grid.Column="2" x:Name="MyIcon06"></Image>
<Image Grid.Row="2" Grid.Column="0" x:Name="MyIcon07"></Image>
<Image Grid.Row="2" Grid.Column="1" x:Name="MyIcon08"></Image>
<Image Grid.Row="2" Grid.Column="2" x:Name="MyIcon09"></Image>
<Image Grid.Row="3" Grid.Column="0" x:Name="MyIcon10"></Image>
<Image Grid.Row="3" Grid.Column="1" x:Name="MyIcon11"></Image>
<Image Grid.Row="3" Grid.Column="2" x:Name="MyIcon12"></Image>
</Grid>
UPDATE1
I added Aspect="Fill" into each <Image>, and I get the below:
It works well but I notice there is a blank space above the first row, but I don't have any placeholder there,
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="Guru.Pwa.Mobile.Initial">
<ContentPage.Content>
<Grid x:Name="initialpagelayout" VerticalOptions="StartAndExpand" >
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Image Aspect="Fill" Grid.Row="0" Grid.Column="0" x:Name="MyIcon01"></Image>
<Image Aspect="Fill" Grid.Row="0" Grid.Column="1" x:Name="MyIcon02"></Image>
<Image Aspect="Fill" Grid.Row="0" Grid.Column="2" x:Name="MyIcon03"></Image>
<Image Aspect="Fill" Grid.Row="1" Grid.Column="0" x:Name="MyIcon04"></Image>
<Image Aspect="Fill" Grid.Row="1" Grid.Column="1" x:Name="MyIcon05"></Image>
<Image Aspect="Fill" Grid.Row="1" Grid.Column="2" x:Name="MyIcon06"></Image>
<Image Aspect="Fill" Grid.Row="2" Grid.Column="0" x:Name="MyIcon07"></Image>
<Image Aspect="Fill" Grid.Row="2" Grid.Column="1" x:Name="MyIcon08"></Image>
<Image Aspect="Fill" Grid.Row="2" Grid.Column="2" x:Name="MyIcon09"></Image>
<Image Aspect="Fill" Grid.Row="3" Grid.Column="0" x:Name="MyIcon10"></Image>
<Image Aspect="Fill" Grid.Row="3" Grid.Column="1" x:Name="MyIcon11"></Image>
<Image Aspect="Fill" Grid.Row="3" Grid.Column="2" x:Name="MyIcon12"></Image>
</Grid>
</ContentPage.Content>
</ContentPage>
How to remove it?
Related
I am using grid to implement the navigation bar. I tried using to grid row and adjusted the rowspan of the center image to 2 but somehow I cant replicate what is in the image. Any help is much appreciated. Thanks in advance! Attached is the code for my navigation bar
Grid VerticalOptions="EndAndExpand"
BackgroundColor="Red"
RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width}"
RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.10}"
RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=0.90}">
<Grid.RowDefinitions>
<RowDefinition Height="0.1*"/>
<RowDefinition Height="44"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="3*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="3*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="3*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="3*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="3*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Image Source="navbar_background.png" Grid.Column="0" Grid.Row="1" Grid.ColumnSpan="11" Aspect="Fill" HorizontalOptions="FillAndExpand"/>
<components:ImageComponent SetSource="icon_home_default.png" Grid.Row="1" Grid.Column="1" VerticalOptions="CenterAndExpand" HorizontalOptions="CenterAndExpand">
<components:ImageComponent.GestureRecognizers>
<TapGestureRecognizer Tapped="HomeClicked"/>
</components:ImageComponent.GestureRecognizers>
</components:ImageComponent>
<components:ImageComponent x:Name="BranchFinderBtnDefualt" SetSource="icon_branchfinder_default.png" Grid.Row="0" Grid.Column="5" Grid.RowSpan="2" VerticalOptions="CenterAndExpand" HorizontalOptions="CenterAndExpand" IsVisible="True">
<components:ImageComponent.GestureRecognizers>
<TapGestureRecognizer Tapped="BranchFinderClicked"/>
</components:ImageComponent.GestureRecognizers>
</components:ImageComponent>
<components:ImageComponent x:Name="BranchFinderBtnCurrentPage" SetSource="icon_branchfinder_currentpage.png" Grid.Row="0" Grid.Column="5" VerticalOptions="CenterAndExpand" HorizontalOptions="CenterAndExpand" IsVisible="False">
<components:ImageComponent.GestureRecognizers>
<TapGestureRecognizer Tapped="BranchFinderClicked"/>
</components:ImageComponent.GestureRecognizers>
</components:ImageComponent>
</Grid>
You can further fine tune it , but this should help
<Grid Padding="0" Margin="0" ColumnSpacing="0" RowSpacing="0">
<Grid.RowDefinitions>
<RowDefinition Height="90*"/>
<RowDefinition Height="25"/>
<RowDefinition Height="10*"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="1.35*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<StackLayout Grid.Row="0" Grid.Column="0" Grid.RowSpan="2" Grid.ColumnSpan="5" BackgroundColor="White" HorizontalOptions="Fill" VerticalOptions="Fill">
<Label Text="My Page" HorizontalOptions="Center" VerticalOptions="CenterAndExpand"/>
</StackLayout>
<BoxView Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="5" HorizontalOptions="FillAndExpand" VerticalOptions="Start" HeightRequest="3"
Color="LightGray"/>
<Image Grid.Row="2" Grid.Column="0" VerticalOptions="CenterAndExpand" Source="home"/>
<Image Grid.Row="2" Grid.Column="1" VerticalOptions="CenterAndExpand" Source="card"/>
<Image Grid.Row="2" Grid.Column="3" VerticalOptions="CenterAndExpand" Source="bag"/>
<Image Grid.Row="2" Grid.Column="4" VerticalOptions="CenterAndExpand" Source="inbox"/>
<Label Grid.Row="2" Grid.Column="0" VerticalOptions="EndAndExpand" Text="Home" HorizontalOptions="CenterAndExpand" Margin="0,2"/>
<Label Grid.Row="2" Grid.Column="1" VerticalOptions="EndAndExpand" Text="Cards" HorizontalOptions="CenterAndExpand" Margin="0,2"/>
<Label Grid.Row="2" Grid.Column="2" VerticalOptions="EndAndExpand" Text="Scan to Pay" HorizontalOptions="CenterAndExpand" Margin="0,2"/>
<Label Grid.Row="2" Grid.Column="3" VerticalOptions="EndAndExpand" Text="Shop" HorizontalOptions="CenterAndExpand" Margin="0,2"/>
<Label Grid.Row="2" Grid.Column="4" VerticalOptions="EndAndExpand" Text="Inbox" HorizontalOptions="CenterAndExpand" Margin="0,2"/>
<Frame Grid.Row="1" Grid.Column="2" Grid.RowSpan="2" VerticalOptions="Start" WidthRequest="60" HeightRequest="60" Padding="0" Margin="0,-5,0,0"
HasShadow="False" HorizontalOptions="Center" CornerRadius="30" BackgroundColor="LightBlue" BorderColor="White">
<Image Source="barcode" Margin="12"/>
</Frame>
</Grid>
I have to admit absolutelayout is the thing that does not get into my head.
Can you help?
I need to put an image on top of a frame -grid etc.. on few screen so I must find a solution that works.
This is what I want to achieve
This is what I have done used boxview (purple) supposed to be my img1.
MyXaml
<AbsoluteLayout>
<StackLayout Margin="20">
<BoxView Color="Purple" WidthRequest="40" HeightRequest="40"
AbsoluteLayout.LayoutBounds="0,0,1,1"
AbsoluteLayout.LayoutFlags="All"></BoxView>
<Frame
Padding="0"
BorderColor="Green"
CornerRadius="10">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="50" />
<RowDefinition Height="50" />
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid Grid.Row="0" Grid.ColumnSpan="2">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<BoxView Grid.Row="0" Grid.Column="0" Margin="5" Color="Red"/>
<BoxView Grid.Row="0" Grid.Column="4" Margin="5" Color="GreenYellow"/>
</Grid>
<Label Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2" HeightRequest="50" BackgroundColor="Coral" Margin="20,0,20,0"
TextColor="White" Text="Label 3" />
<!--other stuff down here -->
</Grid>
</Frame>
</StackLayout>
</AbsoluteLayout>
My Result (as you can see I get a long rectangle when all i want is the boxview in the middle like above). Can you help?
This should get you started (I mod'ed a demo of mine, so adjust accordingly):
<AbsoluteLayout x:Name="ViewControls" AbsoluteLayout.LayoutBounds="1,1,1,.50" AbsoluteLayout.LayoutFlags="All" BackgroundColor="#66000000" Margin="10,10,10,10">
<Frame CornerRadius="10" Margin="20,20,20,20" BackgroundColor="Black" AbsoluteLayout.LayoutFlags="All" AbsoluteLayout.LayoutBounds="1,1,1,1">
<Grid Margin="1">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Label Text="Left" BackgroundColor="White" HorizontalTextAlignment="Center" Grid.Column="0" />
<Label Text="Right" BackgroundColor="White" HorizontalTextAlignment="Center" Grid.Column="2" />
<Label Text="Across Page" BackgroundColor="White" HorizontalTextAlignment="Center" Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="3" />
</Grid>
</Frame>
<Image Source="yt.png"
BackgroundColor="Transparent"
AbsoluteLayout.LayoutFlags="PositionProportional"
AbsoluteLayout.LayoutBounds=".5,0,50,50" />
</AbsoluteLayout>
I have a content view which I will be using as a data template for a custom grid view, which will be supporting horizontal scrolling. And for the custom template I need to fix the width and height request depending on the device width and height. Below is the custom content view. How can i update the width and height request values?
<?xml version="1.0" encoding="UTF-8"?>
<ContentView xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="GridView.BookshelfItem">
<ContentView.Content>
<Grid BackgroundColor="Black" WidthRequest="320">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<ProgressBar Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2" BackgroundColor="#E4E4E4" Progress="{Binding Progress}" HeightRequest="3" VerticalOptions="EndAndExpand"/>
<Image Source="" Aspect="AspectFill" Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="2" Grid.RowSpan="3"/>
<Label Text="{Binding Title}" Grid.Row="1" Grid.Column="0" Grid.ColumnSpan="2" Margin="10,0,0,0" VerticalOptions="End" TextColor="#FFFFFF" FontSize="17"/>
<Image Source="icon.png" Aspect="AspectFill" Grid.Row="1" Grid.Column="1"/>
<StackLayout Grid.Row="2" Grid.Column="0" Grid.ColumnSpan="2" Margin="10,0,0,0">
<Label Text="{Binding Description}" TextColor="#FFFFFF" FontSize="13"/>
<Label Text="{Binding DescriptionDetails}" TextColor="#FFFFFF" FontSize="15"/>
</StackLayout>
</Grid>
</ContentView.Content>
</ContentView>
I am trying to create a page in Xamarin forms with two columns and five rows.
Both the columns have images with a label at the bottom and a white background. The image and label need to be in the same stack layout.
Basically each stack layout is a thumbnail redirecting to other pages.
Here is what I've tried:
<ScrollView>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<StackLayout>
<StackLayout BackgroundColor="White" Grid.Column="0" Grid.Row="0">
<Image Source="My_concern.png" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand"></Image>
<Label Text="Raise A Concern"></Label>
</StackLayout>
<StackLayout BackgroundColor="White" Grid.Column="1" Grid.Row="0">
<Image Source="img_leave_plan.png" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand"></Image>
<Label Text="Leave Plan" ></Label>
</StackLayout>
<StackLayout BackgroundColor="White" Grid.Column="0" Grid.Row="1">
<Image Source="My_Checklist.png" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand"></Image>
<Label Text="Leave Plan"></Label>
</StackLayout>
<StackLayout BackgroundColor="White" Grid.Column="1" Grid.Row="1">
<Image Source="img_facilities.png" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand"></Image>
<Label Text="Facilities"></Label>
</StackLayout>
<StackLayout BackgroundColor="White" Grid.Column="0" Grid.Row="2">
<Image Source="My_buddies.png" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand"></Image>
<Label Text="My Buddies"></Label>
</StackLayout>
<StackLayout BackgroundColor="White" Grid.Column="1" Grid.Row="2">
<Image Source="SapphireArticles.png" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand"></Image>
<Label Text="Articles"></Label>
</StackLayout>
<StackLayout BackgroundColor="White" Grid.Column="0" Grid.Row="3">
<Image Source="policy.png" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand"></Image>
<Label Text="Policies"></Label>
</StackLayout>
<StackLayout BackgroundColor="White" Grid.Column="1" Grid.Row="3">
<Image Source="SapphireNews.png" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand"></Image>
<Label Text="News"></Label>
</StackLayout>
<StackLayout BackgroundColor="White" Grid.Column="1" Grid.Row="4">
<Image Source="Compass.png" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand"></Image>
<Label Text="Compass"></Label>
</StackLayout>
</StackLayout>
</Grid>
</ScrollView>
I am getting the error
No property, bindable property, or event found for 'Children'.
What am I doing wrong?
Your stacklayout that is the direct child of grid does not have row or column specified. You are specifying it at a level deeper in which grid is not the parent.
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<StackLayout>
<StackLayout BackgroundColor="White" Grid.Column="0" Grid.Row="0">
Also the layout does not looks optimal. You may want to think about refactoring this.
Code without the extra stack layout :
<ScrollView>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<StackLayout BackgroundColor="White" Grid.Column="0" Grid.Row="0">
<Image Source="My_concern.png" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand"></Image>
<Label Text="Raise A Concern"></Label>
</StackLayout>
<StackLayout BackgroundColor="White" Grid.Column="1" Grid.Row="0">
<Image Source="img_leave_plan.png" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand"></Image>
<Label Text="Leave Plan" ></Label>
</StackLayout>
<StackLayout BackgroundColor="White" Grid.Column="0" Grid.Row="1">
<Image Source="My_Checklist.png" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand"></Image>
<Label Text="Leave Plan"></Label>
</StackLayout>
<StackLayout BackgroundColor="White" Grid.Column="1" Grid.Row="1">
<Image Source="img_facilities.png" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand"></Image>
<Label Text="Facilities"></Label>
</StackLayout>
<StackLayout BackgroundColor="White" Grid.Column="0" Grid.Row="2">
<Image Source="My_buddies.png" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand"></Image>
<Label Text="My Buddies"></Label>
</StackLayout>
<StackLayout BackgroundColor="White" Grid.Column="1" Grid.Row="2">
<Image Source="SapphireArticles.png" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand"></Image>
<Label Text="Articles"></Label>
</StackLayout>
<StackLayout BackgroundColor="White" Grid.Column="0" Grid.Row="3">
<Image Source="policy.png" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand"></Image>
<Label Text="Policies"></Label>
</StackLayout>
<StackLayout BackgroundColor="White" Grid.Column="1" Grid.Row="3">
<Image Source="SapphireNews.png" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand"></Image>
<Label Text="News"></Label>
</StackLayout>
<StackLayout BackgroundColor="White" Grid.Column="1" Grid.Row="4">
<Image Source="Compass.png" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand"></Image>
<Label Text="Compass"></Label>
</StackLayout>
</Grid>
</ScrollView>
When I click in a entry and the keyboard is oppened, all my layout is kneaded.
Like in the photos.
Before :
After:
This happend with my android and ios devices
I am using xamarin forms...does someone know how to solve that?
My xaml where only put the scroll view doesn't work:
<ScrollView BackgroundColor="Red">
<Grid RowSpacing="0" HeightRequest="100">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.5*"/>
<ColumnDefinition Width="9*"/>
<ColumnDefinition Width="0.5*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="2.3*"/>
<RowDefinition Height="5.4*"/>
<RowDefinition Height="2.3*"/>
</Grid.RowDefinitions>
<Image Source="recuperarFundo" Grid.Column="1" Grid.Row="1" Aspect="Fill" HorizontalOptions="FillAndExpand"/>
<Grid Grid.Column="1" Grid.Row="1" RowSpacing="0" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
<Grid.RowDefinitions>
<RowDefinition Height="3*"/>
<RowDefinition Height="4*"/>
<RowDefinition Height="3*"/>
</Grid.RowDefinitions>
<Grid Grid.Row="0" VerticalOptions="CenterAndExpand">
<Image Source="cadastrarVoltar" Margin="20,0,0,0" Grid.Column="0" Grid.Row="0" VerticalOptions="Start" HorizontalOptions="Start">
<!--<Image.Margin>
<OnPlatform x:TypeArguments="Thickness"
Android="20,0,0,0"
iOS="20,0,0,0"/>
</Image.Margin>-->
<Image.GestureRecognizers>
<TapGestureRecognizer Tapped="OnClose"/>
</Image.GestureRecognizers>
</Image>
<Image Source="loginlogo" Margin="0,10,0,10" Grid.Column="0" Grid.Row="0" VerticalOptions="Center" HorizontalOptions="Center"/>
</Grid>
<Grid Grid.Row="1" VerticalOptions="CenterAndExpand">
<Image Source="recuperarForms" Aspect="Fill" Grid.Column="0" Grid.Row="0" Margin="20,0,20,0"/>
<Grid Grid.Column="0" Grid.Row="0" RowSpacing="0" Padding="25,0,25,0" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">
<Grid.RowDefinitions>
<RowDefinition Height="5*"/>
<RowDefinition Height="5*"/>
</Grid.RowDefinitions>
<local:MyLabel x:Name="recupera_lbl" Text="Para recuperar sua senha, digite abaixo o e-mail cadastrado" Margin ="20,0,20,0" VerticalOptions="CenterAndExpand" HorizontalTextAlignment="Center" HorizontalOptions="CenterAndExpand" NamedFontSize="Small" Style="{Binding labelsfont}"/>
<local:MyEntry x:Name="recuperar_entry" Grid.Row="1" VerticalOptions="Center" Placeholder="Seu e-mail" TextColor="{StaticResource MarromClaro}" PlaceholderColor="{StaticResource MarromClaro}" FontSize="Small" HorizontalOptions="Fill" HorizontalTextAlignment="Center"/>
</Grid>
</Grid>
<Grid Grid.Row="2" VerticalOptions="FillAndExpand">
<ActivityIndicator Grid.Row="0" Grid.Column ="0" x:Name="recuperar_indicator" Color="DarkRed" HorizontalOptions="CenterAndExpand" IsVisible="false" IsRunning="true"/>
<Image Grid.Row="0" Grid.Column ="0" x:Name="recuperar_button" Source="recuperarButton" HorizontalOptions="CenterAndExpand">
<Image.GestureRecognizers>
<TapGestureRecognizer Tapped="CallingRecuperarSenhaAsync"/>
</Image.GestureRecognizers>
</Image>
</Grid>
</Grid>
</Grid>
use ScrollView as main container