This is the code I have written to create the Master Detail Page:
Please check it out
<?xml version="1.0" encoding="utf-8" ?>
<MasterDetailPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="DemoApp.MenuPage" xmlns:local="clr-namespace:DemoApp.Views" MasterBehavior="Default">
<MasterDetailPage.Master>
<ContentPage Title="MenuPage" Icon="menuIcon.png" Padding="0,50,0,0">
<ContentPage.Content>
<StackLayout VerticalOptions="Start">
<Button Text="Home" />
<Button Text="Login" />
<Button Text="Logout" />
<Button Text="Exit" />
</StackLayout>
</ContentPage.Content>
</ContentPage>
</MasterDetailPage.Master>
<MasterDetailPage.Detail>
<local:Login/>
</MasterDetailPage.Detail>
</MasterDetailPage>
From Xamarin 4.0, this MasterDetailPage feature can implemented much easier using Shell. David has made a video on showing how to use Shell. His Youtube video
I've checked your code in a plain project and no errors so far, to check further the Detail page code would be needed. I mean the content of
<MasterDetailPage.Detail>
<local:Login/>
</MasterDetailPage.Detail>
Related
I created a sftabView, every SfTabItem have a ContentView so I created an other View to display it in this ContentView. so the question is how to make this happened?
This is the ContentView which I wanted to display in the ContentPage
<?xml version="1.0" encoding="utf-8" ?>
<ContentView
xmlns="http://xamarin.com/schemas/2014/forms"
x:Class="App5.Views.Self_Trainig"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
NavigationPage.HasNavigationBar="False">
<ContentView.Resources>
<ResourceDictionary>
............
</ResourceDictionary>
</ContentView.Resources>
<ContentView.Content>
<AbsoluteLayout>
...............
</AbsoluteLayout>
</ContentView.Content>
</ContentView>
and this is my ContentPage:
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:tabView="clr-namespace:Syncfusion.XForms.TabView;assembly=Syncfusion.SfTabView.XForms"
x:Class="App5.Views.Accueil">
<ContentPage.Content>
<tabView:SfTabView OverflowMode="DropDown" VisibleHeaderCount="3" BackgroundColor="White">
<tabView:SfTabItem Title="Self Training">
<tabView:SfTabItem.Content>
""the code to display it here""
</tabView:SfTabItem.Content>
</tabView:SfTabItem>
<tabView:SfTabItem Title="Contacts">
<tabView:SfTabItem.Content>
<Grid BackgroundColor="White" x:Name="ContactsGrid" />
</tabView:SfTabItem.Content>
</tabView:SfTabItem>
</tabView:SfTabView>
</ContentPage.Content>
</ContentPage>
<ContentPage
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:mynamespace=clr-namespace:App5.Views"
...>
...
<tabView:SfTabItem.Content>
<mynamespace:Self_Trainig ... />
</tabView:SfTabItem.Content>
Explanation:
Add an xmlns:... definition for the namespace your ContentView is in.
Add an element with that namespace and the class name of your ContentView. <mynamespace:Self_Trainig ... />
...: After the class name, you can add any needed attributes. Just like any other ContentView.
If you want your view to have "custom" attributes (as opposed to the standard attributes of ContentView such as BackgroundColor), that can be set in each page's XAML, then in your ContentView's code behind, you'll add BindablePropertys. Doing that correctly is beyond the scope of this answer; there are other Q&As on that topic.
is it possible to display the view form the C# code ?
i mean doing
ContentView x:Name="TheView"
and on the C# code doing something like
TheView = Self_Trainig;
i know that code doesn't work but i'm searching that kind of solution
I am trying to create this layout in Xamarin XAML but I cannot figure out how to combine TabView within a TabView. I want 3 main tabs in the bottom and for each page 1-2 subtabs. On each subtab I will need to have a ScrollView(I think thats the right element to use) with list items, which makes it even more complex. Like this picture:
Any idea or guidance of how to achieve this?
I am trying to create this layout in Xamarin XAML but I cannot figure out how to combine TabView within a TabView.
If you want to do that, you could nest a TabView in Tabbed page.
TabView:https://github.com/chaosifier/TabView
Create three tab pages in views folder.
Tabbed Page:
<?xml version="1.0" encoding="utf-8" ?>
<TabbedPage
x:Class="TabbedPageDemo.MainPage"
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:Views="clr-namespace:TabbedPageDemo.Views"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
BarBackgroundColor="Blue"
BarTextColor="White"
mc:Ignorable="d">
<Views:Tab1_Page Title="TAB1" />
<Views:Tab2_Page Title="TAB2" />
<Views:Tab3_Page Title="TAB3" />
</TabbedPage>
And then use TabView in you tab1 page.
Tab1_Page:
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage
x:Class="TabbedPageDemo.Views.Tab1_Page"
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:local="clr-namespace:Xam.Plugin.TabView;assembly=Xam.Plugin.TabView"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<ContentPage.Content>
<local:TabViewControl>
<local:TabViewControl.ItemSource>
<local:TabItem HeaderText="SUBTAB1">
<StackLayout VerticalOptions="Start" Padding="10">
<Button
BackgroundColor="White"
Text="List Item"
TextColor="Black"/>
</StackLayout>
</local:TabItem>
<local:TabItem HeaderText="SUBTAB2">
<Image Source="pink.jpg" />
</local:TabItem>
</local:TabViewControl.ItemSource>
</local:TabViewControl>
</ContentPage.Content>
</ContentPage>
Please note, if you want to make the tabs in tabbed page in the bottom. Add the code below in your MainPage.
On<Android>().SetToolbarPlacement(ToolbarPlacement.Bottom);
You could download the code sample from GitHub in TabbedPage_NestedTabView/TabbedPageDemo
https://github.com/WendyZang/Test.git
I want to add Page/View before TabbedPage, how can I do that?
<?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:views="clr-namespace:TestProject.TabbedPages"
x:Class="TestProject.ItemPage"
Title = "Home Page">
<TabbedPage.Children>
<views:AprovedLeaves Title="Approved leaves"/>
<views:PendingLeaves Title="Pending leaves"/>
<views:DeniedLeaves Title="Denied leaves"/>
</TabbedPage.Children>
</TabbedPage>
Above code showing output like this
But I need some space before tabs. Like this
I would suggest you use the Segmented Control Plugin for this look for Plugin.Segmentedon Nuget and install Plugin.SegmentedControl.NetStandard
Initialize it on iOS something like this:
SegementedControlRenderer.Initialize();
Then use it in XAML like this
<control:SegmentedControl x:Name="SegmentedControl" SelectedSegment="{Binding SegmentSelection}" TintColor="White" SelectedTextColor="BlueViolet" DisabledColor="Gray" Margin="8,8,8,8">
<control:SegmentedControl.Children>
<control:SegmentedControlOption Text="Item 1" />
<control:SegmentedControlOption Text="Item 2" />
<control:SegmentedControlOption Text="Item 3" />
<control:SegmentedControlOption Text="Item 4" />
</control:SegmentedControl.Children>
</control:SegmentedControl>
A step by step guide is available on this C# corner blog
Feel free to revert in case of queries
I want to open this url(http://localhost:8080/) when application is launched. Can any one please help i'm new in xamarin And my MainPage.xaml is :
<?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:App3"
x:Class="App3.MainPage">
<StackLayout>
<!-- Place new controls here -->
<Label Text="Welcome to Xamarin.Forms!"
HorizontalOptions="Center"
VerticalOptions="CenterAndExpand" />
<WebView Source="http://localhost:8080/" VerticalOptions="CenterAndExpand"/>
</StackLayout>
</ContentPage>
What URL are you trying to open? Note that localhost on your device means that you want to show a webpage that is hosted on your device. If you are trying to show a webpage hosted on your development machine, please figure out the network address that is reachable from your device. It will probably start with 192.168.x.x or 10.x.x.x.
I have a test page in Xamarin.Forms and it gets me this error, how can I fix this ?
Property Content is null or is not IEnumerable
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="Project1.Page1">
<ContentPage.Content>
<Label Text="Page"></Label>
<Editor Text="I am an Editor" />
</ContentPage.Content>
</ContentPage>
The Content property is of type View. You cannot have two views into it. Replace it with
<StackLayout >
<Label Text="Page"></Label>
<Editor Text="I am an Editor" />
<StackLayout>
If anyone else lands here from google and the above wasn't the fix. For me it was because I had a view with a Grid.Row="0" property set even though I accidentally placed it outside the bounds of the actual grid.