Popup in .Net Maui application - maui

I use Xamarin community toolkit mauicompat to implement popup for .net maui but when I call to open the popup, it had an error like the image below
and my code here:
public partial class HomePage : ContentPage
{
public HomePage()
{
InitializeComponent();
}
private void BtPop_Clicked(object sender, System.EventArgs e)
{
Navigation.ShowPopup(new PopupServicess()
{
IsLightDismissEnabled = true,
});
}
private void CollectionView_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
}
}
here my xaml file:
<xct:Popup xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:xct="http://xamarin.com/schemas/2020/toolkit"
Size="300,300"
x:Class="NailsApp.Views.PopupServicess">
<StackLayout>
<Label Text="Hello from Popup!"/>
</StackLayout>
</xct:Popup>
public partial class PopupServicess : Popup
{
public PopupServicess()
{
}
}

Related

How can I pass object while navigating? [duplicate]

This question already has an answer here:
How pass parameter when navigate to another page (Shell)
(1 answer)
Closed 4 months ago.
I have main page on which I have collection view. I want to navigate to next page after I click submit button .I am able to navigate to the next page but I also want total list of items which I have in my collection how can I achieve that?
I don't know the detail of your code, but you can try to pass the total list of items as the parameter of the next page.(suppose it's name is SecondPage)
You can refer to the following code:
MainPage.cs
public partial class MainPage : ContentPage
{
MyViewModel myViewModel;
public MainPage()
      {
            InitializeComponent();
myViewModel = new MyViewModel();
BindingContext = myViewModel;
}
      private void mCollectionView_SelectionChanged(object sender, SelectionChangedEventArgs e)
      {
string previous = (e.PreviousSelection.FirstOrDefault() as MyModel)?.Name;
string current = (e.CurrentSelection.FirstOrDefault() as MyModel)?.Name;
}
private async void Button_Clicked(object sender, EventArgs e)
{
// here we can pass the data we need.
var secondPage = new SecondPage(myViewModel.Data);
await Navigation.PushAsync(secondPage);
}
}
MainPage.xaml.cs
<?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"
x:Class="MauiCollectionApp.MainPage"
xmlns:local="clr-namespace:MauiCollectionApp"
x:Name="myPage"
>
<VerticalStackLayout>
<CollectionView ItemsSource="{ Binding Data}" x:Name="mCollectionView"
SelectionChanged="mCollectionView_SelectionChanged"
SelectionMode="Single"
>
<CollectionView.ItemTemplate>
<DataTemplate>
<HorizontalStackLayout Margin="3" >
<Label Text="{Binding Name}" BackgroundColor="Gray"/>
<Label Text="{Binding Car.Make}" Margin="5,0,5,0" />
<Button Text="delete" Margin="10,0,0,0"
BackgroundColor="Red"
Command="{Binding Path= BindingContext.RemoveEquipmentCommand,Source={Reference mCollectionView }}" CommandParameter="{Binding .}"
/>
</HorizontalStackLayout>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
<Button Text="submit" Clicked="Button_Clicked" Margin="10"/>
</VerticalStackLayout>
</ContentPage>
MyViewModel.cs
public class MyViewModel: INotifyPropertyChanged
{
public ObservableCollection<MyModel> Data { get; set; }
public ICommand RemoveEquipmentCommand => new Command<MyModel>(ReMoveItem);
private void ReMoveItem(MyModel obj)
{
System.Diagnostics.Debug.WriteLine(" the selected item's name is: " + obj.Name );
Data.Remove(obj);
}
public MyViewModel() {
Data = new ObservableCollection<MyModel>();
Data.Add(new MyModel { Name ="model_1", Car= new Vehicle {Make="Make1" } });
Data.Add(new MyModel { Name = "model_2", Car = new Vehicle { Make = "Make2" } });
Data.Add(new MyModel { Name = "model_3", Car = new Vehicle { Make = "Make3" } });
Data.Add(new MyModel { Name = "model_4", Car = new Vehicle { Make = "Make4" } });
}
bool SetProperty<T>(ref T storage, T value, [CallerMemberName] string propertyName = null)
{
if (Object.Equals(storage, value))
return false;
storage = value;
OnPropertyChanged(propertyName);
return true;
}
protected void OnPropertyChanged([CallerMemberName] string propertyName = null)
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
public event PropertyChangedEventHandler PropertyChanged;
}
SecondPage.cs
public partial class SecondPage : ContentPage
{
public ObservableCollection<MyModel> Items { get; set; }
public SecondPage(ObservableCollection<MyModel> data )
      { // we can get the passed data here
            InitializeComponent();
            this.Items = data;
      }
}

