Develop Reference

Xamarin Forms - use TranslateTo to slide StackLayouts up - c#

I have a page with 4 StackLayouts, OnAppearing I 'slide' the bottom 3 up so that the 2nd top one in under the top, to create a drop-down effect with a toolbar for the user to click (iconStack in the XAML), which then either slides the stack up or down.
This works fine when I click on it to slide it up and down, but when I do the slide up OnAppearing, sometimes it does not fully move up leaving some of the stack visible and I cannot see why, or see anything in debugging.
Can anyone spot anything obvious in my code?
protected override async void OnAppearing()
{
// here I get some data from the database and set labels etc before I do the next line...
SlideUp(0);
base.OnAppearing();
}
public void SlideUp(uint time)
{
TopLayout.TranslateTo(0, (headerStack.Bounds.Height - (TopLayout.Height + headerStack.Height)), time, Easing.Linear);
headerStack.TranslateTo(0, (headerStack.Bounds.Height - (TopLayout.Height + headerStack.Height)), time, Easing.Linear);
Articlestack.TranslateTo(0, (headerStack.Bounds.Height - (TopLayout.Height + headerStack.Height)), time, Easing.Linear);
}
public void SlideDown(uint time)
{
TopLayout.TranslateTo(0, 0, time, Easing.Linear);
headerStack.TranslateTo(0, 0, time, Easing.Linear);
Articlestack.TranslateTo(0, 0, time, Easing.Linear);
}
XAML:
<?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="gl_mobile_app.Views.Article.ArticleInfoOpen"
xmlns:artina="clr-namespace:UXDivers.Artina.Shared;assembly=UXDivers.Artina.Shared"
xmlns:local="clr-namespace:gl_mobile_app.Views.Templates;assembly=gl_mobile_app"
xmlns:ratio="clr-namespace:gl_mobile_app;assembly=gl_mobile_app"
xmlns:custom="clr-namespace:gl_mobile_app.Controls;assembly=gl_mobile_app"
xmlns:ffimageloading="clr-namespace:FFImageLoading.Forms;assembly=FFImageLoading.Forms">
<ContentPage.ToolbarItems>
<ToolbarItem Text="Back" Clicked="GoBack" />
</ContentPage.ToolbarItems>
<ContentPage.Content>
<ScrollView>
<Grid BackgroundColor="#ede8db" x:Name="articleGrid" >
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<ffimageloading:CachedImage Grid.Row="0" Aspect="AspectFill" Source="KevingroveCarouselImg" AbsoluteLayout.LayoutBounds="1,1,1,1" AbsoluteLayout.LayoutFlags="All" x:Name="bigImg"
HeightRequest="{artina:OnOrientationDouble PortraitPhone=200, PortraitTablet=400, LandscapeTablet=200 }" />
<artina:Button Margin="10,10,10,10" x:Name="ImgZoom" Clicked="EnlargeImage" HorizontalOptions="End" VerticalOptions="Start" Image="IncreaseImageIcon.png" BackgroundColor="Transparent" HeightRequest="30" WidthRequest="30"/>
<StackLayout Grid.Row="1" Orientation="Horizontal" Margin="-6" Padding="30,2,30,2" x:Name="iconStack" HorizontalOptions="FillAndExpand" BackgroundColor="#ede8db" >
<Label HorizontalTextAlignment="Center" Text="{x:Static ratio:Ingeniuus.TOILET}" Style="{StaticResource Ingeniuus}" TextColor="Gray" FontSize ="{artina:OnOrientationDouble PortraitPhone=20, LandscapePhone=18, PortraitTablet=25, LandscapeTablet=20 }" />
<Label HorizontalTextAlignment="Center" Text="{x:Static ratio:Ingeniuus.WHEELCHAIR}" Style="{StaticResource Ingeniuus}" TextColor="Gray" FontSize ="{artina:OnOrientationDouble PortraitPhone=20, LandscapePhone=18, PortraitTablet=25, LandscapeTablet=20 }" />
<Label HorizontalTextAlignment="Center" Text="{x:Static ratio:Ingeniuus.CUTLERY}" Style="{StaticResource Ingeniuus}" TextColor="Gray" FontSize="{artina:OnOrientationDouble PortraitPhone=20, LandscapePhone=18, PortraitTablet=25, LandscapeTablet=20 }" />
<Label HorizontalTextAlignment="Center" Text="{x:Static ratio:Ingeniuus.BABY}" Style="{StaticResource Ingeniuus}" TextColor="Gray" FontSize="{artina:OnOrientationDouble PortraitPhone=20, LandscapePhone=18, PortraitTablet=25, LandscapeTablet=20 }" />
<Label HorizontalTextAlignment="Center" Text="{x:Static ratio:Ingeniuus.WIFI}" Style="{StaticResource Ingeniuus}" TextColor="Gray" FontSize="{artina:OnOrientationDouble PortraitPhone=20, LandscapePhone=18, PortraitTablet=25, LandscapeTablet=20 }" />
<Label HorizontalTextAlignment="Center" Text="{x:Static ratio:Ingeniuus.CAMERA}" Style="{StaticResource Ingeniuus}" TextColor="Gray" FontSize="{artina:OnOrientationDouble PortraitPhone=20, LandscapePhone=18, PortraitTablet=25, LandscapeTablet=20 }" />
<Label HorizontalTextAlignment="Center" Text="{x:Static ratio:Ingeniuus.MAP_MARKER}" Style="{StaticResource Ingeniuus}" TextColor="Gray" FontSize="{artina:OnOrientationDouble PortraitPhone=20, LandscapePhone=18, PortraitTablet=25, LandscapeTablet=20 }" />
<Label x:Name="expand" HorizontalTextAlignment="Center" HorizontalOptions="EndAndExpand" Text="{x:Static ratio:FontAwesome.CHEVRON_CIRCLE_DOWN}" Style="{StaticResource FontIcon}" TextColor="Gray" FontSize="{artina:OnOrientationDouble PortraitPhone=20, LandscapePhone=18, PortraitTablet=25, LandscapeTablet=20 }" />
</StackLayout>
<StackLayout x:Name="TopLayout" Padding="30,0,30,0" VerticalOptions="FillAndExpand" Grid.Row="2" BackgroundColor="#ede8db">
<StackLayout Orientation="Horizontal" x:Name="MapMarker" Opacity="1.0">
<Label HorizontalTextAlignment="Center" Text="{x:Static ratio:Ingeniuus.MAP_MARKER}" Style="{StaticResource Ingeniuus}" TextColor="Black" FontSize="20" WidthRequest="{artina:OnOrientationDouble PortraitPhone=20,PortraitTablet=40, LandscapeTablet=40 }" />
<Label Text="Address" VerticalOptions="Center" HorizontalOptions="StartAndExpand" FontAttributes="Bold" />
</StackLayout>
<StackLayout x:Name="AddressStack" >
<StackLayout.Padding>
<OnIdiom x:TypeArguments="Thickness">
<OnIdiom.Phone>
<OnPlatform x:TypeArguments="Thickness" iOS="34.5,0,0,0" Android="34.5,0,0,0" />
</OnIdiom.Phone>
<OnIdiom.Tablet>
<OnPlatform x:TypeArguments="Thickness" iOS="54.5,0,0,0" Android="54.5,0,0,0" />
</OnIdiom.Tablet>
</OnIdiom>
</StackLayout.Padding>
<Label x:Name="AddressLabel" >
<Label.FontFamily>
<OnPlatform x:TypeArguments="x:String">
<On Platform="iOS" Value="HelveticaNeue-Roman" />
<On Platform="Android" Value="HelveticaNeue-Roman.otf#HelveticaNeue-Roman" />
</OnPlatform>
</Label.FontFamily>
</Label>
</StackLayout>
<StackLayout Orientation="Horizontal" x:Name="clock" Opacity="1.0">
<Label HorizontalTextAlignment="Center" Text="{x:Static ratio:Ingeniuus.CLOCK}" Style="{StaticResource Ingeniuus}" TextColor="Black" FontSize="20" WidthRequest="{artina:OnOrientationDouble PortraitPhone=20,PortraitTablet=40, LandscapeTablet=40 }"/>
<Label Text="Opening Times" VerticalOptions="Center" HorizontalOptions="StartAndExpand" FontAttributes="Bold"/>
</StackLayout>
<StackLayout x:Name="OpeningTimesStack">
<StackLayout.Padding>
<OnIdiom x:TypeArguments="Thickness">
<OnIdiom.Phone>
<OnPlatform x:TypeArguments="Thickness" iOS="34.5,0,0,0" Android="34.5,0,0,0" />
</OnIdiom.Phone>
<OnIdiom.Tablet>
<OnPlatform x:TypeArguments="Thickness" iOS="54.5,0,0,0" Android="54.5,0,0,0" />
</OnIdiom.Tablet>
</OnIdiom>
</StackLayout.Padding>
<Label Grid.Row="1" x:Name="OpeningTimesLabel" >
<Label.FontFamily>
<OnPlatform x:TypeArguments="x:String">
<On Platform="iOS" Value="HelveticaNeue-Roman" />
<On Platform="Android" Value="HelveticaNeue-Roman.otf#HelveticaNeue-Roman" />
</OnPlatform>
</Label.FontFamily>
</Label>
</StackLayout>
<StackLayout x:Name="Empty2" HeightRequest="10" />
</StackLayout>
<StackLayout Grid.Row="4" x:Name="Articlestack">
<ListView BackgroundColor="White" Margin="-4" Parent="30,0,30,0" x:Name="ArticleListView" CachingStrategy="RetainElement" HasUnevenRows="True" SeparatorVisibility="None" VerticalOptions="FillAndExpand" HeightRequest="6000" >
<ListView.ItemTemplate>
<DataTemplate x:Name="dataTemp">
<ViewCell>
<local:ArticleContentItemTemplate />
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
</Grid>
</ScrollView>
</ContentPage.Content>
</ContentPage>

