I'm developing a xamarin.forms app for my company but I have a stranger problem.
When I try to load in a stackLayout another content page, xamarin.forms doesn't load correctly the page. Probably because the page that I try to load is too big, infact if I try to load a smaller page It works correctly. (I Can't load a smaller page because I need to get a lot of data from user).
BigPage bigpage = new BigPage(defaultData);
stackLayout.Children.Clear();
stackLayout.Children.Add(bigpage);
This is what I see
In your opinion, what is the best way to solve this problem?
When the page does not load correctly, if I click on a component that opens the keyboard (like <entry>), the system loads the page correctly even if it is big.
I find a solution. It's not the best solution but it works.
It was my XAML code:
<ScrollView>
<StackLayout>
<StackLayout x:Name="stackLayout" Padding="15" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" BackgroundColor="GhostWhite" />
</StackLayout>
</ScrollView>
And It is my C# code:
BigPage bigpage = new BigPage(defaultData);
stackLayout.Children.Clear();
stackLayout.Children.Add(bigpage);
In order to solve this problem I add in the end of the page an empty label. In this way I can load the page without problem.
<ScrollView>
<StackLayout>
<StackLayout x:Name="stackLayout" Padding="15" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" BackgroundColor="GhostWhite" />
<Label Text=" " HorizontalOptions="End"/>
</StackLayout>
</ScrollView>
Related
Im trying to be methodical in my aproach to this school project but I am having XAML difficulties. So far I have been able to get my main page to look exactly how I want it to except for not being able to print any data using a list.view with a basic test string.
Heres the entire page cs file: https://gist.github.com/GermanHoyos/2ffed121e9d9b7026e0b1c6f36c2ce9a
Heres an image of the code in question(specificaly line 85):
Souldnt line 85 appear inside of the List.view as "test".
The reason im trying to get the string "test" to appear in the bottom most box is because eventually I would like to populate an entire list of data in this bottom most section. But I cant begin to even try things like {binding var} if I cant get a basic string to apear first.
Any help would be appreciated!
Heres list code:
<ListView x:Name = "fullViewOfTermsCourses"
BackgroundColor="PowderBlue"
HeightRequest="1"
>
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell IsEnabled="True">
<StackLayout Orientation="Horizontal" HorizontalOptions="CenterAndExpand">
<Label Text="test" VerticalOptions="CenterAndExpand" TextColor="Blue"/>
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
I am trying to use Lottie to show animations, but I have a problem when I debug it for Android:
LottieAnimationView not displayed because it is too large to fit into a software layer (or drawing cache), needs 9072000 bytes, only 8294400 available
My XAML code:
<ContentPage.Content>
<StackLayout VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">
<forms:AnimationView
x:Name="AnimationView"
Animation="data.json"
AutoPlay="True" Loop="true"
VerticalOptions="FillAndExpand"
HorizontalOptions="FillAndExpand"
Scale="0.2"/>
</StackLayout>
Can anyone help me to fix this problem?
you need to change the export settings of the animation in AfterEffects, to fit the software layer limit
Ok, this is a little strange, but I need to take a screenshot of a list of items in Xamarin. The problem is that I'm using a ListView and it only renders about 5 items. I need to render all elements in the list. I don't care if it's smaller on-screen; I just want to take a screenshot of the view and be able to share it.
This is my .xaml:
<BoxView HorizontalOptions="FillAndExpand" HeightRequest="0.5" Color="Gray"/>
<controls:CustomListView x:Name="list"
ItemsSource="{Binding List}"
HeightRequest="1000" VerticalOptions="Fill"
HasUnevenRows="True">
<x:Arguments>
<ListViewCachingStrategy>RecycleElement</ListViewCachingStrategy>
</x:Arguments>
<controls:CustomListView.ItemTemplate>
<DataTemplate>
<cell:ItemViewCell></cell:ItemViewCell>
</DataTemplate>
</controls:CustomListView.ItemTemplate>
</controls:CustomListView>
<BoxView HorizontalOptions="FillAndExpand" HeightRequest="0.5" Color="Gray"/>
This is for Android.
In the code behind you something like this on the OnAppearing method
list.HeightRequested = list.ItemSource.Count * list.RowHeight;
you can also try to do the same thing on the CustomList's OnPropertyChanged where propertyName is ItemSource whatever feels best for you
I had to create pdf, it is not possible to "overlap" the boundaries of the screen, At least no with a List, I went the pdf way
I'm using the ImageButton and would like that by taking the image by source it fills every button. The problem is that the image appears small simply on the right side. I want it to occupy every button
<ContentView.Content>
<StackLayout>
<controls:ImageButton x:Name="CmdVoltar" BackgroundColor="#1C97D5" TextColor="White" FontSize="Small" WidthRequest="100" HeightRequest="40" HorizontalOptions="EndAndExpand" Margin="0,0,50,0"></controls:ImageButton>
</StackLayout>
</ContentView.Content>
CmdVoltar.Source = ImageSource.FromResource("Agmovel.Img.btnVoltar.png");
I would suggest not using the default button with images, it has several issues.
You can use a package such as https://github.com/robinmanuelthiel/flexbutton
Very good morning, I'm trying to implement the functionality when clicking the UserName the StackPanel up so that the keyboard does not hide the information. But what is not the best choice for this, I'm working on iOS and Android. Could you help me.
<?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="BackGround.BackGroundImageDemo" BackgroundImage="Avion.jpg">
<ContentPage.Content >
<StackLayout VerticalOptions="Center" Padding="5, 50, 120, 0" BackgroundColor="White" HorizontalOptions="Center">
<Entry Placeholder="UserName" PlaceholderColor="Gray" TextColor="Navy" />
<Entry Placeholder="Password" IsPassword="true" PlaceholderColor="Gray" TextColor="Navy"/>
</StackLayout>
</ContentPage.Content>
</ContentPage>
Chase application have something similar.
Chase UserName normal -
Chase in mode up stacklayout
This can be achieved using scrollview. This is simple code snippet.
<ContentPage.Content>
<ScrollView x:Name="scr">
Your Stack Layout having entry and click button
Add TapGestureRecognizer to entry control in this case it is username or password whichever you want.
How to add TapGestureRecognizer. You can look at here.
</ScrollView>
</ContentPage.Content>
Then on your code behind
field.GestureRecognizers.Add(new TapGestureRecognizer
{
Command = new Command(async () =>
{
await ScollTest();
}),
NumberOfTapsRequired = 1,
});
private async void ScollTest()
{
// Then adjust your scroll this way.
await scr.ScrollToAsync(100, 1000, true);
}
For what I have understood from your question, you want an approach to make sure that, when the keyboard pops in, it does not cover the entries and / or other relevant information in the screen, right?
The approach for that is to have your content inside a ScrollView, so the user will be able to scroll it if necessary. Also, both Android and iOS will automatically roll the screen up to the entry is visible.
I changed your example to look like this:
<?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="BackGround.BackGroundImageDemo" BackgroundImage="Avion.jpg">
<ScrollView>
<StackLayout VerticalOptions="Center" Padding="5, 50, 120, 0" BackgroundColor="White" HorizontalOptions="Center">
<Entry Placeholder="UserName" PlaceholderColor="Gray" TextColor="Navy" />
<Entry Placeholder="Password" IsPassword="true" PlaceholderColor="Gray" TextColor="Navy"/>
</StackLayout>
</ScrollView>
</ContentPage>
That is not normally how you animate items in Xamarin.Forms. Check out the BikeShare360 app on Github.
It is a beautiful app and uses the 3rd party animation libraries and custom Storyboard XAML to give a great user experience.
For example to fade up an arbitrary element in a control.
Define what you want to do:
<animations:StoryBoard
x:Key="ProfileImageAnimation"
Target="{x:Reference ProfileImage}">
<animations:FadeInAnimation
Direction="Up"
Duration="500" />
</animations:StoryBoard>
What event do you want to trigger the animation:
<ContentPage.Triggers>
<EventTrigger Event="Appearing">
<triggers:BeginAnimation
Animation="{StaticResource ProfileImageAnimation}" />
</EventTrigger>
</ContentPage.Triggers>
The element you are going to effect:
<ctrl:UserProfileImageControl
WidthRequest="105"
HeightRequest="105"
BorderColor="{StaticResource ProfileGrayColorHexString}"
ProfileImage="{Binding Profile.PhotoUrl}"
UpdatePhotoCommand="{Binding UpdatePhotoCommand}"
HorizontalOptions="CenterAndExpand"
VerticalOptions="CenterAndExpand" />
All the source is available and it is not too hard to get started.
Good luck!