Xamarin - WebView Pull To Refresh - c#

I've searched everywhere on google and it seems like this 'Pull To Refresh' feature is only available for ListViews. There are some posts regarding 'Pull To Refresh' for WebView but they are coded in Java and in Android Studio. Is there any easy way to implement this?

You can use #jamesmontemagno's PullToRefreshLayout and include your WebView inside PullToRefreshLayout element:
<?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="RefreshSample.Views.ScrollViewXamlPage"
xmlns:controls="clr-namespace:Refractored.XamForms.PullToRefresh;assembly=Refractored.XamForms.PullToRefresh"
Title="Xaml Scroll">
<controls:PullToRefreshLayout
IsPullToRefreshEnabled="True"
RefreshCommand="{Binding RefreshCommand}"
IsRefreshing="{Binding IsBusy}"
RefreshColor="Blue">
<WebView>
</WebView>
</controls:PullToRefreshLayout>
</ContentPage>

Related

How to customize the navigation title view of MAUI ContentPage

In Xamarin, I frequently used <NavigationPage.TitleView> to customize the navigation title bar in my views. Now that I am working in MAUI, this tag seems to have no effect on a ShellItem view.
Here is AppShell.xaml:
<?xml version="1.0" encoding="UTF-8" ?>
<Shell
x:Class="MyApp.AppShell"
xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:localize="clr-namespace:FleetHDMobile.Resources.Strings"
xmlns:local="clr-namespace:FleetHDMobile.Views"
Shell.FlyoutBehavior="Disabled">
<ShellItem Route="MainPage">
<ShellContent
Title="MainPage"
ContentTemplate="{DataTemplate local:MainPage}"
/>
</ShellItem> . . .
Here is MainPage.xaml:
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:localize="clr-namespace:FleetHDMobile.Resources.Strings"
Shell.FlyoutBehavior="Flyout"
x:Class="FleetHDMobile.Views.MainPage">
<NavigationPage.TitleView>
<Label
Text="XXX"
HeightRequest="44"
WidthRequest="300" />
</NavigationPage.TitleView>
<ScrollView>
I have tried making MainPage a tab in the tabbar, but that didn't customize the title view either.
The <NavigationPage.TitleView> tag has no effect on the rendered view. I would like to put small logo icons in the title bar, but cannot figure out how to do so.
There are some known issues about this problem.
You can follow up them here:
https://github.com/dotnet/maui/issues/9269
https://github.com/dotnet/maui/issues/9687
Thanks for your support and feedback.
Did you try doing it through the ViewModel or the .cs of your View ?
Such as for MainPage.xaml.cs or MainPageViewModel.cs
public class MainPageViewModel
{
public MainPageViewModel
{
Title = “”; // or this.Title = “”;
}
}

Can Radio Buttons be used in Xamarin.Forms?

I read the Xamarin docs https://learn.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/radiobutton and tried to follow the exact syntax given in the doc to include a radiobutton in my project. The code is as follows :
<StackLayout Grid.Column="1" Grid.Row="2">
<widget:RadioButton Text="Cat" />
</StackLayout>
The error I get here is 'invalid type: expected type is 'View', actual type is 'RadioButton' Is there a way to solve this ?
I think what your looking for in Xamarin.Forms is the control <RadioButton../> without the widgetpart.This will create a radiobutton in the native controls for UWP, iOS and Android.
This is the code I use to display radiobuttons.
<?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="TestButton.MainPage">
<StackLayout HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand">
<RadioButton Text="test radio button"/>
</StackLayout>
</ContentPage>
Beware it is experimental and you will need to add the build flag for it.
build flag for experimental XamarinForms controls
If you want to add the experimental flag for the RadioButton, you have to do so in all your projects (iOS, Android and UWP).I've added images to clarify where exactly (they need to be before the Xamarin.Forms.Forms.Init). This is the code to add:
global::Xamarin.Forms.Forms.SetFlags(new string[] { "RadioButton_Experimental" });
Here's where to add the code in the Android project. MainActivity.cs
Here's where to add the code in the iOS project. AppDelegate.cs
Here's where to add the code in the UWP project. App.xaml.cs

adding map control to xamarin project breaks it

