How to Implement splitview in already present xamarin application? - xamarin

I have one Xamarin Application, while developing we only focused on look and feel for iphone. Now we want to implement SplitView for some page in our application.
I have followed steps given in below link :
https://devblogs.microsoft.com/xamarin/bringing-xamarin-forms-apps-to-tablets/
But it is giving run time error :
System.InvalidOperationException: Title property must be set on Master
page
I already set title as given in link inside searchTabletpage.cs file.
public SearchTabletPage()
{
Title = "Details";
this.MasterBehavior = MasterBehavior.Default;
Master = new SearchPage(true);
Detail = new ContentPage()
{
Content = new StackLayout
{
VerticalOptions = LayoutOptions.Center,
HorizontalOptions = LayoutOptions.Center,
Children = {
new Label { Text = "Select a Record", FontSize = Device.GetNamedSize(NamedSize.Large, typeof(Label)) }
}
}
};
((SearchPage)Master).ItemSelected = (searchDetail) =>
{
BusinessDetailPage businessDetail = new BusinessDetailPage(searchDetail.InfogroupId,searchDetail.Distance,searchDetail.FullAddress,searchDetail.Phone);
Detail = businessDetail;
if (Device.RuntimePlatform != Device.UWP)
{
IsPresented = false;
}
};
IsPresented = true;
}
}
Please help me.
Thanks in Advance.

As the error says, you need to set the title for Master page.
Master = new SearchPage(true)
{
Title = "Search Page"
};

The tutorial you followed is using Master- Detailed Page, it is implemented by code behind .
Check official sample here : https://github.com/xamarin/xamarin-forms-samples/tree/master/Navigation/MasterDetailPage/MasterDetailPageNavigation/CS

Related

Detect Phone Number & Link in xamarin.Form

assume we have the following text :
Contact us on 015546889 or email#hotmail.com
How I can display the above text in same label in xamarin.forms and handle click on email by send email and handle phone call by click on the number.
I can use the the following code to make clickable label
Label label = new Label;
label.GestureRecognizers.Add(new TapGestureRecognizer()
{
Command = new Command(() => {
//do some function here
})
});
How to hyperlink same as messaging app or Whatsapp application
After a lot of search i found the perfect solution Here :
https://theconfuzedsourcecode.wordpress.com/tag/xamarin-hyperlink-label/
Hope this will help others :)
Check out the Label element in Forms9Patch. It has a HtmlText property that allows simple markup.
using System;
using Xamarin.Forms;
namespace Forms9PatchDemo
{
public class LabelLink : ContentPage
{
public LabelLink()
{
var label = new Forms9Patch.Label
{
HtmlText = "Contact us on <a id=\"phone\" href=\"tel:+353015546889\">015546889</a> or <a id=\"email\" href=\"mailto:email#hotmail.com\">email#hotmail.com</a>"
};
label.ActionTagTapped += (object sender, Forms9Patch.ActionTagEventArgs e) =>
{
var id = e.Id;
var href = e.Href;
var uri = new Uri(e.Href);
Device.OpenUri(uri);
};
Content = new StackLayout
{
VerticalOptions = LayoutOptions.Center,
Children = {
new Label { Text = "Forms9Patch.Label.HtmlText <a> example" },
new BoxView { BackgroundColor = Color.Black, HeightRequest = 1 },
label
}
};
}
}
}
Note that the above example won't work on iOS emulators because the tel: and mailto: schemes are not supported. It does work on actual iOS devices.

Cannot implicily convert type to 'Xamarin.Forms.Page'

I have a Xamarin Forms project, I have updated Xamarin and this is the new App.cs
public App()
{
// The root page of your application
var content = new ContentPage
{
Title = "Proje1",
Content = new StackLayout
{
VerticalOptions = LayoutOptions.Center,
Children = {
new Label {
HorizontalTextAlignment = TextAlignment.Center,
Text = "Welcome to Xamarin Forms!"
}
}
}
};
MainPage = new NavigationPage(content);
}
I get this error
Cannot implicily convert type 'Proje1.Views.View1' to 'Xamarin.Forms.Page'
when I make this
MainPage = new View1();
I was pointing like this before, now how should I set the initial page in App.cs?
I assume View1 inherit from ContentView somehow, so what you need is embed that in a Page so it's fit to be used as Application.MainPage.
MainPage = new ContentPage {
Content = new View1()
};

Image- Xamarin.Form

I have implemented a login page and now I want to add a header image; however, image does not show up on the view.
public LoginView ()
{
InitializeComponent ();
Title= "Login";
Content = new StackLayout {
Spacing = 20,
Padding = 50,
VerticalOptions = LayoutOptions.Center,
Children = {
new Image {Source="headerImage.jpg"},
(username = new Entry { Placeholder = "Username" }),
(password = new Entry { Placeholder = "Password", IsPassword = true }),
(button=new Button { Text = "Login", TextColor = Color.White, BackgroundColor = Color.FromHex ("77D065")})
}
};
button.Clicked += Login;
}
Images need to be placed in the platform projects (iOS, Android, etc) not the shared Forms project. See Working with Images for details.
"Images can be shared across platforms with Xamarin.Forms, they can be loaded specifically for each platform, or they can be downloaded for display."

Master Detail Page on the right side using Xamarin.Forms

