Skip to content

SEO-172121-Extension-Xamarin-weblinks #97

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 5 commits into
base: hotfix/hotfix-v21.2.3
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from 2 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
34 changes: 17 additions & 17 deletions Extension/Xamarin-Extension/Create-Project.md
Original file line number Diff line number Diff line change
Expand Up @@ -22,26 +22,26 @@ To create the **Syncfusion Xamarin Application** in Visual Studio 2017, follow t
**Option 1:**
Click **Syncfusion Menu** and choose **Essential Studio for Xamarin > Create New Syncfusion Project…** in **Visual Studio**.

![Choose Syncfusion Xamarin application from Visual Studio new project dialog via Syncfusion menu](Syncfusion-Project-Templates_images/Syncfusion_Menu_ProjectTemplate.png)
![Choose Syncfusion Xamarin Extension application from Visual Studio new project dialog via Syncfusion menu](syncfusion-project-templates_images/xamarin-extension-create-project-dialog-project-application.png)

N> From Visual Studio 2019, Syncfusion menu is available under Extensions in Visual Studio menu.

![Choose Syncfusion Xamarin application from Visual Studio new project dialog via Syncfusion menu](Syncfusion-Project-Templates_images/Syncfusion_Menu_ProjectTemplate_2019.png)
![Choose Syncfusion Xamarin Extension Application from Visual Studio new project dialog via Syncfusion menu](syncfusion-project-templates_images/xamarin-extension-create-project-syncfusion-menu.png)

**Option 2:**
Choose **File > New > Project** and navigate to **Syncfusion > Cross-Platform > Syncfusion Xamarin Project Template** in **Visual Studio**.

![Choose Syncfusion Xamarin application from Visual Studio new project dialog](Syncfusion-Project-Templates_images/Syncfusion-Project-Templates-img1.jpeg)
![Choose Syncfusion Xamarin Extension application from Visual Studio new project dialog](syncfusion-project-templates_images/xamarin-extension-create-project-application.jpeg)

In Visual Studio 2019, Syncfusion Xamarin project creation wizard like below.

![Choose Syncfusion Xamarin application from Visual Studio new project dialog](Syncfusion-Project-Templates_images/Syncfusion-Project-Templates-img1_2019.png)
![Choose Syncfusion Xamarin Extension application from Visual Studio new project dialog](syncfusion-project-templates_images/xamarin-extension-create-project-new-dialog.png)

2. Click **OK** once you've given the **project name**, selected a destination location, and set the project's Framework. The Project Configuration Wizard is now displayed.

3. Choose the Project, Android, iOS, and UWP by on/off in the following Project Configuration window to configure the Syncfusion Xamarin Application.

![Syncfusion Xamarin project configuaration wizard](Syncfusion-Project-Templates_images/Syncfusion-Project-Templates-img2.jpeg)
![Syncfusion Xamarin Extension project configuaration wizard](syncfusion-project-templates_images/xamarin-extension-create-project-configuration-wizard.jpeg)

**Project Configuration:**

Expand All @@ -63,42 +63,42 @@ To create the **Syncfusion Xamarin Application** in Visual Studio 2017, follow t