You can set visibility to false but you will lose some animation of translation instead of that you can do translation and after that remove visibility this will keep it smoothly.

Related

Problem with listview on Xamarin Forms iOS
Hello, I have a cross-platform app, I put a ListView with some items, on android it's all right, but on iOS there's a blank space that I'm not able to correct...
I've already reviewed the code and I can't find what's wrong.
Has anyone seen this error or already gone through it?
Here is my image:
Blank is my content page.
Yellow is my ListView.
The blue square is the blank space I can't remove.
Red is the header of my list.
Here is my code:
XAML
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage
x:Class="MensagemDoDia.Views.MensagemViews.MensagemDetailPage"
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:extended="clr-namespace:MensagemDoDia.Engine.InfiniteScrolling"
xmlns:ios="clr-namespace:Xamarin.Forms.PlatformConfiguration.iOSSpecific;assembly=Xamarin.Forms.Core"
xmlns:pancake="clr-namespace:Xamarin.Forms.PancakeView;assembly=Xamarin.Forms.PancakeView"
ios:Page.UseSafeArea="True">
<ContentPage.Content>
<Grid>
<ListView
BackgroundColor="Yellow"
CachingStrategy="RecycleElement"
HasUnevenRows="True"
ItemSelected="ListView_ItemSelected"
ItemsSource="{Binding ListaMensagem}"
Scrolled="ListView_Scrolled"
SeparatorVisibility="None">
<ListView.Behaviors>
<extended:InfiniteScrollBehavior IsLoadingMore="{Binding IsBusy}" />
</ListView.Behaviors>
<ListView.Header>
<StackLayout
Margin="{OnPlatform Android='10,0,10,0',
iOS='10,0,10,0'}"
BackgroundColor="Red"
HeightRequest="{OnPlatform Android=80,
iOS=70}"
Orientation="Horizontal">
<Button
Clicked="ButtonVoltar_Clicked"
Style="{StaticResource ButtonVoltarStyle}"
Text="{StaticResource FontAwesome_ArrowLeft}"
VerticalOptions="Center" />
<Label
x:Name="LabelNomeCategoria"
FontSize="Medium"
Opacity="0.7"
Style="{StaticResource LabelBoldStyle}"
VerticalTextAlignment="Center" />
</StackLayout>
</ListView.Header>
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<pancake:PancakeView
Margin="10,5"
Padding="0"
BackgroundColor="WhiteSmoke"
CornerRadius="15"
VerticalOptions="CenterAndExpand">
<pancake:PancakeView.Shadow>
<pancake:DropShadow BlurRadius="1" Color="Black" />
</pancake:PancakeView.Shadow>
<Grid RowDefinitions="*, 50" RowSpacing="0">
<Frame
Padding="0"
BackgroundColor="Gray"
CornerRadius="15"
HasShadow="False"
HorizontalOptions="FillAndExpand"
VerticalOptions="FillAndExpand">
<Grid>
<Label
Margin="20,30"
FontAttributes="Bold"
FontSize="Medium"
HorizontalOptions="FillAndExpand"
HorizontalTextAlignment="Center"
Style="{StaticResource LabelMediumStyle}"
Text="{Binding MensagemTexto}"
TextColor="White"
TextType="Html"
VerticalOptions="FillAndExpand"
VerticalTextAlignment="Center" />
</Grid>
</Frame>
<Grid
Grid.Row="1"
ColumnDefinitions="*, auto, auto, auto"
ColumnSpacing="0">
<Label
Margin="15,0,0,0"
AutomationId="{Binding MensagemAutor}"
FontSize="Small"
HorizontalTextAlignment="Start"
LineBreakMode="TailTruncation"
MaxLines="1"
Opacity="0.7"
Style="{StaticResource LabelStyle}"
Text="{Binding MensagemAutor}"
TextColor="Black"
VerticalTextAlignment="Center">
<Label.GestureRecognizers>
<TapGestureRecognizer Tapped="LabelAutor_Tapped" />
</Label.GestureRecognizers>
</Label>
<Button
Grid.Column="1"
AutomationId="{Binding Chave}"
Clicked="ButtonCopiarMensagem_Clicked"
CornerRadius="15"
FontFamily="{StaticResource FontAwesome}"
FontSize="Medium"
Style="{StaticResource ButtonIconeStyle}"
Text="{StaticResource FontAwesome_Paste}"
VerticalOptions="CenterAndExpand"
WidthRequest="45" />
<Button
x:Name="ButtonCompartilhar"
Grid.Column="2"
AutomationId="{Binding Chave}"
Clicked="ButtonCompartilhar_Clicked"
CornerRadius="15"
FontFamily="{StaticResource FontAwesome}"
FontSize="Medium"
Style="{StaticResource ButtonIconeStyle}"
Text="{StaticResource FontAwesome_ShareAll}"
VerticalOptions="CenterAndExpand"
WidthRequest="45" />
<Button
x:Name="ButtonFavorito"
Grid.Column="3"
Margin="0,0,5,0"
Clicked="ButtonFavoritar_Clicked"
CornerRadius="15"
FontFamily="{StaticResource FontAwesome}"
FontSize="Medium"
HorizontalOptions="EndAndExpand"
Style="{StaticResource ButtonIconeStyle}"
Text="{StaticResource FontAwesome_Heart}"
VerticalOptions="CenterAndExpand"
WidthRequest="45" />
</Grid>
</Grid>
</pancake:PancakeView>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
<ListView.Footer>
<Grid Padding="6" IsVisible="{Binding IsBusy}">
<Grid.Triggers>
<Trigger TargetType="Grid" Property="IsVisible" Value="False">
<Setter Property="HeightRequest" Value="0" />
</Trigger>
</Grid.Triggers>
<Label
HorizontalOptions="Center"
Text="Loading..."
VerticalOptions="Center" />
</Grid>
</ListView.Footer>
</ListView>
</Grid>
</ContentPage.Content>
</ContentPage>

