web view Xamarin forms - xamarin.forms

How to use Web View in "Onappering" Event?
protected async override void OnAppearing()
{
base.OnAppearing();
if (Settings.Session)
{
while (!BrowserMaster.IsInNativeLayout)
{
await Task.Delay(50);
CallServer(url);
}
}
}
i have a webview in Xamarin forms that used onappering event
but error
"The full view has not been loaded yet"

This not only waits for your web view instance to be ready, it also waits for the site to be loaded, so you can use your site's assets.
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="App1.TestPage">
<WebView x:Name="BrowserMaster" Source="https://google.com/" Navigated="BrowserMaster_Navigated" />
</ContentPage>
public partial class TestPage
{
public TestPage()
{
InitializeComponent();
}
bool _isFirstTime = true;
async void BrowserMaster_Navigated(object sender, WebNavigatedEventArgs e)
{
if (_isFirstTime)
{
_isFirstTime = false;
await BrowserMaster.EvaluateJavaScriptAsync("alert(document.title)");
}
}
}

Related

Automatic height of the webview

I have a xamarin forms application and I have inserted a webview inside the layout stack, the problem is that I have multiple pages and in each page the length of the content is different from the others.
I wanted to ask if there was a way to have the webview automatically adjust the height.
I have read other similar questions on the site, but I admit they seemed confusing to me.
This is my code xaml
<ContentPage.Content>
<StackLayout Padding="0" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand" Spacing="0" BackgroundColor="White">
<WebView
x:Name="wvSite"
VerticalOptions="FillAndExpand"
HeightRequest="2300" />
</StackLayout>
</ContentPage.Content>
You could reset the webview height according to the content height when loading page finished via custom renderer.
Android:
[assembly: ExportRenderer(typeof(WebView), typeof(CustomWebViewRenderer))]
namespace App1.Droid
{
public class CustomWebViewRenderer : WebViewRenderer
{
public CustomWebViewRenderer(Context context) : base(context)
{
}
protected override void OnElementChanged(ElementChangedEventArgs<Xamarin.Forms.WebView> e)
{
base.OnElementChanged(e);
Control.SetWebViewClient(new CustomWebViewClient(e.NewElement));
}
}
internal class CustomWebViewClient : Android.Webkit.WebViewClient
{
private WebView webView;
public CustomWebViewClient(WebView webView)
{
this.webView = webView;
}
public async override void OnPageFinished(Android.Webkit.WebView view, string url)
{
if (webView != null)
{
int i = 10;
while (view.ContentHeight == 0 && i-- > 0)
await System.Threading.Tasks.Task.Delay(100);
webView.HeightRequest = view.ContentHeight;
}
base.OnPageFinished(view, url);
}
}
}
iOS:
[assembly: ExportRenderer(typeof(WebView),
typeof(CustomWebviewRenderer))]
namespace App1.iOS
{
public class CustomWebviewRenderer : WkWebViewRenderer
{
protected override void OnElementChanged(VisualElementChangedEventArgs e)
{
base.OnElementChanged(e);
NavigationDelegate = new CustomWebviewNavigationDelegate();
}
}
internal class CustomWebviewNavigationDelegate : WKNavigationDelegate
{
[Export("webview:didFinishNavigation:")]
public override void DidFinishNavigation(WKWebView webView, WKNavigation navigation)
{
//base.DidFinishNavigation(webView, navigation);
webView.Frame = new CoreGraphics.CGRect(0, 0, webView.ScrollView.ContentSize.Width, webView.ScrollView.ContentSize.Height);
}
}
}

Display the background image as tiles at Xamarin.Forms