I've created a master detail page on the left side using Xamarin.Forms, how about creating the same for the right side?
Below is my sample code for the left slider menu;
public class App
{
static MasterDetailPage MDPage;
public static Page GetMainPage()
{
return MDPage = new MasterDetailPage {
Master = new ContentPage {
Title = "Master",
BackgroundColor = Color.Silver,
Icon = Device.OS == TargetPlatform.iOS ? "menu.png" : null,
Content = new StackLayout {
Padding = new Thickness(5, 50),
Children = { Link("A"), Link("B"), Link("C") }
},
},
Detail = new NavigationPage(new ContentPage {
Title = "A",
Content = new Label { Text = "A" }
}),
};
}
static Button Link(string name)
{
var button = new Button {
Text = name,
BackgroundColor = Color.FromRgb(0.9, 0.9, 0.9)
};
button.Clicked += delegate {
MDPage.Detail = new NavigationPage(new ContentPage {
Title = name,
Content = new Label { Text = name }
});
MDPage.IsPresented = false;
};
return button;
}
}
This does not exists in the Xamarin.Forms controls set, but you can create your own, with renderers for each platform.
You'll find the required information on http://developer.xamarin.com/guides/cross-platform/xamarin-forms/custom-renderer/
Solution here
this is now supported in xamarin forms 3.0 and up, NO custom renderers
needed !! or third party libraries.
the trick is to force the layout to RTL,
while flow direction works, its hard to make the top nav bar to follow,
below is the solution for that problem, it works... let me know if you face any issues on older ios versions IOS8 and less.
xamarin forms RTL master details page with icon RTL/LTR hamburger
You can make it by ToolbarItems in Xamarin Forms
ToolbarItems will appear in right side.
You can find more info from the following links :
http://codeworks.it/blog/?p=232

How can I create a drawer / slider menu with Xamarin.Forms?

How do I create an a slider menu using Xamarin.Forms? Is it baked in or something custom?
You create a new class which contains all the definitions for both the Master - i.e. the menu - and the Detail - i.e. the main page. I know, it sounds back-to-front, but for example..
using System;
using Xamarin.Forms;
namespace testXamForms
{
public class HomePage : MasterDetailPage
{
public HomePage()
{
// Set up the Master, i.e. the Menu
Label header = new Label
{
Text = "MENU",
Font = Font.BoldSystemFontOfSize(20),
HorizontalOptions = LayoutOptions.Center
};
// create an array of the Page names
string[] myPageNames = {
“Main”,
“Page 2”,
“Page 3”,
};
// Create ListView for the Master page.
ListView listView = new ListView
{
ItemsSource = myPageNames,
};
// The Master page is actually the Menu page for us
this.Master = new ContentPage
{
Title = "The Title is required.",
Content = new StackLayout
{
Children =
{
header,
listView
},
}
};
// Define a selected handler for the ListView contained in the Master (ie Menu) Page.
listView.ItemSelected += (sender, args) =>
{
// Set the BindingContext of the detail page.
this.Detail.BindingContext = args.SelectedItem;
Console.WriteLine("The args.SelectedItem is
{0}",args.SelectedItem);
// This is where you would put your “go to one of the selected pages”
// Show the detail page.
this.IsPresented = false;
};
// Set up the Detail, i.e the Home or Main page.
Label myHomeHeader = new Label
{
Text = "Home Page",
HorizontalOptions = LayoutOptions.Center
};
string[] homePageItems = { “Alpha”, “Beta”, “Gamma” };
ListView myHomeView = new ListView {
ItemsSource = homePageItems,
};
var myHomePage = new ContentPage();
myHomePage.Content = new StackLayout
{
Children =
{
myHomeHeader,
myHomeView
} ,
};
this.Detail = myHomePage;
}
}
}
It is built in: MasterDetailPage. You'd set the Detail and Master properties of it to whatever kinds of Pages you'd like. I found Hansleman.Forms to be quite enlightening.
My minimum example (as posted here) is as follows:
public class App
{
static MasterDetailPage MDPage;
public static Page GetMainPage()
{
return MDPage = new MasterDetailPage {
Master = new ContentPage {
Title = "Master",
BackgroundColor = Color.Silver,
Icon = Device.OS == TargetPlatform.iOS ? "menu.png" : null,
Content = new StackLayout {
Padding = new Thickness(5, 50),
Children = { Link("A"), Link("B"), Link("C") }
},
},
Detail = new NavigationPage(new ContentPage {
Title = "A",
Content = new Label { Text = "A" }
}),
};
}
static Button Link(string name)
{
var button = new Button {
Text = name,
BackgroundColor = Color.FromRgb(0.9, 0.9, 0.9)
};
button.Clicked += delegate {
MDPage.Detail = new NavigationPage(new ContentPage {
Title = name,
Content = new Label { Text = name }
});
MDPage.IsPresented = false;
};
return button;
}
}
An example solution is hosted on GitHub.
On iOS the result looks like this (left: menu open, right: after clicking on "B"):
Note that you need to add the menu icon as a resource in your iOS project.
If you are looking for simple example of MasterDetailPage please have a look at my sample repo at GitHub. Very nice example is also presented here
Slideoverkit is a great plugin available for Xamarin Forms. There is a github to see free samples and you could find documentation about it here.

Resources