I am new to Xamarin (came from C# and WPF)
I build a Xamarin form application using the template provided (VS created it for me)
I add Xamarin.Forms.Map from the nuget and added it to a page like this:
<?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:maps="clr-namespace:Xamarin.Forms.Maps;assembly=Xamarin.Forms.Maps"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
x:Class="XamarinTest.Views.MapPage"
Title="Map"
>
<!--Title="{Binding Title}"-->
<ContentPage.ToolbarItems>
<!--<ToolbarItem Text="Add" Clicked="AddItem_Clicked" />-->
</ContentPage.ToolbarItems>
<StackLayout Spacing="10">
<maps:Map x:Name="map" />
</StackLayout>
</ContentPage>
Now the application doesn't work and I am getting an error which says the code can not be debugged using this debugger. (I am using UWP platform)
When I commented out the map, it would work and there is no problem.
I tested it on Android and I am getting similar errors when reference to map exist.
What is the problem and how I can fix it?
Thanks to comments, I found that I need to initialize the map in each implementation.
For example UWP we should have this line in MainPage.xaml.cs
Xamarin.FormsMaps.Init("INSERT_AUTHENTICATION_TOKEN_HERE");
This is a good document on how to initialise map on different platforms:
Xamarin.Forms Map Initialization and Configuration

Xamarin App won't launch when trying to make popup page

I have a problem. I am using the Nuget package: Rg.Plugins.Popup.Pages with this colorPicker: Spillman.Xamarin.Forms.ColorPicker.
I created this page:
<?xml version="1.0" encoding="utf-8" ?>
<pages:PopupPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:pages="clr-namespace:Rg.Plugins.Popup.Pages;assembly=Rg.Plugins.Popup"
xmlns:animations="clr-namespace:Rg.Plugins.Popup.Animations;assembly=Rg.Plugins.Popup"
x:Class="Memento.Dialogs.ColorPicker"
xmlns:colorPicker="clr-namespace:Spillman.Xamarin.Forms.ColorPicker;assembly=Spillman.Xamarin.Forms.ColorPicker">
<pages:PopupPage.Animation>
<animations:ScaleAnimation
PositionIn="Center"
PositionOut="Center"
ScaleIn="1.2"
ScaleOut="0.8"
DurationIn="400"
DurationOut="300"
EasingIn="SinOut"
EasingOut="SinIn"
HasBackgroundAnimation="True"/>
</pages:PopupPage.Animation>
<pages:PopupPage.BindingContext>
<colorPicker:ColorPickerViewModel />
</pages:PopupPage.BindingContext>
<ContentView HorizontalOptions="Center" VerticalOptions="Center"
Padding="8" BackgroundColor="White">
<colorPicker:ColorPickerView />
</ContentView>
</pages:PopupPage>
But when I try to define the page like this: ColorPicker_Popup = new ColorPicker(); I get the following error:
Android.Content.Res.Resources+NotFoundException: 'Resource ID #0x7f0700c3'
What am I doing wrong?
Can't you do it like this?
await PopupNavigation.PushAsync(new ColorPicker(), true);

Set content page icon

I created an hamburguer menu with master detail page. In the detail page i would like to have a botton navigation bar with shortcuts (like twitter app for android) but icons of eash shortcuts are not being displayed.
I tried using url, file path and ImageSource but none of these displayed the image icon.
<MasterDetailPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="KiaiDay.Views.Main.HomePage"
xmlns:pages="clr-namespace:KiaiDay.Views.Main"
xmlns:local="clr-namespace:KiaiDay.MarkupExtensions" NavigationPage.HasNavigationBar="False">
<MasterDetailPage.Master>
...
</MasterDetailPage.Master>
<MasterDetailPage.Detail>
<NavigationPage>
<x:Arguments>
<pages:HomePageDetail />
</x:Arguments>
</NavigationPage>
</MasterDetailPage.Detail>
</MasterDetailPage>
Homepagedetail
<?xml version="1.0" encoding="utf-8" ?>
<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="KiaiDay.Views.Main.HomePageDetail"
Title="Pagina Inicial"
xmlns:local="clr-namespace:KiaiDay.MarkupExtensions"
xmlns:android="clr-namespace:Xamarin.Forms.PlatformConfiguration.AndroidSpecific;assembly=Xamarin.Forms.Core"
xmlns:view ="clr-namespace:KiaiDay.Views.PosLogin"
BarBackgroundColor="LightGray" BarTextColor="White"
android:TabbedPage.ToolbarPlacement="Bottom">
<ContentPage Title="Home" Icon="{local:ImageResource KiaiDay.Images.calendarWhite.png}" NavigationPage.TitleIcon="calendarWhite.png"/>
<ContentPage Icon="calendarWhite.png"/>
<ContentPage Icon="https://img.icons8.com/ios/50/000000/calendar-11.png" />
</TabbedPage>
I tried Url of the image, using file path located at android project (Resources/drawable) and ImageSource. None of these were able to display the icon.
So, i solved the problem. It was needed to have the image files in each platform. Android on Resources/drawable and iOS Resources. After that change build action of each image , for Android set AndroidResource and iOS bundleResource.

Categories

Resources