Just a nice and simple AppIntro for your Xamarin Forms project
- Available on Nuget: https://www.nuget.org/packages/Xam.Plugin.SimpleAppIntro
!!Install into your .net standaard project. !!
You can now create new simple sliders and add them to a SimpleAppIntro page. We support 3 types of slides at this moment, Slide/ButtonSlide/SwitchSlide
var welcomePage = new SimpleAppIntro(new List<object>() {
new Slide(new SlideConfig("Welcome", "This is a sample app showing off the new App Intro", "cup_icon.png",
null, "#FFFFFF", "#FFFFFF",
FontAttributes.Bold, FontAttributes.Italic, 24, 16)),
new ButtonSlide(new ButtonSlideConfig("Slides", "You can add slides and have a clean app intro", "cup_icon.png",
null, "Click here", null,"#FFFFFF", new Command(() => OnButtonClicked()), "#FFFFFF", "#FFFFFF",
FontAttributes.Bold, FontAttributes.Italic, 24, 16)),
new SwitchSlide(new SwitchSlideConfig("Other", "Tell your user what they can do with your app", "cup_icon.png",
null, true, new Command<bool>((value) => OnSwitchClicked(value)), "#FFFFFF", "#FFFFFF",
FontAttributes.Bold, FontAttributes.Italic, 24, 16)),
});
MainPage.Navigation.PushModalAsync(welcomePage);
You can also specify your own Lottie animated icon for each slide. Just create an AnimatedSimpleAppIntro like: We support 3 types of slides at this moment, Slide/ButtonSlide/SwitchSlide (same usage as above)
var welcomePage = new AnimatedSimpleAppIntro(new List<object>() {
new Slide(new SlideConfig("Welcome", "This is a sample app showing off the new App Intro", "world.json",
null, "#FFFFFF", "#FFFFFF",
FontAttributes.Bold, FontAttributes.Italic, 24, 16))
You can set the next properties
welcomePage.DoneText = "Finish";
welcomePage.SkipText = "Skip";
welcomePage.NextText = "Next";
welcomePage.ShowPositionIndicator = true;
welcomePage.ShowSkipButton = true;
welcomePage.ShowNextButton = true;
You can set the next colors
welcomePage.BarColor = "#607D8B";
welcomePage.SkipButtonBackgroundColor = "#FF9700";
welcomePage.DoneButtonBackgroundColor = "#8AC149";
welcomePage.NextButtonBackgroundColor = "#8AC149";
welcomePage.SkipButtonTextColor = "#FFFFFF";
welcomePage.NextButtonTextColor = "#FFFFFF";
welcomePage.DoneButtonTextColor = "#FFFFFF";
And you can also specify an image instead of the default skip/done/next buttons:
welcomePage.DoneButtonImage = "baseline_done_white_24.png";
You can use the two callback methods to get more info on the events
welcomePage.OnSkipButtonClicked = OnSkipButtonClicked;
welcomePage.OnDoneButtonClicked = OnDoneButtonClicked;
/// <summary>
/// On skip button clicked
/// </summary>
private void OnSkipButtonClicked()
{
DisplayAlert("Result", "Skip", "OK");
}
/// <summary>
/// On done button clicked
/// </summary>
private void OnDoneButtonClicked()
{
DisplayAlert("Result", "Done", "OK");
}
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent