Introduction
This article demonstrates Button-worked WebView In Xamarin.Forms applications. Xamarin is a platform that allows us to create a multi-platform mobile application for platforms, like Windows, iOS, and Android through a single integrated development environment (IDE).
Let's start.
Step 1
Open Visual Studio and go to New Project >> Installed >> Visual C# >> Cross-Platform.
Select Cross-Platform app, then give your project a name and location.
Step 2
Open Solution Explorer >> Project Name (Portable) >> MainPage.xaml. Double click on the left pane and open the design view of this page.
The code is given below.
XAML Code
We are creating a button inside the StackLayout and WebView as well as Scroll View inside the StackLayout.
  1. <?xml version="1.0" encoding="utf-8" ?>
  2. <ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
  3. xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
  4. xmlns:local="clr-namespace:WebView"
  5. x:Class="WebView.MainPage">
  6. <ContentPage.Content>
  7. <StackLayout>
  8. <Button Text="Click" Clicked="Button_Clicked"/>
  9. <StackLayout>
  10. <ScrollView>
  11. <WebView x:Name="Browser" VerticalOptions="FillAndExpand" HeightRequest="500"/>
  12. </ScrollView>
  13. </StackLayout>
  14. </StackLayout>
  15. </ContentPage.Content>
  16. </ContentPage>
Step 3
Open Solution Explorer >> Project Name (Portable) >> MainPage.xaml.cs. Double click to open the design view of this page.
The code is given below.
Button-worked WebView is created using this code. Give your own link in the code.
C# Code
  1. using System;
  2. using System.Collections.Generic;
  3. using System.Linq;
  4. using System.Text;
  5. using System.Threading.Tasks;
  6. using Xamarin.Forms;
  7. namespace WebView
  8. {
  9. public partial class MainPage : ContentPage
  10. {
  11. public MainPage()
  12. {
  13. InitializeComponent();
  14. }
  15. private void Button_Clicked(object sender, EventArgs e)
  16. {
  17. var Url = "https://www.c-sharpcorner.com/members/ajith-kumar51";
  18. Browser.Source = Url;
  19. }
  20. }
  21. }
Step 4
Next, select the "Build & deploy" option, followed by selecting from the list of Android Emulator or Simulator. You can choose any API (Application Program Interface) level emulator or simulator to run it.
Output
After a few seconds, you will see your app working.
Click the "Click" button. The WebView is displayed.
Finally, we have successfully created a Xamarin.Forms Button-worked WebView.