Add VerticalAlignment to the ListView and set it to be either Top or Stretch. Possibly do the same for StackLayout.
You can optionally remove the parent Grid if it is not holding other items than the ListView; hence making the ListView the sole child of the ContentPage which is valid.

Within a grid I have an image then 2 stack layouts, one contains a row of icons and a button, and the one below contains a list of text items.
I have a function which, when the user click a button, the list animates upwards to effectively disappear, then downwards to reappear.
This works fine but the text is always visible over the image when animating up, is there a way to make the image always visible on top, so that it appears as if the text is sliding up behind the image?
Here is the code I use to animate the text stack:
public void ShowLess()
{
TopLayout.TranslateTo(0, -(TopLayout.Bounds.Height + 60), 500, Easing.Linear);
isIncreased = false;
}
public void ShowMore()
{
TopLayout.TranslateTo(0, 0, 500, Easing.Linear);
isIncreased = true;
}
And the XAML:
<ContentPage.Content>
<Grid BackgroundColor="#ede8db">
<Grid.RowDefinitions>
<RowDefinition Height="47.5*" />
<RowDefinition Height="5*" />
<RowDefinition Height="47.5*" />
</Grid.RowDefinitions>
<ratio:ContentRatioContainer Grid.Row="0">
<Image Aspect="AspectFill" Source="KevingroveCarouselImg.png" AbsoluteLayout.LayoutBounds="1,1,1,1" AbsoluteLayout.LayoutFlags="All" x:Name="bigImg" />
</ratio:ContentRatioContainer>
<artina:Button Margin="10,10,10,10" x:Name="ImgZoom" Clicked="EnlargeImage" HorizontalOptions="End" VerticalOptions="Start" Image="IncreaseImageIcon.png" BackgroundColor="Transparent" HeightRequest="30" WidthRequest="30"/>
<StackLayout Grid.Row="1" Orientation="Horizontal" BackgroundColor="#ede8db" Margin="0" Padding="30,0,30,0" x:Name="iconStack" >
<Label HorizontalTextAlignment="Center" Text="{x:Static ratio:FontAwesome.WHEELCHAIR_ALT}" Style="{StaticResource FontIcon}" TextColor="Black" FontSize="30" />
<Label HorizontalTextAlignment="Center" Text="{x:Static ratio:FontAwesome.CUTLERY}" Style="{StaticResource FontIcon}" TextColor="Black" FontSize="30" />
<Label HorizontalTextAlignment="Center" Text="{x:Static ratio:FontAwesome.WIFI}" Style="{StaticResource FontIcon}" TextColor="Black" FontSize="30" />
<Label HorizontalTextAlignment="Center" Text="{x:Static ratio:FontAwesome.CAMERA}" Style="{StaticResource FontIcon}" TextColor="Black" FontSize="30" />
<Label HorizontalTextAlignment="Center" Text="{x:Static ratio:FontAwesome.MAP}" Style="{StaticResource FontIcon}" TextColor="Black" FontSize="30" />
<!--<Label HorizontalTextAlignment="End" HorizontalOptions="End" Text="{x:Static ratio:FontAwesome.ARROW_DOWN}" Style="{StaticResource FontIcon}" TextColor="Gray" FontSize="30" />-->
<artina:Button x:Name="openStack" HorizontalOptions="End" VerticalOptions="Start" Text="{x:Static ratio:FontAwesome.ARROW_DOWN}"
Style="{StaticResource FontIcon}" BackgroundColor="Transparent" HeightRequest="30" WidthRequest="30" Clicked="btnClicked" TextColor="Gray"/>
</StackLayout>
<StackLayout Grid.Row="2" x:Name="articleInfo" Padding="30,0,30,0">
<StackLayout x:Name="TopLayout">
<StackLayout Orientation="Horizontal">
<Label HorizontalTextAlignment="Center" Text="{x:Static ratio:FontAwesome.WHEELCHAIR_ALT}" Style="{StaticResource FontIcon}" TextColor="Black" FontSize="30" />
<Label Text="Address" VerticalOptions="Center" HorizontalOptions="StartAndExpand" />
</StackLayout>
</StackLayout>
</StackLayout>
</Grid>
</ContentPage.Content>

