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>
Related
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>
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
<ListView x:Name="myList" ItemTapped="OnMyItemTapped" ItemsSource="{Binding myList}">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<ViewCell.View>
<StackLayout> CONTENT HERE </StackLayout>
</ViewCell.View>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
where myList is an ObservableCollection
Desired: Displays all list items immediately at once without animation
Actual: Displays list items one at a time (similar to the add item animation)
Any ideas?
(This sequential displaying of items is significantly more noticeable when the list of items within the list view is larger)
The only way I've found to do it is to use a custom renderer.
These are the lines I'm using to disable the insert, delete and reload rows animations:
if (e.OldElement != null)
{
InsertRowsAnimation = UITableViewRowAnimation.None;
DeleteRowsAnimation = UITableViewRowAnimation.None;
ReloadRowsAnimation = UITableViewRowAnimation.None;
}
This needs to be placed in your CustomListViewRenderer that is inheriting from Xamarin forms ListViewRenderer.
I put mine in the OnElementChanged event.
You can use a platform specific property to disable animations:
<ContentPage ...
xmlns:ios="clr-namespace:Xamarin.Forms.PlatformConfiguration.iOSSpecific;assembly=Xamarin.Forms.Core">
<StackLayout Margin="20">
<ListView ios:ListView.RowAnimationsEnabled="false">
</ListView>
</StackLayout>
</ContentPage>
Read more here:
https://learn.microsoft.com/en-us/xamarin/xamarin-forms/platform/ios/listview-row-animations
I have the following XAML markup:
<ListView x:Name="wordsListView">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<ViewCell.View>
<StackLayout>
<Label Text="{Binding Keyword}" />
<Button Text="Click Me" x:Name="randomButton"></Button>
</StackLayout>
</ViewCell.View>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
And in my .xaml.cs file I have the button clicked event for the random button defined as below:
randomButton.Clicked += (object sender, EventArgs e) =>
{
a = rand.Next(words.Count);
word = words[a];
};
But somehow when I build my project I kept getting an error: The name randomButton does not exists in the current context. Can anyone tell me what I'm doing wrong and how it should be done?
You can't access any control by name or even give it a name as long as it is on template view , naming it is not appropriate as long as this control on template will be repeated on run time!
but you can access the whole control from the Sender of the click event ... and this depends on your development approach
Hope it will help others.
There is nothing wrong with your code.You can try these 2 ways:
First, save xaml file and use this.randomButton. Try if it works.
Else Clean the solution and try again. If that didn't work, restart the Visual Studio.
I am new to xamarin.forms
I have a listview that is filled from backend c# code.
I have one label and one image defined in it. And I have given x:Name property in XAML.
Now, my question is I want to access those two labels in backend c# code. But both the labels are not accessible because they are in listview. If I put label outside listview, I can access it in the code.
Please avoid syntax errors. My code works fine. I want to access these elements so that I can change style for phone and tablet.
My XAML code :
// ...
<ListView x:Name="DentistList">
<Listview.ItemTemplate>
<DataTemplate>
<ViewCell>
<Image Source="{Binding ImagePath}" x:Name="DoctorImage"/>
<Label Text="{Binding Name}" x:Name="DoctorName" />
</ViewCell>
</DataTemplate>
</Listview.ItemTemplate>
</ListView>
My c# code :
......
DentistList.ItemSource = new List<Doctor>
{
// List of items defined here like...
Name = "ABC",
ImagePath = "img1.jpg"
// Etc...
};
Now, Below this list, I want to change style(like, fontsize etc...) of label and image. But I can not access them.
I tried to access them with FindByName() method but could not do that.
So, can anyone please answer ?
Thank you in advance.
From Jason's comment, you can change the Label.FontSize and Label.TextColor using OnIdiom like so:
<Label Text="{Binding Name}" x:Name="DoctorName">
<Label.TextColor>
<OnIdiom x:TypeArguments="Color"
Phone="Yellow"
Tablet="Blue"/>
</Label.TextColor>
<Label.FontSize>
<OnIdiom x:TypeArguments="NamedSize"
Phone="Small"
Tablet="Large"/>
</Label.FontSize>
</Label>
*Edit: Example using regular integer:
<Label.FontSize>
<OnIdiom x:TypeArguments="x:Double"
Phone="20"
Tablet="30"/>
</Label.FontSize>
*Edit #2:
If you plan to use your Label.FontSize and Label.TextColor on multiple pages I would suggest adding the values into your App.xaml and then referencing them from your ContentPages (you could also just add the value to the ContentPage's ResourceDictionary if you are using the values multiple times but only on a single page):
App.xaml:
<Application xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="MyApp.App">
<Application.Resources>
<ResourceDictionary>
<Color x:Key="MyTextColor">
<Color.Accent>
<OnIdiom x:TypeArguments="Color"
Phone="Yellow"
Tablet="Blue"/>
</Color.Accent>
</Color>
<x:Double x:Key="MyFontSize">
<OnIdiom x:TypeArguments="x:Double"
Phone="20"
Tablet="30"/>
</x:Double>
</ResourceDictionary>
</Application.Resources>
</Application>
Now in your ContentPages:
<Label x:Name="DoctorName"
Text="{Binding Name}"
TextColor="{StaticResource MyTextColor}"
FontSize="{StaticResource MyFontSize}"/>
If you want to use NamedSize instead you might need to use converter that I have seen on the Xamarin Forums. Let me know if you cannot find it and I can try to look around.