I am using Xamarin.Forms to develop an application for Android.
I am using the Xamarin.
I want to display the background as tiles.
I have prepared an image of 100x100 pixels.
\Android\MyApp\MyApp.Android\Resources\drawable\background.jpg
<?xml version="1.0" encoding="utf-8" ? >
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:viewmodels="clr-namespace:MyApp.ViewModels"
x:DataType="viewmodels:LoginViewModel"
mc:Ignorable="d"
x:Class="MyApp.Views.LoginPage"
Shell.NavBarIsVisible="False"
BackgroundImage="background.jpg"
>
This way, the background.jpg will be enlarged and displayed.
I want to display it repeatedly in tiles.
You can display it repeatedly in tiles through below steps.
1.Create a drawable xml file on your Android project:
<?xml version="1.0" encoding="utf-8" ?>
<bitmap xmlns:android="http://schemas.android.com/apk/res/android"
android:tileMode="repeat"
android:src="#drawable/clock" >
</bitmap>
2.After that create below two effect classes on your shared project:
//base class
namespace AppTiles
{
public class BaseEffect : RoutingEffect
{
public const string EffectNamespace = "AppTiles";
public BaseEffect(String effectId) : base($"{EffectNamespace}.
{effectId}")
{
}
}
}
//effect class
namespace AppTiles
{
public class CoverEffect : BaseEffect
{
public CoverEffect() : base(nameof(CoverEffect))
{
}
}
}
3.Create a effect class in your Android project
[assembly: ResolutionGroupName("AppTiles") ]
[assembly: ExportEffect(typeof(AppTiles.Droid.CoverEffect),
nameof(CoverEffect))]
namespace AppTiles.Droid
{
public class CoverEffect : PlatformEffect
{
protected override void OnAttached()
{
UpdateBackground();
}
protected override void OnDetached()
{
}
private void UpdateBackground()
{
Android.Views.View mView = Container as Android.Views.View;
if (mView != null)
{
mView.Background = ContextCompat.GetDrawable(mView.Context, Resource.Drawable.XMLFile1);
}
}
}
}
4.Add below xmal in shared main page code behind:
<StackLayout Orientation="Vertical" Spacing="0">
<StackLayout.Effects>
<effects:CoverEffect/>
</StackLayout.Effects>
</StackLayout>
Below is the screenshot:

How to set dynamic height of webview in Xamarin.Forms uwp?

I am working on a Xamarin.Forms application, and I want to set the height of a webview dynamically as pet text in uwp platform.
Define a Custom Renderer for your webview and then inject a javascript to calculate the content's size:
[assembly: ExportRenderer(typeof(CustomWebView), typeof(MyWebViewRenderer))]
namespace Demo.UWP
{
public class MyWebViewRenderer : WebViewRenderer
{
protected override void OnElementChanged(ElementChangedEventArgs<WebView> e)
{
base.OnElementChanged(e);
if (Control != null)
{
Control.NavigationCompleted += Control_NavigationCompleted;
}
}
private async void Control_NavigationCompleted(Windows.UI.Xaml.Controls.WebView sender, Windows.UI.Xaml.Controls.WebViewNavigationCompletedEventArgs args)
{
var heightString = await Control.InvokeScriptAsync("eval", new[] { "document.body.scrollHeight.toString()" });
int height;
if (int.TryParse(heightString, out height))
{
Element.HeightRequest = height;
}
}
}
}
Your Forms page's Xaml could be like:
<ScrollView>
<StackLayout>
<local:CustomWebView Source="https://www.microsoft.com"/>
<!--Other controls-->
</StackLayout>
</ScrollView>

My scroll view does not responding i can not scroll down

In my XAML file, I used scroll view for scroll down but it does not work I can not find any issue where I did a couple of extra things here one is I add pull to refresh nuget and use it and I create a theme content class and I inherited it with default content page. another command in content page is working but scroll view does not support
Here my Xaml file
<views:BaseContentPage.Content>
<ScrollView BackgroundColor="White">
<controls:PullToRefreshLayout x:Name="PullToRefreshLayout" IsPullToRefreshEnabled="True" RefreshCommand="RefreshPatientDetailsPage">
<StackLayout>
// some code
</StackLayout>
</controls:PullToRefreshLayout>
</ScrollView>
</views:BaseContentPage.Content>
this is the Base content page I create
public abstract class BaseContentPage : ContentPage
{
public readonly BaseViewModel BaseViewModel;
protected bool IsNavigated;
public BaseContentPage(BaseViewModel baseViewModel)
{
BaseViewModel = baseViewModel;
}
protected abstract override void OnAppearing();
protected override void OnDisappearing()
{
IsNavigated = true;
}
}
I think this scroll view does not work because of the NuGet I put or it's the base content page
for android, I used this customer render
public class SortPaneListViewRendererAndroid : ListViewRenderer
{
public SortPaneListViewRendererAndroid(Context context) : base(context)
{
}
protected override void OnElementChanged(ElementChangedEventArgs<ListView> e)
{
base.OnElementChanged(e);
if (Control != null)
{
Control.VerticalScrollBarEnabled = false;
var listView = Control as Android.Widget.ListView;
listView.DividerHeight = 1;
}
}
}
The reason this was happening is because you are nesting scrollable controls, Removing one of them will solve the issue

Prism 6.3.0 PrismApplication doesn't have OnInitialized nor RegisterTypes

I'm using Prism 6.3.0
I trying to use the following code but i'm getting the following errors.
'Application' does not contain a constructor that takes 1 arguments
'App.OnInitialized()': no suitable method found to override
'App.RegisterTypes()': no suitable method found to override
public partial class App : PrismApplication
{
public App(IPlatformInitializer initializer = null) : base(initializer) { }
protected override void OnInitialized()
{
InitializeComponent();
}
protected override void RegisterTypes()
{
}
}
What am I doing wrong?
Thanks
The reason was that the XAML file should have been like:
<?xml version="1.0" encoding="utf-8" ?>
<prism:PrismApplication xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:prism="clr-namespace:Prism.Unity;assembly=Prism.Unity.Forms"
x:Class="Intro.App">
<Application.Resources>
<!-- Application resource dictionary -->
</Application.Resources>
</prism:PrismApplication>

Resources