The order in which you add your elements in XAML matters, so if you want to have something at the top, just add it and the end in XAML. So firstly add row 1 and row 2, and then after it row 1 with your image.
Alternatively you can call RaiseChild method on your container (grid) with the view you want to bring to the front as a parameter.

I am using swipecards in my xamarin form project.
This is my Xaml code--
<swipecards:CardStackView Grid.Row="0" x:Name="CardStackView" ItemsSource="{Binding Cards[0]}" Swiped="CardStackView_Swiped" StartedDragging="CardStackView_dragged" Margin="20" BackgroundColor="#E0E0E0">
<swipecards:CardStackView.ItemTemplate>
<DataTemplate>
<StackLayout Padding="0,2,0,2" x:Name="layout">
<StackLayout Orientation="Horizontal" VerticalOptions="Start">
<Label Text="{Binding .FullJobName}" HorizontalOptions="Start" Style="{DynamicResource TitleStyle}" />
<Grid>
<Image x:Name="MyImage" Source="{Binding .CompanyProfImg}" HorizontalOptions="End" HeightRequest="50" WidthRequest="50" />
<ActivityIndicator BindingContext="{x:Reference MyImage}" IsRunning="{Binding IsLoading}}"/>
</Grid>
</StackLayout>
<StackLayout HorizontalOptions="StartAndExpand">
<Label Text="{Binding .LocationName}" HorizontalOptions="StartAndExpand" Style="{DynamicResource SubtitleTextStyle}" />
<Label Text="{Binding .TotalSalary }" Style="{DynamicResource SubtitleTextStyle}" />
</StackLayout>
<StackLayout>
<Label Text="Comapny Name" Style="{DynamicResource TitleStyle}" HorizontalOptions="StartAndExpand"/>
<Label Text="{Binding .CompanyName}" Style="{DynamicResource ListItemTextStyle}" HorizontalOptions="StartAndExpand"/>
</StackLayout>
<StackLayout>
<Label Text="Key Skills" Style="{DynamicResource TitleStyle}" HorizontalOptions="StartAndExpand"/>
<Label Text="{Binding .Skills}" Style="{DynamicResource ListItemTextStyle}" HorizontalOptions="StartAndExpand"/>
</StackLayout>
<StackLayout>
<Label Text="Job Description" FontAttributes="Bold" FontSize="14" HorizontalOptions="StartAndExpand"/>
<Label Text="{Binding .Description}" Style="{DynamicResource ListItemTextStyle}" HorizontalOptions="StartAndExpand"/>
</StackLayout>
<BoxView Color="#DCDCDC" WidthRequest="160" HeightRequest="2" />
<StackLayout Orientation="Horizontal" HorizontalOptions="StartAndExpand" VerticalOptions="EndAndExpand">
<Label Text="{Binding .Postedby}" HorizontalOptions="Start" Style="{DynamicResource CaptionStyle}" />
<!--<Image x:Name="fb_imageTag" Source="facebooklogo.png">
<Image.GestureRecognizers>
<TapGestureRecognizer Tapped="ReadMore_Clicked" />
</Image.GestureRecognizers>
</Image>-->
<Button Text="Delete" Clicked="DeleteClicked"/>
</StackLayout>
</StackLayout>
</DataTemplate>
</swipecards:CardStackView.ItemTemplate>
</swipecards:CardStackView>
The problem is the button is not clicking inside the Data template.
Can you guys please help me what should i do now?
Thank you..

