We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

Leveraging MVVM frameworks in conjunction w/ SyncFusion

Hi, we are using the lightweight FreshMVVM framework in our Xamarin app.  I am playing with the SfPopup control, and see you must open it with the .Show0 method.  However, in a MVVM framwork, the view model is loosely coupled to the underlying View, so the controls (by name) are not available.  How can the Show() method be invoked on your control through a property setting in the ViewModel?  

So the property might be...

public bool ShowDialog{get;set;}

And when it's time to show the dialog, the model just sets ShowDialog to 'true', and the dialog appears (thusly invoking the Show() method)?

And, it's an antipattern to locate the control in the view model to call Show(), so any solution that includes something like that isn't workable for us.

How can we use a MVVM framework with your popup, and more generally for all your controls?

1 Reply

SP Subburaj Pandian Veluchamy Syncfusion Team July 6, 2019 05:17 AM

Hi John, 
  
Thank you for contacting Syncfusion support. 
  
We have checked your requirement of displaying the popup using a Boolean and you can set SfPopupLayout.IsOpen as true to display the popup view. Based on your requirement we have prepared a sample in FreshMvvm to display the popup view from the model page using the SfPopupLayout.IsOpen property. 
 
Please refer the following code,
 
 
  
//// Model code: 
public class FirstPageModel : FreshBasePageModel 
{                             
  
               public Command<SfPopupLayout> OpenAlertDialog { getset; } 
  
               public FirstPageModel() 
    { 
                              this.OpenAlertDialog = new Command<SfPopupLayout>(this.DisplayAlert); 
               } 
  
               private void DisplayAlert(SfPopupLayout popupLayout) 
               {                             
                              popupLayout.IsOpen = true;                                      
               } 
} 
  
//// Xaml code: 
<ContentPage.Resources> 
        <ResourceDictionary> 
            <popuplayout:SfPopupLayout x:Key="AlertDialog"> 
                <popuplayout:SfPopupLayout.PopupView> 
                    <popuplayout:PopupView ShowHeader="False" 
                                           AcceptButtonText="DISCARD" 
                                           DeclineButtonText="CANCEL" 
                                           AppearanceMode="TwoButton" 
                                           HeightRequest="120" > 
                        <popuplayout:PopupView.ContentTemplate> 
                            <DataTemplate> 
                                <Grid BackgroundColor="White" Padding="15,20,0,0"> 
                                    <Label FontSize="16"  BackgroundColor="White" TextColor="Gray" Text="Discard draft?"/> 
                                </Grid> 
                            </DataTemplate> 
                        </popuplayout:PopupView.ContentTemplate> 
                    </popuplayout:PopupView> 
                </popuplayout:SfPopupLayout.PopupView> 
            </popuplayout:SfPopupLayout> 
        </ResourceDictionary> 
    </ContentPage.Resources> 
    
    <ContentPage.Content> 
        <ScrollView x:Name="parentLayout"> 
            <StackLayout Orientation="Vertical" Spacing="20" Padding="20" > 
                <Button x:Name="Alert"                         
                        Text="ALERT" 
                        CornerRadius="5" 
                        BackgroundColor="#0059ff"          
                        TextColor="White" 
                        HeightRequest="40" 
                        Command="{Binding OpenAlertDialog}" 
                        CommandParameter="{StaticResource AlertDialog}" /> 
            </StackLayout> 
        </ScrollView> 
    </ContentPage.Content> 
  
  
We have attached the sample for your reference, 
 
  
Regards,
Subburaj Pandian V  


Loader.
Live Chat Icon For mobile
Up arrow icon