Tag: mvvm

Posted on by — Leave a comment

ViewModel Image binding based on Condition – XAML

If you want to show a specific image in a Xamarin.Forms app based on a condition, you can Image.Triggers

For example you have an Image element in your XAML and you want to show a different image based on a database query. In order to do that, you should place the pictures that you want to use in the appropriate folders.

  • For iOS the pictures must be located under Resources folder.
  • For Android the pictures should be in Resources/drawable
  • For UWP you must place the pictures in the root directory of the project.
 <Image WidthRequest="80"  Source="{Binding Category}" HeightRequest="80">
                                <Image.Triggers>
                                    <DataTrigger TargetType="Image" Binding="{Binding Category}" Value="ID Number">
                                        <Setter Property="Source" Value="id.png" />
                                    </DataTrigger>
                                    
                                     <DataTrigger TargetType="Image" Binding="{Binding Category}" Value="Tax Identification Number">              
                                        <Setter Property="Source" Value="tax.png" />
                                    </DataTrigger>

                                     <DataTrigger TargetType="Image" Binding="{Binding Category}" Value="Other">              
                                        <Setter Property="Source" Value="other.png" />
                                    </DataTrigger>
                                    
                                </Image.Triggers>
    </Image>

As a result your image will change upon the value of the Category element. If the Category value would be ID Number then the image should be id.png etc..

Posted on by — Leave a comment

Send signals between Mainpage.xaml.cs and Viewmodel – Xamarin.Forms

In a recent application I wanted to inform a Listview with a specific ItemTemplate to update its data source on back button with a synchronous data fetching mechanism(so this was not automatic).

So the goal was to send a “signal” to my Viewmodel when the page was loaded to perform an action. This can be done using MessageCenter with Xamarin.Forms.

The solution was to send an update signal every time OnAppearing() method of the MainPage.xaml was hit and inform the ViewModel to perfom an action.

 protected override void OnAppearing()
        {
            MessagingCenter.Send<nameofapp.App>((nameofapp.App)Xamarin.Forms.Application.Current, "update");
        }

Then perform action on MainPageViewModel

public MainPageViewModel()
        {
           
            MessagingCenter.Subscribe<nameofapp.App>((nameofapp.App)Application.Current, "update", (sender) => {
                var result = viewmodel.fetchData();
            });


        }