Xamarin Forms include xaml file - xaml

I have a xaml file where I wrote the title.
<?xml version="1.0" encoding="UTF-8"?>
<ContentView xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
x:Class="TeenageClubWallet.Templates.Header">
<StackLayout>
<Label Text="Header!" />
</StackLayout>
I want to use this xaml file as a header in other xaml files.
Here's an example. I'm trying to include it to another xaml file:
I added a namespace: xmlns:template="clr-namespace:TeenageClubWallet.Templates"
The "template" tag is now used to include file:
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
x:Class="TeenageClubWallet.Statistics"
xmlns:template="clr-namespace:TeenageClubWallet.Templates">
<ContentPage.Content>
<template:Header/>
<StackLayout>
<Label Text="Content!" />
</StackLayout>
</ContentPage.Content>
The visual studio shows the error: "Error XLS0501 The property 'Content' is set more than once."
How can I include content from one xaml file to another xaml file ?

In this example ContentPage has two elements - template:Header and StackLayout and only one is allowed.
That is the cause of this problem. I haven't gone deeper in evaluating if there are further problems, but in the case they exist and you can't resolve them you should ask a new question.

I fixed it
To fix this, you need to insert the <template:Header/> tag inside the <StackLayout> tag.
Below is the full code:
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
x:Class="TeenageClubWallet.Statistics"
xmlns:template="clr-namespace:TeenageClubWallet.Templates">
<ContentPage.Content>
<StackLayout>
<template:Header/>
<Label Text="Content!" />
</StackLayout>
</ContentPage.Content>

Related

ResourceDictionary in a separate assembly dont works. Error Invalid URI

i get this error if i try to inovke my ResourceDictionary from a Class Libary. I follow this Post but its dont works for me. I dont know what i do wrong.
Invalid URI: Invalid port specified.
My App.xaml:
<Application xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="JoinApp.App">
<Application.Resources>
<ResourceDictionary Source="pack://application:,,,/App_Libary;component/9.Resource/test.xaml"/>
</Application.Resources>
</Application>
My XAML:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
NavigationPage.HasNavigationBar="false"
ControlTemplate="{StaticResource BaseTemplate}"
x:Class="App_Libary.Profile_Page">
<ContentView ControlTemplate="{StaticResource testcontrol}"/>
</ContentPage>
My ResourceDictionary:
<ResourceDictionary xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="App_Libary._9.Resource.test">
<ControlTemplate x:Key="testcontrol">
<Label Text="this is a test"/>
</ControlTemplate>
</ResourceDictionary>
You could do like below:
create the ResourceDictionary xaml (remove x:Class in the root attribute),for example named mytemp.xaml:
<ResourceDictionary xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
>
<ControlTemplate x:Key="testcontrol">
<Label Text="this is a test"/>
</ControlTemplate>
</ResourceDictionary>
define in your App.xaml:
i get this error if i try to inovke my ResourceDictionary from a Class Libary. I follow this Post but its dont works for me. I dont know what i do wrong.
Invalid URI: Invalid port specified.
My App.xaml:
<Application xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="JoinApp.App">
<Application.Resources>
<ResourceDictionary Source="mytemp.xaml"/> // if you have sub folder could use Source="yourfolder/mytemp.xaml"
</Application.Resources>
</Application>
then use in your page.xaml:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
NavigationPage.HasNavigationBar="false"
ControlTemplate="{StaticResource BaseTemplate}"
x:Class="App_Libary.Profile_Page">
<ContentView ControlTemplate="{StaticResource testcontrol}"/>
</ContentPage>

remove back button page xamarin xaml

show the page :
await Shell.Current.GoToAsync("HabeasData");
in HabeasData constructor I put the following:
NavigationPage.SetHasBackButton(this, false);
InitializeComponent();
Too i try this:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Title="Habeasdata"
x:Class="AppColantaDomicilios.Views.HabeasData"
NavigationPage.HasBackButton="False" >
But, it does not work, keep showing the back button.
Xamarin.Forms is updated.
I would greatly appreciate the help.
NavigationPage.SetHasBackButton(this, false); is not worked in Shell
You can use Shell.NavBarIsVisible="False" in the ContentPage like following code.
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Shell.NavBarIsVisible="False"
x:Class="App7.Views.Page1">
<ContentPage.Content>
<StackLayout>
<Label Text="Welcome to Xamarin.Forms!"
VerticalOptions="CenterAndExpand"
HorizontalOptions="CenterAndExpand" />
</StackLayout>
</ContentPage.Content>
</ContentPage>
Here is related article about it.
https://learn.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/shell/configuration#disable-the-navigation-bar
If you still want to keep the title bar and hide the back button. you can add a custom navigation bar with your stack layout. Or use following code and add a transparent png like following GIF.
Here is code.
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
x:Class="App7.Views.Page1">
<Shell.BackButtonBehavior>
<BackButtonBehavior IsEnabled="False" IconOverride="test.png"
/>
</Shell.BackButtonBehavior>
<ContentPage.Content>
<StackLayout>
<Label Text="Welcome to Xamarin.Forms!"
VerticalOptions="CenterAndExpand"
HorizontalOptions="CenterAndExpand" />
</StackLayout>
</ContentPage.Content>
</ContentPage>
Here is transparent png.