N> If you want to add other Syncfusion Xamarin controls in the created Syncfusion Xamarin application, you can use our [Syncfusion Xamarin toolbox](https://help.syncfusion.com/xamarin/visual-studio-integration/toolbox-control)

![Choose Syncfusion Xamarin control](Syncfusion-Project-Templates_images/Syncfusion-Project-Templates-img4.png)
![Choose Syncfusion Xamarin extension control](syncfusion-project-templates_images/xamarin-extension-create-project-control.png)

4. The Syncfusion Xamarin Application has been created when you click **Create**.

N> Choose any one of the project type and controls from Project Configuration Wizard.

![Selected Syncfusion Xamarin control assemblies added to the UWP project](Syncfusion-Project-Templates_images/Syncfusion-Project-Templates-img13.PNG)
![Selected Syncfusion Xamarin Extension control assemblies added to the UWP project](syncfusion-project-templates_images/xamarin-extension-create-project-uwp-controls.PNG)

5. Based on the control selected, required Syncfusion NuGet/Assemblies and configuration have been added to the project.

**Net Standard /PCL**

![Selected Syncfusion Xamarin control NuGet package installed in project](Syncfusion-Project-Templates_images/Syncfusion-Project-Templates-img3.jpeg)
![Selected Syncfusion Xamarin extension control NuGet package installed in project](syncfusion-project-templates_images/xamarin-extension-create-project-installed-package.jpeg)

![Selected Syncfusion Xamarin control assemblies added to the project](Syncfusion-Project-Templates_images/Syncfusion-Project-Templates-img5.jpeg)
![Selected Syncfusion Xamarin Extension control assemblies added to the project](syncfusion-project-templates_images/xamarin-extension-create-project-control-assemblies.jpeg)

**Android**

![Selected Syncfusion Xamarin control Android NuGet package](Syncfusion-Project-Templates_images/Syncfusion-Project-Templates-img6.jpeg)
![Selected Syncfusion Xamarin Extension control Android NuGet package](syncfusion-project-templates_images/xamarin-extension-create-project-android.jpeg)

![Selected Syncfusion Xamarin control assemblies added to the Android project](Syncfusion-Project-Templates_images/Syncfusion-Project-Templates-img7.jpeg)
![Selected Syncfusion Xamarin Extension control assemblies added to the Android project](syncfusion-project-templates_images/xamarin-extension-create-project-android-project.jpeg)

**iOS**

![Selected Syncfusion Xamarin control iOS NuGet package](Syncfusion-Project-Templates_images/Syncfusion-Project-Templates-img8.jpeg)
![Selected Syncfusion Xamarin Extension control iOS NuGet package](syncfusion-project-templates_images/xamarin-extension-create-project-ios-package.jpeg)

![Selected Syncfusion Xamarin control assemblies added to the iOS project](Syncfusion-Project-Templates_images/Syncfusion-Project-Templates-img9.jpeg)
![Selected Syncfusion Xamarin Extension control assemblies added to the iOS project](syncfusion-project-templates_images/xamarin-extension-create-project-selected-assemblies.jpeg)

**UWP**

![Selected Syncfusion Xamarin control UWP NuGet package](Syncfusion-Project-Templates_images/Syncfusion-Project-Templates-img10.jpeg)
![Selected Syncfusion Xamarin Extension control UWP NuGet package](syncfusion-project-templates_images/xamarin-extension-create-project-uwp-control.jpeg)

![Selected Syncfusion Xamarin control assemblies added to the UWP project](Syncfusion-Project-Templates_images/Syncfusion-Project-Templates-img11.jpeg)
![Selected Syncfusion Xamarin Extension control assemblies added to the UWP project](syncfusion-project-templates_images/xamarin-extension-create-project-added assemblies.jpeg)

6. Then, Syncfusion licensing registration required message box will be shown if you installed the trial setup or NuGet packages since Syncfusion introduced the licensing system from 2018 Volume 2 (v16.2.0.41) Essential Studio release. Navigate to the [help topic](https://help.syncfusion.com/common/essential-studio/licensing/overview#how-to-generate-syncfusion-license-key), which is shown in the licensing message box to generate and register the Syncfusion license key to your project. Refer to this [blog](https://blog.syncfusion.com/post/Whats-New-in-2018-Volume-2-Licensing-Changes-in-the-1620x-Version-of-Essential-Studio.aspx) post for understanding the licensing changes introduced in Essential Studio.
6. Then, Syncfusion licensing registration required message box will be shown if you installed the trial setup or NuGet packages since Syncfusion introduced the licensing system from 2018 Volume 2 (v16.2.0.41) Essential Studio release. Navigate to the [help topic](https://help.syncfusion.com/common/essential-studio/licensing/overview#how-to-generate-syncfusion-license-key), which is shown in the licensing message box to generate and register the Syncfusion license key to your project. Refer to this [blog](https://www.syncfusion.com/blogs/post/whats-new-in-2018-volume-2.aspx) post for understanding the licensing changes introduced in Essential Studio.

![Syncfusion license registration required information dialog in Syncfusion Xamarin Project](Syncfusion-Project-Templates_images/Syncfusion-Project-Templates-img12.jpeg)
![Syncfusion license registration required information dialog in Syncfusion Xamarin extension Project](syncfusion-project-templates_images/xamarin-extension-create-project-license-registration.jpeg)


10 changes: 5 additions & 5 deletions Extension/Xamarin-Extension/Download-and-Installation.md
Original file line number Diff line number Diff line change
Expand Up @@ -21,16 +21,16 @@ The steps below assist you to how to install the Syncfusion Xamarin extensions f
> In Visual Studio 2017 or lower, go to Tools -> Extensions and Updates
3. On the left, click the **Online** tab and type **"Xamarin Extensions"** in the search box.

![Manage Extension](Download-and-Installation-images/ManageExtension.PNG)
![Manage Xamarin Extension](xamarin-extension-download-installation_images/xamarin-extension-manage.PNG)
4. Click the Download button in the “**Xamarin Extensions - Syncfusion**”.
5. Close all Visual Studio instances after downloading the extensions to begin the installation process. You can see the following VSIX installation prompt.

![Vsix Modify Window](Download-and-Installation-images/VSIXModify.PNG)
![Vsix Modify Window in xamarin Extension](xamarin-extension-download-installation_images/xamarin-extension-vsix-modify-window.PNG)
6. Click the **Modify** button.
7. When the installation is finished, launch the Visual Studio.
8. Now, you can use the Syncfusion extensions from Visual Studio under the Extensions menu.

![Syncfusion Xamarin Menu](Download-and-Installation-images/SyncfusionXamarinMenu.png)
![Syncfusion Xamarin extension Menu](xamarin-extension-download-installation_images/xamarin-extension-menu.png)

## Install from the Visual Studio Marketplace

Expand All @@ -40,8 +40,8 @@ The steps below illustrate how to download and install the Syncfusion Xamarin ex
2. If any Visual Studio instances are still open, close them.
3. Double-click on the downloaded VSIX file to install. You can see the VSIX installation prompts for the Visual Studio 2019 version. If Visual Studio 2019 is not installed, it will not be possible to install the extension

![Vsix Modify Window](Download-and-Installation-images/VSIXInstall.png)
![Vsix Modify and install Window in xamarin Extension](xamarin-extension-download-installation_images/xamarin-extension-vsix-install-window.png)
4. Click the **Install** button.
5. After the installation is complete, open Visual Studio 2019. You can now use Syncfusion extensions from the Visual Studio under the Extensions menu.

![Syncfusion Xamarin Menu](Download-and-Installation-images/SyncfusionXamarinMenu.png)
![Syncfusion Xamarin Menu](xamarin-extension-download-installation_images/xamarin-extension-menu.png)
14 changes: 7 additions & 7 deletions Extension/Xamarin-Extension/Essential-UI-Kit.md
Original file line number Diff line number Diff line change
Expand Up @@ -21,29 +21,29 @@ Install the appropriate [Xamarin UI Kit Extension](https://marketplace.visualstu

2. Select the **Essential UI Kit for Xamarin.Forms** from the **Solution Explorer** by right-clicking on your **Xamarin.Forms** project

![Syncfusion Essential UI Kit Context menu](Essential-UI-Kit-images/Context-Menu.png)
![Syncfusion Essential UI Kit Context menu in Xamarin extension](essential-ui-kit_images/xamarin-extension-context-menu.png)

N> The Essential UI Kit for Xamarin.Forms add-in will be shown when the project has the Xamarin.Forms NuGet package as a reference and also, Xamarin.Forms project should be a NET Standard project.

3. The Category dialogue box will then appear, with its pre-defined template.

![Add new item dialog box](Essential-UI-Kit-images/Add-New-Item-dialog-box.png)
![Add new item dialog box in xamarin Extension](essential-ui-kit_images/xamarin-extension-add-new-item-dialog-box.png)

4. Now, select the required pages from any of the specified categories.

5. If you want to edit your page name, then rename and choose projects which you want to add references.

![Edit page Name](Essential-UI-Kit-images/edit-page-name.png)
![Edit page Name in Xamarin Extension](essential-ui-kit_images/xamarin-extension-edit-page-name.png)

6. The selected pages will be added along with View, View Model, Model classes, resource files and Syncfusion NuGet package reference,

![MVVM files](Essential-UI-Kit-images/mvvm-files.png)
![MVVM files in Xamarin Extension](essential-ui-kit_images/xamarin-extension-mvvm-files.png)

![Added NuGet](Essential-UI-Kit-images/Add-NuGet.png)
![Added NuGet in Xamarin Extension](essential-ui-kit_images/xamarin-extension-add-nuget.png)

![Added Resources](Essential-UI-Kit-images/Resources.png)
![Added Resources in Xamarin Extension](essential-ui-kit_images/xamarin-extension-resources.png)

7. Then, Syncfusion licensing registration required message box will be shown if you installed the trial setup or NuGet packages since Syncfusion introduced the licensing system from 2018 Volume 2 (v16.2.0.41) Essential Studio release. Navigate to the [help topic](https://help.syncfusion.com/common/essential-studio/licensing/overview#how-to-generate-syncfusion-license-key), which is shown in the licensing message box to generate and register the Syncfusion license key to your project. Refer to this [blog](https://blog.syncfusion.com/post/Whats-New-in-2018-Volume-2-Licensing-Changes-in-the-1620x-Version-of-Essential-Studio.aspx) post for understanding the licensing changes introduced in Essential Studio.
7. Then, Syncfusion licensing registration required message box will be shown if you installed the trial setup or NuGet packages since Syncfusion introduced the licensing system from 2018 Volume 2 (v16.2.0.41) Essential Studio release. Navigate to the [help topic](https://help.syncfusion.com/common/essential-studio/licensing/overview#how-to-generate-syncfusion-license-key), which is shown in the licensing message box to generate and register the Syncfusion license key to your project. Refer to this [blog](https://www.syncfusion.com/blogs/post/whats-new-in-2018-volume-2.aspx) post for understanding the licensing changes introduced in Essential Studio.

## Run the UI template item

Expand Down
4 changes: 2 additions & 2 deletions Extension/Xamarin-Extension/Overview.md
Original file line number Diff line number Diff line change
Expand Up @@ -25,10 +25,10 @@ The Syncfusion provides the following extension supports in Visual Studio:

**No project selected in Visual Studio**

![Syncfusion Menu when No project selected in Visual Studio](Overview_images/Syncfusion_Menu_OverView1.png)
![Syncfusion Menu when No project selected in Visual Studio for Xamarin Extension](overview_images/xamarin-extension-syncfusion-menu-overView.png)

**Selected Microsoft/Syncfusion Xamarin (Xamarin.Forms) application in Visual Studio**

![Syncfusion Menu when Selected Microsoft/Syncfusion Xamarin in Visual Studio](Overview_images/Syncfusion_Menu_OverView2.png)
![Syncfusion Menu when Selected Microsoft/Syncfusion Xamarin Extension in Visual Studio](overview_images/xamarin-extension-overview-selected-microsoft.png)

N> From Visual Studio 2019, Syncfusion menu available under Extension in Visual Studio menu.
12 changes: 6 additions & 6 deletions Extension/Xamarin-Extension/Toolbox.md
Original file line number Diff line number Diff line change
Expand Up @@ -21,29 +21,29 @@ I> The Syncfusion Xamarin Toolbox is available from Essential Studio 2018 Volume

To launch the Syncfusion Toolbox from Visual Studio 2019 and later, click **Extensions** in Visual Studio menu and choose **Syncfusion > Essential Studio for Xamarin > Launch Toolbox…**

![Syncfusion Xamarin Custom Toolbox via Syncfusion menu](Toolbox_images/Syncfusion_Menu_Toolbox_2019.png)
![Syncfusion Xamarin Extension Custom Toolbox via Syncfusion menu](xamarin-extension-menu-launch.png)

**Visual Studio 2017**

To launch the Syncfusion Toolbox from Visual Studio 2017, click **Syncfusion** in Visual Studio menu and choose **Essential Studio for Xamarin > Launch Toolbox...**


![Syncfusion Xamarin Custom Toolbox via Syncfusion menu](Toolbox_images/Syncfusion_Menu_Toolbox.png)
![Syncfusion Xamarin Extension Custom Toolbox via Syncfusion menu](toolbox_images/xamarin-extension-toolbox-syncfusion-menu.png)

## Launching Syncfusion Xamarin Toolbox from View menu

To launch the Visual Studio Toolbox from Visual Studio menu in Visual Studio 2017 and later, click **View > Other Windows > Syncfusion Toolbox** in Visual Studio.

![Syncfusion Xamarin Custom Toolbox menu](Toolbox_images/Toolbox-img1.png)
![Syncfusion Xamarin Extension Custom Toolbox menu](toolbox_images/xamarin-extension-toolbox-custom-menu.png)

> You can also find the Syncfusion Toolbox option by typing "Syncfusion Toolbox" into the Quick Launch search field (top right corner in Visual Studio).

![Syncfusion Xamarin Custom Toolbox menu](Toolbox_images/quick-launchToolbox-img.png)
![Syncfusion Xamarin Extension Custom Toolbox menu](toolbox_images/xamarin-extension-toolbox-custom-img.png)

## Render Syncfusion components

1. When you click the Syncfusion Toolbox window, the Syncfusion Toolbox wizard is launched, and Syncfusion components are enabled once you access your application's designer page (XAML). Syncfusion components will not appear until open the appropriate design (XAML) file from the Xamarin shared/.NET Standard/PCL project. The rendering of the Syncfusion Xamarin components is made as simple as possible. All you need to do simply dragging and dropping the Syncfusion Xamarin component from the Syncfusion toolbox into the designer. The selected component's code snippet and namespace will be added to the designer page(XAML) and the required Syncfusion Xamarin NuGet packages will be installed.

![Syncfusion Xamarin Toolbox wizard](Toolbox_images/toolbox-gif.gif)
![Syncfusion Xamarin Extension Toolbox wizard](toolbox_images/xamarin-extension-toolbox-wizard.gif)

2. Then, Syncfusion licensing registration required message box will be shown if you installed the trial setup or NuGet packages since Syncfusion introduced the licensing system from 2018 Volume 2 (v16.2.0.41) Essential Studio release. Navigate to the [help topic](https://help.syncfusion.com/common/essential-studio/licensing/overview#how-to-generate-syncfusion-license-key), which is shown in the licensing message box to generate and register the Syncfusion license key to your project. Refer to this [blog](https://blog.syncfusion.com/post/Whats-New-in-2018-Volume-2-Licensing-Changes-in-the-1620x-Version-of-Essential-Studio.aspx) post for understanding the licensing changes introduced in Essential Studio.
2. Then, Syncfusion licensing registration required message box will be shown if you installed the trial setup or NuGet packages since Syncfusion introduced the licensing system from 2018 Volume 2 (v16.2.0.41) Essential Studio release. Navigate to the [help topic](https://help.syncfusion.com/common/essential-studio/licensing/overview#how-to-generate-syncfusion-license-key), which is shown in the licensing message box to generate and register the Syncfusion license key to your project. Refer to this [blog](https://www.syncfusion.com/blogs/post/whats-new-in-2018-volume-2.aspx) post for understanding the licensing changes introduced in Essential Studio.