This is my page in portable project
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:b="clr-namespace:Corcav.Behaviors;assembly=Corcav.Behaviors"
xmlns:local="clr-namespace:MyMobileApp;assembly=MyMobileApp"
x:Class="MyMobileApp.MainPage"
x:Name="MainPage">
<Image Source="{local:ImageResource myimage.jpg}" />
This is my ImageResourceExtension in same portable project
namespace MyMobileApp
{
[ContentProperty("Source")]
public class ImageResourceExtension : IMarkupExtension
{
public string Source { get; set; }
public object ProvideValue(IServiceProvider serviceProvider)
{
if (Source == null)
return null;
var imageSource = ImageSource.FromResource(Source);
return imageSource;
}
}
}
I have tried to add myimage.jpg as embedded in root of my project and in Resources folder, but no image is shown.
While debugging I see that the returned imageSource is of type Xamarin.Forms.StreamImageSource. How do I check if this is really found?
Can anyone spot the error here?
The correct XAML was to add the app name to the source.
<Image Source="{local:ImageResource MyMobileApp.myimage.jpg}" />
By default the image will have Build Action: None; this needs to be set to Build Action: EmbeddedResource.
Right click on Image > properties > set [Build Action: EmbeddedResource]
[]1
Can you explain the intent of the extension a bit more? Assuming you are putting your images in the proper folders ('Resources' on iOS, 'Resources/Drawable' on Android), then all you need in your XAML is just:
<Image Source="FeaturedAreaMockup.jpg" />
That will find the images in the appropriate folder and show them - why aren't you just doing that? What's the point of the extension?
To read assets/resources folder you need to use:
ImageSource.FromFile("myimage.jpg");'
ImageSource.FromResource uses images included as EmbeddedResource
More here: https://developer.xamarin.com/guides/cross-platform/xamarin-forms/working-with/images/
Related
In my app there is a certain listview that I use over and over in my app, only with different elements in it. Therefore, I put everything inside a contentview and inflated it in my xaml like so:
<ContentPage Title="Newbies" BackgroundColor="#fafafa">
<views:CV_AllAdsRes />
</ContentPage>
The class looks like this:
public partial class CV_AllAdsRes : ContentView
{
public CV_AllAdsRes(int id)
{
InitializeComponent();
SetAds();
}
}
Now, this doenst work, because I am not using a "default constructor". If I remove the "int id" from the constructor, it works no problem. But I need to be able to inflate this content view with different parameters inside the xaml.
Am I understanding this concept wrong?
How can I inflate my content view and give it parameters via xaml?
Thank you
I solved it by using a second constructor next to the default one and giving it arguments from xaml like so:
<views:CV_AllAdsRes >
<x:Arguments >
<x:Int32>5</x:Int32>
</x:Arguments>
</views:CV_AllAdsRes>
this will give ID=5.
I have a xamarin forms application that is based on ReactiveUI. The viewmodels inherit from ReactiveObject and the codebehind the xaml of the pages , they inherit/are based on from ReactiveContentPage, in case of the masterdetailpage it inherits from the ReactiveMasterDetailPage. The contentpages/masterdetailpage it self are based on ReactiveContent.
What I want to achieve is the following: Get views/xamlpages by giving a viewmodel type. I have the following code for that. But it gives a null at _viewLocator.Resolve...
public async Task<TViewModel> PushViewModelAsync<TViewModel>(bool animated) where TViewModel : class
{
var viewModel = DependencyInjectionService.Get<TViewModel>();
var view = _viewLocator.ResolveView(viewModel);
if (view is Page page)
{
view.ViewModel = viewModel;
await Application.Current.MainPage.Navigation.PushAsync(page, animated);
return viewModel;
}
else
{
throw new ArgumentException($"resolved view for {typeof(TViewModel)} is not a page.");
}
}
The problem is that this works for normal contentpages but it doesnt work for my MasterDetailPage, how is that possible?
<?xml version="1.0" encoding="utf-8" ?>
<rxui:ReactiveMasterDetailPage 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"
mc:Ignorable="d"
xmlns:vm="clr-namespace:DriverApp.ViewModels"
x:TypeArguments="vm:MainViewModel"
xmlns:rxui="clr-namespace:ReactiveUI.XamForms;assembly=ReactiveUI.XamForms"
xmlns:local="clr-namespace:DriverApp.Views; assembly=MasterDetailPageNavigation"
x:Class="DriverApp.Views.MainPage"
Title="Personal Organiser">
<MasterDetailPage.Master>
<local:MasterPage x:Name="masterPage" />
</MasterDetailPage.Master>
<MasterDetailPage.Detail>
<NavigationPage>
<x:Arguments>
<local:PlanningPage/>
</x:Arguments>
</NavigationPage>
</MasterDetailPage.Detail>
The viewmodel:
public class MainViewModel : ReactiveObject, IActivatableViewModel
{
}
I inject it like this:
services.AddTransient<IViewFor<MainViewModel>, MainPage>();
var viewModel = DependencyInjectionService.Get<TViewModel>();
var view = _viewLocator.ResolveView(viewModel);
Based on the code provided I would expect the value you are passing into the _viewLocator.ResolveView to be null. You showed the code where you are registering the IViewFor but I don't see any code registering the ViewModel itself.
Registering IViewFor<Foo>, Foo doesn't register the view model. It tells the type system that a given ViewModel will resolve a specific page.
Also, it seems like you are using a different container than the one provided by ReactiveUI. Which is okay, but you have to make sure all your dependencies are registered correctly in the container you plan to resolve dependencies from.
Lastly. You say it gives a null, but you don't say if the ViewModel you are passing is null or the object you are using to resolve is null.
Either way, I think this is an issue of having the dependencies registered in the correct place, based on the information provided.
I am trying to play a video using Plugin.MediaManager.Forms and I am referring to this blog.
Step 1: Added Plugin.MediaManager and Plugin.MediaManager.Forms.
Step 2: XAML code - Added a VideoView
<?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:local="clr-namespace:VideoPlayerApp"
x:Class="VideoPlayerApp.MainPage"
xmlns:forms="clr-namespace:Plugin.MediaManager.Forms;assembly=Plugin.MediaManager.Forms"
Title="Video Player">
<ContentPage.Content>
<StackLayout>
<Label Text="Xamarin Forms"
FontSize="40"
TextColor="Azure"/>
<Label Text="Video Player Application"
FontSize="58"
TextColor="BlueViolet"/>
<Button x:Name="PlayStopButtonText"
Text="Play"
Clicked="PlayStopButton"
TextColor="BlueViolet"/>
<forms:VideoView HeightRequest="202"
WidthRequest="202"/>
</StackLayout>
</ContentPage.Content>
</ContentPage>
Step 3: xaml.cs code
public partial class MainPage : ContentPage
{
private string videoUrl = "https://sec.ch9.ms/ch9/e68c/690eebb1-797a-40ef-a841-c63dded4e68c/Cognitive-Services-Emotion_high.mp4";
public MainPage()
{
InitializeComponent();
}
private void PlayStopButton(object sender, EventArgs e)
{
if (PlayStopButtonText.Text == "Play")
{
CrossMediaManager.Current.Play(videoUrl, MediaFileType.Video);
PlayStopButtonText.Text = "Stop";
}
else if (PlayStopButtonText.Text == "Stop")
{
CrossMediaManager.Current.Stop();
PlayStopButtonText.Text = "Play";
}
}
}
But getting error on this step:
Error CS0103 The name 'MediaFileType' does not exist in the current context
Step 4: Also added VideoViewRenderer.Init();in MainActivity.cs, AppDelegate.cs and MainPage.xaml.cs. But getting following error for this initialization.
The name 'VideoViewRenderer' does not exist in the current context
Am I missing something? I checked some other blogs but same error occuring. I have added a sample project here.
Android Options Screenshot:
The blog seems out of date. Part of APIs and methods were obsoleted . You should check the newest docs from https://github.com/martijn00/XamarinMediaManager#usage .
use the following code instead of VideoViewRenderer.Init() ;
CrossMediaManager.Current.Init();
And just need to call the method
CrossMediaManager.Current.Play(videoUrl);
And I checked your demo . You need to update the version of Xamarin.Forms to 4.2.x both in share project and specific platforms(Android and iOS) .Which will match to the version of the plugin.
Don't forget to set the Dex complier to d8 .
Right click your Android project -> Property-> Android Options.
I am trying to set up a component with data binding. This is basically a seperate content view that would have a property Item of type Item and supports binding. The following is the definition for the binding:
public static readonly BindableProperty ItemProperty
= BindableProperty.Create(
nameof(Item), typeof(Item), typeof(ItemComponent), null,
defaultBindingMode: BindingMode.TwoWay,
propertyChanged: ItemPropertyChanged);
private readonly ItemComponentViewModel vm;
static void ItemPropertyChanged(BindableObject bindable, object oldValue, object newValue)
{
var view = (ItemComponent)bindable;
view.Item = (Item)newValue;
}
public Item Item
{
get => (Item)GetValue(ItemProperty);
set
{
SetValue(ItemProperty, value);
if (vm != null) vm.Data = value; // break point here
}
}
The item doesn't seem to get bound. The commented line had a breakpoint and doesn't break. The complete source code is here: https://github.com/neville-nazerane/xamarin-component-sample
The above code can be found in the ItemComponent class. This component is called in the MainPage class.
Update
Just to explain what I am trying to simulate and why:
Why do we use MVVM in pages? While we'll have better type safety and performance by using the behind code directly, when the page's logic gets bigger, it becomes cleaner to handle it with a view model and to have a view that is simply bound to it.
Why do we have components? So that we can reuse a UI we intend to use with some functionality. If this functionality becomes complex it might need a view model for the same reason explained above. Hence, if pages need view models, I don't see why components won't need them at some point too.
This being considered this does feel like a particle requirement without easy to find examples.
So after looking at your example it turns out it's a bit of a complicated problem. So if my explanation is not clear, please let me know.
Basically the problem lies in these 2 code pieces:
MainPage.xaml(line 14):
<local:ItemComponent Item="{Binding Demo}" />
ItemComponent.xaml.cs (line 43):
public ItemComponent()
{
InitializeComponent();
vm = new ItemComponentViewModel();
BindingContext = vm; //this breaks the functionality
}
The first part you tell it to bind to the Demo property, and as normal it looks for this property in it's BindingContext. However in the second part you override it's BindigContext and set it to a ItemComponentViewModel this ViewModel however does not have a property Demo so the {Binding Demo} does not work on this new BindingContext you've set.
Now a possible solution for your demo application would be to change MainPage.xaml to the following 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"
xmlns:local="clr-namespace:SampleApp"
x:Class="SampleApp.MainPage"
x:DataType="local:MainViewModel"
x:Name="MyDemoPage">
<StackLayout>
<Label Text="Manual:" />
<Label Text="{Binding Demo.Title}" />
<Label Text="Component: " />
<local:ItemComponent Item="{Binding Path=BindingContext.Demo, Source={x:Reference MyDemoPage}}" />
</StackLayout>
</ContentPage>
Basically we now place the Demo binding outside of the BindingContext of our ItemComponent control. However if you want to use it in a ListView (if I remember correctly from your original question, this solution might not work and it's possible you'll have to drop the ItemComponentViewModel and bind directly to the properties (ListView will already make sure that the BindingContext of your ItemComponent is set to the current Item, no need to pass it around through a bindable property.
Hope this helps!
I'm using Prism.Forms 6.3 in a Xamarin.Forms 2.3.4.247 project. I'm having a hard time tracking why the back arrow button isn't visible when I navigate to a details page within a Master/Detail setup.
I can navigate to the Pages just fine, but the back-button never shows up. Instead, the hamburger menu icon is always visible. This is my "Master" page.
<?xml version="1.0" encoding="utf-8" ?>
<MasterDetailPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:FloatSink.Apps.Mobile.Views.ValueConverters"
xmlns:prism="clr-namespace:Prism.Mvvm;assembly=Prism.Forms"
prism:ViewModelLocator.AutowireViewModel="True"
x:Class="FloatSink.Apps.Mobile.Views.MainPage"
BackgroundColor="Blue">
<MasterDetailPage.Master>
<ContentPage Title="Menu">
<StackLayout Padding="40">
<Label Text="Hello" />
<Button Text="Feed" Command="{Binding NavigateCommand}" CommandParameter="NavigationPage/FeedPage" />
<Button Text="Options" Command="{Binding NavigateCommand}" CommandParameter="NavigationPage/OptionsPage" />
</StackLayout>
</ContentPage>
</MasterDetailPage.Master>
</MasterDetailPage>
This is two of my Detail pages.
<?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="FloatSink.Apps.Mobile.Views.FeedPage">
<Label Text="Hello from Feed Page!" />
</ContentPage>
<?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="FloatSink.Apps.Mobile.Views.OptionsPage">
<Label Text="Hello from Options Page!" />
</ContentPage>
I navigate to it using the CommandParameter specified in my Master page, using the navigation service in the MainPageViewModel.
private void NavigateToPage(string uri)
{
this.navigationService.NavigateAsync(uri);
}
I've setup my NavigationPage like this during the startup of the app so I land on the FeedPage first, then I can navigate to the OptionsPage.
public class App : PrismApplication
{
public App(IPlatformInitializer dependencyRegister) : base(dependencyRegister) { }
protected override void OnInitialized()
{
base.NavigationService.NavigateAsync("MainPage/NavigationPage");
}
protected override void RegisterTypes()
{
var builder = new ContainerBuilder();
builder.RegisterModule<NavigationRegistration>();
builder.RegisterModule<ServicesRegistration>();
base.Container.RegisterTypeForNavigation<NavigationPage>();
// This is deprecated but we have to wait for Prism.Autofac to update itself
builder.Update(base.Container);
}
}
The DI registrations associated with navigation are done in this module:
internal class NavigationRegistration : Module
{
/// <summary>
/// Load the navigation related types into the given builder.
/// </summary>
/// <param name="builder">Container Builder that will be turned into the final IOC Container</param>
protected override void Load(ContainerBuilder builder)
{
// Register the NavigationPage in Xamarin with the Prism Navigation system.
//builder.RegisterType<NavigationPage>().AsSelf();
//PageNavigationRegistry.Register(nameof(NavigationPage), typeof(NavigationPage));
// Get all of the Types that represent a View in our assembly for DI and navigation registration
// If start-up time ever becomes an issue, we can replace this assembly scan with explicit registrations.
Type[] viewTypes = base.ThisAssembly.GetTypes().Where(type => type.IsAssignableTo<Page>()).ToArray();
// Iterate over each discovered View Type and register it with the navigation system and DI container.
for(int index = 0; index < viewTypes.Length; index++)
{
Type viewType = viewTypes[index];
builder.RegisterType(viewType).Named<Page>(viewType.Name);
// If we ever need to disconnect a view name from its Type name, we can do so here.
// We would build a custom attribute to decorate the view with, pull the attribute from the Type
// and register the Type with the attribute value.
PageNavigationRegistry.Register(viewType.Name, viewType);
}
}
}
Again I can each one of my detail pages without problem, the hamburger menu exists and I can open the Master page to view my buttons used for navigating. I just can't navigate backwards once I'm there. Is that something I'm supposed to wire up myself?
I'm not sure I'm reading your question right but it sounds like this is normal behavior. In my (short) experience with XF/Prism, every navigation from the master is a beginning of the stack. If you were to add another page, e.g. from Master->PageA->PageB, I would expect Page A to have the hamburger menu but going to PageB would give you the back arrow.
For using NavigationPage inside uri you should register it for navigation in the App.xaml.cs:
protected override void RegisterTypes()
{
// your registrations
Container.RegisterTypeForNavigation<NavigationPage>();
}
I most cases it is the reason.
To Navigate To Master Page
"/MasterPage/NavigationPage/ViewA"
To Navigate out of Master Page from ViewA and with back button
"ViewB"
You need to start your app with MainPage = new NavigationPage(new StartPage()); That is how it is solved in normal situation. So maybe try to register your MainPage wrapped in a NavigationPage.