Xamarin MasterDetailPage ContentPropertyAttribute

I'm trying to learn Xamarin and I was doing a simple MasterDetailPage to run on iOS. After running the code I got this error:
Can not set the content of MasterDetailPage as it doesn't have a ContentPropertyAttribute
Below is my XAML file code snippet:
<?xml version="1.0" encoding="utf-8"?>
<MasterDetailPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:local="clr-namespace:MasterDetailLearing" x:Class="MasterDetailLearing.MainPage">
<!-- Place new controls here -->
<Label Text="Welcome to Xamarin.Forms!" HorizontalOptions="Center" VerticalOptions="CenterAndExpand" />
<MasterDetailPage.Master>
<ContentPage Padding="10" BackgroundColor="Gray" Title="Master">
<ContentPage.Content>
<StackLayout Margin="5,30,5,5">
<Label Text="Master Page"></Label>
</StackLayout>
</ContentPage.Content>
</ContentPage>
</MasterDetailPage.Master>
<MasterDetailPage.Detail>
<ContentPage Padding="10">
<ContentPage.Content>
<StackLayout Margin="5,30,5,5">
<Label Text="Detail Page"></Label>
</StackLayout>
</ContentPage.Content>
</ContentPage>
</MasterDetailPage.Detail>
</MasterDetailPage>
a MasterDetail page only has Master and Detail children. You cannot include any other content as a direct child. So your Label needs to be in either the Master or the Detail, it cannot be a direct child of the page.

Type TextBox Not Found

I am trying to create form in Xamarin and use a TextBox. When I compile the code I get the following error.
Type TextBox not found in xmlns http://xamarin.com/schemas/2014/forms
I haven't been able to find any similar issues, and this is my first Xamarin program so I'm not sure where to go from here. Is the xmlns link outdated and just not include TextBoxes?
MainPage.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"
xmlns:local="clr-namespace:HelloWorld"
x:Class="HelloWorld.MainPage">
<StackLayout>
<TextBox Width="500" Header="Email"
PlaceholderText="Enter registered email." />
</StackLayout>
</ContentPage>
Try 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"
xmlns:local="clr-namespace:HelloWorld"
x:Class="HelloWorld.MainPage">
<StackLayout>
<Label Text="Email" />
<Entry WidthRequest="500" Placeholder="Enter registered email" />
</StackLayout>
</ContentPage>

NavigationPage Wrapping causing bug in status bar

I'm experiencing a weird bug when I try to add Navigation to my CropsListPage
<?xml version="1.0" encoding="utf-8" ?>
<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-Balloney.Views"
x:Class="Balloney.Views.MainPage">
<NavigationPage Icon="carrot.png">
<x:Arguments>
<local:CropListPage/>
</x:Arguments>
</NavigationPage>
<ContentPage Icon="search.png"></ContentPage>
</TabbedPage>
And then it results in..
If I don't try to envelop it in a NavigationPage, it stays normal
Any idea what's causing this behaviour ? Before trying to hammer my way outta this and hardcoding the size of the status bar in Android, I'm looking for a way to understand the problem and prevent it. Thanks
MainPage.xaml working now
<?xml version="1.0" encoding="utf-8" ?>
<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:Balloney.Views"
x:Class="Balloney.Views.MainPage">
<local:CropListPage Icon="carrot.png"/>
<ContentPage Icon="search.png"></ContentPage>
</TabbedPage>
And the CropList xaml
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="Balloney.Views.CropListPage">
<ListView ItemsSource="{Binding CropsList}" ItemTapped="OnCropTapped">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<StackLayout Orientation="Horizontal">
<Image Source="{Binding ImageUrl}" VerticalOptions="Fill" WidthRequest="50"/>
<StackLayout HorizontalOptions="StartAndExpand">
<Label Text="{Binding Specie.Name}"/>
<Label Text="{Binding HarvestDate}" FontSize="Micro" TextColor="Black"/>
</StackLayout>
<Label Text="{Binding Location}" FontSize="Micro" TextColor="Chocolate" />
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</ContentPage>
EDIT: The error seems to be related to the ListView I have inside CropListPage because there's no bug when I switch to the Search icon Page.
The extra space in your first image is the result of the NavigationPage by default showing the Navigation bar, which can be hidden.
Here's an example of how to hide it.
Is may be because you have wrapped crop list page in a navigation page so when that is selected you get the nav bar space above.
If you select the second tab, does the space disappear?
If you add a title to crop page does it appear in the large green space?
<?xml version="1.0" encoding="utf-8" ?>
<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:Chronocrops.Views"
x:Class="Chronocrops.Views.MainPage">
<NavigationPage Icon="carrot.png" Title="Crop List">
<x:Arguments>
<local:CropListPage/>
</x:Arguments>
</NavigationPage>
<ContentPage Icon="search.png"></ContentPage>
</TabbedPage>