Hard to say what is wrong. Could you show full xaml code, view code behind and your viewmodel
Is DeleteClicked is in code behind or in VM?

I am creating a mobile app using Xamarin form using PCL. A text box always hides from the keyboard in iOS, but this part is working perfectly in Android. Below is my Xaml
<?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="MYDriver.List"
WidthRequest="20" BackgroundColor="#ffffff" >
<ContentPage.Content >
<StackLayout x:Name="InBoundlayout">
<StackLayout x:Name="ToolBar" Style="{StaticResource ToolbarOuter}" Padding="0,20,0,0">
<StackLayout Style="{StaticResource ToolbarInner1}">
<Image Source="back3.png" >
<Image.GestureRecognizers>
<TapGestureRecognizer
Tapped="Back_Clicked" />
</Image.GestureRecognizers>
</Image>
</StackLayout>
<StackLayout Style="{StaticResource ToolbarInner1} " >
<Image Source="home3.png">
<Image.GestureRecognizers>
<TapGestureRecognizer
Tapped="Home_Clicked" />
</Image.GestureRecognizers>
</Image>
</StackLayout>
<StackLayout Style="{StaticResource ToolbarInner1}" >
<Image x:Name="PicTorchLight" >
<Image.GestureRecognizers>
<TapGestureRecognizer Tapped="TorchLight_Clicked" />
</Image.GestureRecognizers>
</Image>
</StackLayout>
<StackLayout Style="{StaticResource ToolbarInner2}">
<Label x:Name="lblUserName" Style="{StaticResource ToolbarLabel}" />
<Image Source="logout.png">
<Image.GestureRecognizers>
<TapGestureRecognizer
Tapped="Logout_Clicked" />
</Image.GestureRecognizers>
</Image>
</StackLayout>
</StackLayout>
<StackLayout x:Name="layoutHead" Style="{StaticResource HeadColour}" Margin="0,-5">
<StackLayout Spacing="0" Orientation="Horizontal" HorizontalOptions="Start">
<Label Text=" #" Style="{StaticResource HeadForAllorderDetails}" />
</StackLayout>
<StackLayout Spacing="0" Orientation="Horizontal" HorizontalOptions="EndAndExpand">
<Label Text="Order No" Style="{StaticResource HeadForAllorderDetails}" />
</StackLayout>
<StackLayout Spacing="0" Orientation="Horizontal" HorizontalOptions="StartAndExpand">
<Label Text=" Ref" Style="{StaticResource HeadForAllorderDetails}" />
</StackLayout>
<StackLayout Spacing="0" Orientation="Horizontal" HorizontalOptions="EndAndExpand">
<Label Text="Dropoff" Style="{StaticResource HeadForAllorderDetails}" />
</StackLayout>
<StackLayout Spacing="0" Orientation="Horizontal" HorizontalOptions="EndAndExpand">
<Label Text=" Items" Style="{StaticResource HeadForAllorderDetails}" />
</StackLayout>
<StackLayout Spacing="0" Orientation="Horizontal" HorizontalOptions="EndAndExpand">
<Label Text="Status" Style="{StaticResource HeadForAllorderDetails}" />
</StackLayout>
</StackLayout>
<StackLayout x:Name="listViewOredr1">
<ListView x:Name="listViewOredr" ItemTapped="OnActivitySelected" HasUnevenRows="True" >
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Frame HasShadow="True" OutlineColor="Silver" Padding="3">
<Grid BackgroundColor="{Binding RowColour}" ColumnSpacing="2" Padding="2" >
<StackLayout x:Name="rr" Orientation="Horizontal" HeightRequest="35" BackgroundColor="{Binding RowColour}" Padding="10">
<StackLayout Spacing="0" BackgroundColor="{Binding RowColour}" Orientation="Horizontal" HorizontalOptions="Start">
<Label FontSize="10" TextColor="#707070" Text="{Binding DROPROUTEPOS_}" HorizontalOptions="StartAndExpand" VerticalOptions="Center"/>
</StackLayout>
<StackLayout Spacing="0" BackgroundColor="{Binding RowColour}" Orientation="Horizontal" HorizontalOptions="EndAndExpand">
<Label FontSize="10" TextColor="#707070" Text="{Binding ORDERNUM}" HorizontalOptions="StartAndExpand" VerticalOptions="Center"/>
</StackLayout>
<StackLayout Spacing="0" BackgroundColor="{Binding RowColour}" Orientation="Horizontal" HorizontalOptions="EndAndExpand">
<Label FontSize="10" TextColor="#707070" Text="{Binding REF}" HorizontalOptions="StartAndExpand" VerticalOptions="Center" />
</StackLayout>
<StackLayout Spacing="0" BackgroundColor="{Binding RowColour}" Orientation="Horizontal" HorizontalOptions="EndAndExpand">
<Label FontSize="10" TextColor="#707070" Text="{Binding DROPOFF}" HorizontalOptions="StartAndExpand" VerticalOptions="Center" />
</StackLayout>
<StackLayout Spacing="0" BackgroundColor="{Binding RowColour}" Orientation="Horizontal" HorizontalOptions="EndAndExpand">
<Label FontSize="10" TextColor="#707070" Text="{Binding ItemScanStatus}" HorizontalOptions="StartAndExpand" VerticalOptions="Center" />
</StackLayout>
<StackLayout Spacing="0" BackgroundColor="{Binding RowColour}" Orientation="Horizontal" HorizontalOptions="EndAndExpand">
<Image Aspect="AspectFit" HorizontalOptions="StartAndExpand" VerticalOptions="Center" HeightRequest = "20" WidthRequest="20" Source = "{Binding ImageStatus}" />
</StackLayout>
</StackLayout>
</Grid>
</Frame>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
<StackLayout x:Name="layoutouterFrame" BackgroundColor="Green" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand">
<Frame Padding = "5" BackgroundColor="#ffffff">
<StackLayout Orientation="Horizontal">
<Grid x:Name="grid">
</Grid>
</StackLayout>
</Frame>
</StackLayout>
<StackLayout x:Name="layoutForBluetooth" HeightRequest = "200" BackgroundColor="#5DCBEE" Orientation="Horizontal" HorizontalOptions="FillAndExpand">
<Frame HorizontalOptions="FillAndExpand" OutlineColor="Black" HasShadow="True">-->
<Grid>
<Label Text="Scan Your Barcode" x:Name="lblDriverNumber" TextColor="Black" FontSize="Medium" HorizontalOptions="FillAndExpand" Margin="0,10" />
<Entry x:Name="txtentry" FontSize="Medium" TextColor="Black" WidthRequest="400" HorizontalOptions="FillAndExpand" VerticalOptions="CenterAndExpand" Margin="0,10" />
</Grid>
</Frame>
</StackLayout>
</StackLayout>
</ContentPage.Content>
</ContentPage>
Can you please tell me how to stop the keyboard to hide the text box that is <Entry x:Name="txtentry" in above XAML.