Click Object on Web Page in Xamarin forms

I wan to click button which created in web page.
I added following code to the my project but it did execute, string always null.
public partial class MainPage : ContentPage
{
public MainPage()
{
InitializeComponent();
wbWeb.Source = "https://www.facebook.com";
}
private async void btnBrowser_Clicked(object sender, EventArgs e)
{
string str = wbWeb.EvaluateJavaScriptAsync($"document.getElementById('loginbutton').click();");
//str is null
}
}

Prism Button click command

Im try to open Drawer menu (Syncfusion control) via Behaviors command
Xaml
<Button x:Name="hamburgerButton"
HeightRequest="50" WidthRequest="50"
HorizontalOptions="Start" FontSize="20"
BackgroundColor="#1aa1d6" >
<Button.Behaviors>
<b:EventToCommandBehavior EventName="Clicked"
Command="{Binding HamburgerButton}" />
</Button.Behaviors>
VM cs
public DelegateCommand HamburgerButton { get; private set; }
public QuickPartViewModel(INavigationService navigationService)
{
HamburgerButton = new DelegateCommand(HamburgerButton_Clicked);
}
public void HamburgerButton_Clicked(object sender, EventArgs e)
{
navigationDrawer.ToggleDrawer();
}
If HamburgerButton_Clicked(object sender, EventArgs e) with arguments then i have error -// Argumment: cannot convert from 'method group' to Action
if I'm remove Argumments it does't work
You're overthinking things. Just bind the command to the button.
in the page:
<Button Command="{Binding HamburgerCommand}" />
in the view model:
public QuickPartViewModel()
{
HamburgerCommand = new DelegateCommand(OnHamburger);
}
public DelegateCommand HamburgerCommand { get; }
private void OnHamburger()
{
navigationDrawer.ToggleDrawer();
}
Give the docs a try...

Unable to show Xamarin Forms MVVM binding result in listview

I am trying to implement MVVM approach in my xamarin forms application. During the implementations, I have hit a road block. I am unable to populate the list view with the data that i recieve from the server. I am unable to identify the binding issue.
Please let me know where is my mistake? What am I missing?
View Code
<?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="Test.Views.SubtaskPage"
Title="Select Subtask"
xmlns:viewModels="clr-namespace:Test.ViewModels; assembly=Test">
<ContentPage.BindingContext>
<viewModels:SubtaskPageViewModel/>
</ContentPage.BindingContext>
<ContentPage.ToolbarItems>
<ToolbarItem x:Name="tbiAddSubtask" Text="Add Subtask" Clicked="tbiAddSubtask_Clicked"/>
</ContentPage.ToolbarItems>
<StackLayout Orientation="Vertical" Padding="10">
<ListView x:Name="lstSubtasks" ItemSelected="lstSubtasks_ItemSelected" IsPullToRefreshEnabled="True" RefreshCommand="{Binding RefreshCommand}" IsRefreshing="{Binding IsBusy}" ItemsSource="{Binding SubtaskList}}">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<ViewCell.ContextActions>
<MenuItem x:Name="menuAddTimeSpent" Clicked="menuItem_Clicked" CommandParameter="{Binding Ticket}" Text="Menu" />
</ViewCell.ContextActions>
<StackLayout Padding="20,0,0,0" HorizontalOptions="StartAndExpand" Orientation="Horizontal">
<Label Text="{Binding Subject}" VerticalTextAlignment="Center" />
</StackLayout>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
</ContentPage>
Response Class Code
public class SubtasksResponse
{
public int Status { get; set; }
public string Message { get; set; }
public List<Ticket> Subtasks { get; set; }
}
View Model Code
public class SubtaskPageViewModel : INotifyPropertyChanged
{
private SubtasksResponse _subtaskList;
public SubtasksResponse SubtaskList
{
get { return _subtaskList; }
set
{
_subtaskList = value;
OnPropertyChanged(nameof(SubtaskList));
}
}
private Command _refreshCommand;
public Command RefreshCommand
{
get
{
return _refreshCommand;
}
}
bool _isBusy;
public bool IsBusy
{
get { return _isBusy; }
set
{
_isBusy = value;
OnPropertyChanged(nameof(IsBusy));
}
}
public SubtaskPageViewModel()
{
_refreshCommand = new Command(RefreshList);
}
async void RefreshList()
{
SubtaskList = await PopulateSubtaskList();
}
async Task<SubtasksResponse> PopulateSubtaskList()
{
RestService rs = new RestService();
IsBusy = true;
IsBusy = false;
var subtaskList = new SubtasksResponse();
subtaskList = await rs.GetSubtasksAsync(Convert.ToInt32(Application.Current.Properties["UserId"]));
return subtaskList;
}
public event PropertyChangedEventHandler PropertyChanged;
protected virtual void OnPropertyChanged(string propertyName)
{
if (PropertyChanged != null)
{
PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
}
}
}
For starters we see you are binding the ListView to ItemsSource="{Binding SubtaskList} - when we then look at the ViewModel it seems that SubtaskList is of type SubtasksResponse, that type only has 3 properties.
But the item template inside your ListView is not using any of those 3 properties... it's using Ticket and Subject.
Are this properties of the class Subtasks? If so you need to bind the ListView directly to the List property for it to pick up the items in that collection.

