How to Implement webView Rendering and pass data in UWP ?

Can any one suggest me how to implement webview Rendering in UWP xamarin.forms .
Thanks in Advance.

Answers

  • ColeXColeX Member, Xamarin Team Xamurai
    edited January 14

    Check documentation here : https://docs.microsoft.com/en-us/xamarin/xamarin-forms/app-fundamentals/custom-renderer/hybridwebview#creating-the-custom-renderer-on-uwp

    Forms project

    public class HybridWebView : View
    {
      Action<string> action;
      public static readonly BindableProperty UriProperty = BindableProperty.Create (
        propertyName: "Uri",
        returnType: typeof(string),
        declaringType: typeof(HybridWebView),
        defaultValue: default(string));
    
      public string Uri {
        get { return (string)GetValue (UriProperty); }
        set { SetValue (UriProperty, value); }
      }
    
      public void RegisterAction (Action<string> callback)
      {
        action = callback;
      }
    
      public void Cleanup ()
      {
        action = null;
      }
    
      public void InvokeAction (string data)
      {
        if (action == null || data == null) {
          return;
        }
        action.Invoke (data);
      }
    }
    

    Custom renderer in UWP project

    [assembly: ExportRenderer(typeof(HybridWebView), typeof(HybridWebViewRenderer))]
    namespace CustomRenderer.UWP
    {
        public class HybridWebViewRenderer : ViewRenderer<HybridWebView, Windows.UI.Xaml.Controls.WebView>
        {
            const string JavaScriptFunction = "function invokeCSharpAction(data){window.external.notify(data);}";
    
            protected override void OnElementChanged(ElementChangedEventArgs<HybridWebView> e)
            {
                base.OnElementChanged(e);
    
                if (Control == null)
                {
                    SetNativeControl(new Windows.UI.Xaml.Controls.WebView());
                }
                if (e.OldElement != null)
                {
                    Control.NavigationCompleted -= OnWebViewNavigationCompleted;
                    Control.ScriptNotify -= OnWebViewScriptNotify;
                }
                if (e.NewElement != null)
                {
                    Control.NavigationCompleted += OnWebViewNavigationCompleted;
                    Control.ScriptNotify += OnWebViewScriptNotify;
    
                    //pass data here 
                    Control.Source = new Uri(string.Format("ms-appx-web:///Content//{0}", Element.Uri));   
                }
            }
    
            async void OnWebViewNavigationCompleted(WebView sender, WebViewNavigationCompletedEventArgs args)
            {
                if (args.IsSuccess)
                {
                    // Inject JS script
                    await Control.InvokeScriptAsync("eval", new[] { JavaScriptFunction });
                }
            }
    
            void OnWebViewScriptNotify(object sender, NotifyEventArgs e)
            {
                Element.InvokeAction(e.Value);
            }
        }
    }
    
  • Dilipkumar.7949Dilipkumar.7949 USMember ✭✭
    edited January 21

    Thanks for the reply,
    I have url to send UserName and Password(Post request-Login). So where can i send these input parameters in above code?

Sign In or Register to comment.