It's quite a typical problem on iOS and there's a ready nuget plugin which you just need to import to your app and initialize. It will check whether the keyboard is not hiding the edited textbox and move the whole page up if it's needed.
https://www.nuget.org/packages/Xam.Plugins.Forms.KeyboardOverlap/

When trying to initalize this contentpage my code crashes. Everything works fine except the static resources, I've tried uncommenting the rest and it's only a problem with the static resource. Only the commented out code doesn't work.
I don't use the OnPlatform requirement
<?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="ASFT.IssueManager.LoginPage" Padding="10">
<ContentPage.Resources>
<ResourceDictionary>
<x:String x:Key="Labelfont">Medium</x:String>
<x:String x:Key="Titlefont">Large</x:String>
</ResourceDictionary>
</ContentPage.Resources>
<StackLayout Orientation="Vertical" VerticalOptions="Center" HorizontalOptions="FillAndExpand" Spacing="10" >
<StackLayout Orientation="Vertical" VerticalOptions="Start" HorizontalOptions="Center" Spacing="10" WidthRequest="350">
<Label Text="Login" VerticalOptions="Center" HorizontalOptions="Start" FontSize="{StaticResource Titlefont}"/>
<BoxView HeightRequest="5" Color="Gray"/>
<!--<Label Text="Host" VerticalOptions="Center" HorizontalOptions="Start" FontSize="{StaticResource Labelfont}"/>
<Entry Placeholder="Host/URL" Text="{Binding Host}" />
<Label Text="UserName" VerticalOptions="Center" HorizontalOptions="Start" FontSize="{StaticResource Labelfont}"/>
<Entry Placeholder="User name / Account" Text="{Binding Username}" />
<Label Text="Password" VerticalOptions="Center" HorizontalOptions="Start" FontSize="{StaticResource Labelfont}"/>
<Entry Placeholder="Password" IsPassword="true" Text="{Binding Password}" />
<BoxView HeightRequest="5" Color="Gray"/>-->
<Button x:Name="btnLogin" Text="Login" HorizontalOptions="FillAndExpand" Clicked="OnButtonLogin" WidthRequest="100"/>
</StackLayout>
</StackLayout>
</ContentPage>