How to wire up data context in modular application?

I am writing an application, WPF, using PRISM. I'm new so apologies if this question is poor form:
I have a module that up to now has a user control for displaying a list of inspections. My module has entities written and a DbContext class to access DB. My question is where should this get initialsed and passed into my ViewModel???????
Shell XAML
<Window x:Class="ChargeMgm.Desktop.Shell"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:prism="http://www.codeplex.com/prism"
Title="EMS" Height="350" Width="525">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="auto"/>
<RowDefinition MinHeight="100"/>
<RowDefinition/>
</Grid.RowDefinitions>
<TextBlock HorizontalAlignment="Center"
VerticalAlignment="Center"
FontFamily="Calibri"
FontSize="16"
Foreground="SteelBlue"
Margin="5">Street Works Modules</TextBlock>
<Border BorderThickness="1" BorderBrush="SteelBlue" CornerRadius="3" Grid.Row="1" Margin="5">
<ItemsControl prism:RegionManager.RegionName="MainRegion"
VerticalContentAlignment="Stretch"
HorizontalContentAlignment="Stretch"/>
</Border>
</Grid>
</Window>
Bootstrapper class
class Bootstrapper : UnityBootstrapper
{
protected override System.Windows.DependencyObject CreateShell()
{
return new Shell();
}
protected override void InitializeShell()
{
base.InitializeShell();
App.Current.MainWindow = (Window)this.Shell;
App.Current.MainWindow.Show();
}
protected override void ConfigureModuleCatalog()
{
base.ConfigureModuleCatalog();
ModuleCatalog moduleCatalog = (ModuleCatalog)this.ModuleCatalog;
moduleCatalog.AddModule(typeof(DefectModule.DefectModule));
}
}
Module
public class DefectModule : IModule
{
private readonly IRegionManager regionManager;
private IUnityContainer container;
public DefectModule(IUnityContainer container, IRegionManager regionManager)
{
this.regionManager = regionManager;
this.container = container;
}
public void Initialize()
{
container.RegisterType<IDefectsView, DefectsView>();
container.RegisterType<IDefectsViewModel, DefectsViewModel>();
container.RegisterType<IDefectContext, DefectContext>();
var view = container.Resolve<IDefectsView>();
if(regionManager.Regions.ContainsRegionWithName("MainRegion"))
{
regionManager.Regions["MainRegion"].Add(view);
//regionManager.RegisterViewWithRegion("MainRegion", typeof(IDefectsView));
}
}
}
If you're using Unity then you're in luck. If you need it initialise you DB context then you can do something like this:
IModule implementation code (for your module)
// Create Module http://msdn.microsoft.com/en-us/library/ff648781.aspx
public class Module:IModule
{
private IUnityContainer _container;
public Module(IUnityContainer container,IRegionManager regionManager)
{
_regionManager=regionManager;
_container=container;
}
public Initialize()
{
_container.RegisterType<IView,View>();
_container.RegisterType<IViewModel,ViewModel>();
_container.RegisterType<IDBContext,DbContext>();
var view=_container.Resolve<IView>();
//Create Region http://msdn.microsoft.com/en-us/library/ff648829.aspx
_regionManager.Regions["MainRegion"].Add(view);
}
}
The above will register all of your view, viewmodel and dbcontext, resolve them and add them into a region. For the above to work I'm expecting the following:
public class View:IView
{
public View(IViewModel viewModel)
{
}
}
public class ViewModel:IViewModel
{
public ViewModel(IDbContext context)
{
}
}
Basically, I'm expecting your viewmodel to be injected into your View and your DB Context to be injected into your ViewModel using Constructor Injection.
BTW - the links in the code go to MS sites that will provide more background on Module creation and Regions. I've got one final link: This is a "Hello World" Prism app. It's for Silverlight but this is basically the same thing as a WPF app in terms of code structure so should be useful:Prism Hello World