You can use a Style to set the FontSize via the NamedSize enum.
Change ResourceDictionary to use styles:
<ResourceDictionary>
<Style x:Key="Labelfont" TargetType="Label">
<Setter Property="FontSize" Value="Small" />
</Style>
<Style x:Key="Titlefont" TargetType="Label">
<Setter Property="FontSize" Value="Large" />
</Style>
</ResourceDictionary>
Change your controls to reference the styles:
<StackLayout Orientation="Vertical" VerticalOptions="Center" HorizontalOptions="FillAndExpand" Spacing="10" >
<StackLayout Orientation="Vertical" VerticalOptions="Start" HorizontalOptions="Center" Spacing="10" WidthRequest="350">
<Label Text="Login" VerticalOptions="Center" HorizontalOptions="Start" Style="{StaticResource Titlefont}"/>
<BoxView HeightRequest="5" Color="Gray"/>
<Label Text="Host" VerticalOptions="Center" HorizontalOptions="Start" Style="{StaticResource Labelfont}"/>
<Entry Placeholder="Host/URL" />
<Label Text="UserName" VerticalOptions="Center" HorizontalOptions="Start" Style="{StaticResource Labelfont}"/>
<Entry Placeholder="User name / Account" />
<Label Text="Password" VerticalOptions="Center" HorizontalOptions="Start" Style="{StaticResource Labelfont}"/>
<Entry Placeholder="Password" IsPassword="true" />
<BoxView HeightRequest="5" Color="Gray"/>
<Button x:Name="btnLogin" Text="Login" HorizontalOptions="FillAndExpand" WidthRequest="100"/>
</StackLayout>
</StackLayout>
Output: