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. (Last updated on: June 24, 2019).
Unfortunately, activation email could not send to your email. Please try again.
Syncfusion Feedback

SfPopupLayout Accept/Decline Button Text Not Visible

Thread ID:

Created:

Updated:

Platform:

Replies:

148807 Nov 5,2019 11:53 AM UTC Nov 7,2019 11:30 AM UTC Xamarin.Forms 4
loading
Tags: SfPopup
Paul Parkins
Asked On November 5, 2019 11:53 AM UTC

Hi,
I am using Xamarin.Forms v4.3.0.947036 with Syncfusion components v17.3.0.21 (and FreshMvvM) and my application was displaying information via DisplayAlert(). However due to the message content this alert dialog was not wide enough causing what should have been a single line of text, to overflow onto 2 lines (actually has several lines of text in the same message, all doing this). It looked to odd.

So as I have Syncfusion controls I decide I should be able to use the very flexible SfPopupLayout view for the same use, but at a wider width (and possibly height). I want to re-use this as a replacement for DisplayAlert so I didn't really want to embed it within my xaml of any particular page, so I am attempting to implement it using C# only, and under the control of my page model.

The following code works (including the Accept/Decline buttons setting the associated PopupAccepted value), but the buttons themselves do not display (neither do any header/footer separators as shown in your online examples, but these don't really matter). The button text does not display even if I specify the text and/or background colours. Any ideas why not?

Thanks

Paul

        private static bool PopupAccepted = false;

        public async Task<bool> DisplaySfPopupAlert(string title, string message, string acceptText, string cancelText)
        {
            Label popupContent;

            DataTemplate contentTemplateView = new DataTemplate(() =>
            { 
                popupContent = new Label();
                popupContent.VerticalOptions = LayoutOptions.Center;
                popupContent.HorizontalOptions = LayoutOptions.Center;
                popupContent.Text = message;
                return popupContent;
            });

            SfPopupLayout popupLayout = new SfPopupLayout();
            popupLayout.PopupView.HeaderTitle = title;
            popupLayout.PopupView.ShowHeader = (!string.IsNullOrEmpty(title));
            popupLayout.PopupView.ContentTemplate = contentTemplateView;
            popupLayout.StaysOpen = true;
            popupLayout.PopupView.ShowCloseButton = true;
            popupLayout.PopupView.AppearanceMode = string.IsNullOrEmpty(acceptText) ? AppearanceMode.OneButton : AppearanceMode.TwoButton;
            
            // Configure our Accept button
            popupLayout.PopupView.AcceptButtonText = acceptText;
            popupLayout.PopupView.AcceptCommand = new Command(() =>
            {
                PopupAccepted = true;
                popupLayout.IsOpen = false;
            });
            popupLayout.PopupView.PopupStyle.AcceptButtonTextColor = Color.Black;
            popupLayout.PopupView.PopupStyle.AcceptButtonBackgroundColor = Color.White;
            // Configure our Decline button
            popupLayout.PopupView.DeclineButtonText = cancelText;
            popupLayout.PopupView.DeclineCommand = new Command(() =>
            {
                PopupAccepted = false;
                popupLayout.IsOpen = false;
            });
            popupLayout.PopupView.PopupStyle.DeclineButtonTextColor = Color.Black;
            popupLayout.PopupView.PopupStyle.DeclineButtonBackgroundColor = Color.White;
            popupLayout.PopupView.ShowFooter = true;

            // Show the popup and wait for user to close
            PopupAccepted = false;
            popupLayout.IsOpen = true;
            while (popupLayout.IsOpen)
            {
                await Task.Delay(100);
            }

            return PopupAccepted;
        }





Paul Parkins
Replied On November 5, 2019 12:10 PM UTC

I have since determined that the issue I see is only when I call my DisplaySfPopupAlert() method with an acceptText parameter that is an empty string. It seems that if the popupView's AcceptButtonText propert is empty, then even though my AppearanceMode is set to OneButton (ie. ignore the accept button), that the Decline button is not displayed (but is present).

Is this a bug?

Balasubramani Sundaram [Syncfusion]
Replied On November 6, 2019 04:22 PM UTC

Hi Paul, 
   
Thank you for contacting Syncfusion support.   
  
Based on your provided code snippet and details we get know that you are passing an acceptText value as null in parameter of “DisplaySfPopupAlert” then based on the “acceptText” value we are setting the AppearanceMode.  
 
In your case, acceptText is a null so AppearanceMode should be an OneButton. In SfPopupLayout the AppearanceMode.OneButton means it will load only the Accept Button in the footer. So that why accept button get loaded in footer but the acceptText has null so the text didn’t get into the view.  
 
If we set the ApperanceMode.OneButton it will load only the Accept button, if this ApperanceMode.TwoButton it will load the both Accept and Decline button in footer. 
 
Please refer the below sample and UG Link,  
 
 
 
We hope this helps. Please let us know, if you need any further assistance. 
 
Regards,
Balasubramani Sundaram.
 
 


Paul Parkins
Replied On November 6, 2019 04:48 PM UTC

Thanks for your reply. now that you have pointed this out and I have re-checked the SfPopupLayout documentation I can see it is as you say, and OneButton causes only the Accept button text to be used.

This is in contrast to the DisplayAlert() dialog I was replicating where if you only provide a Cancel string (and no Accept string), then the Cancel button is the one displayed. 

Thanks again

Paul

Balasubramani Sundaram [Syncfusion]
Replied On November 7, 2019 11:30 AM UTC

Hi Paul,  
 
Thanks for the update.     
 
Based on our documentation if we set the ApperanceMode.OneButton means it will load with the AcceptButton only if its ApperanceMode.TwoButton mean it will load with Accept and Decline button it a default behavior of SfPopupLayout.  
 
If ApperanceMode.OneButton it will load with AcceptButton API only. We only must change the text and operation on that API. Instead of that you can achieve your requirement by using the FooterTemplate support in SfPopupLayout on that you can load a view based on your business logic. 
 
Please refer the below code snippet and sample,  
 
Code Snippet [C#] 
[PopupPage.Xaml.cs] 
 
private async void Button_Clicked(object sender, EventArgs e) 
{ 
    await this.DisplaySfPopupAlert("PopupHeader","Popup", null , "Cancel"); 
} 
 
private async void Button_Clicked_1(object sender, EventArgs e) 
{ 
    await this.DisplaySfPopupAlert("PopupHeader", "Popup", "Ok", "Cancel"); 
} 
 
public async Task<bool> DisplaySfPopupAlert(string title, string message, string acceptText, string cancelText) 
{ 
    ........ 
 
    popupLayout.PopupView.AppearanceMode = string.IsNullOrEmpty(acceptText) ? AppearanceMode.OneButton : AppearanceMode.TwoButton; 
 
    if (popupLayout.PopupView.AppearanceMode == AppearanceMode.OneButton) 
    { 
        DataTemplate declineButtonTemplate = new DataTemplate(() => 
        { 
            StackLayout _stackLayout = new StackLayout(); 
            Button declineButton = new Button(); 
            declineButton.Text = cancelText; 
            declineButton.BackgroundColor = Color.White; 
            declineButton.TextColor = Color.Black; 
            declineButton.HorizontalOptions = LayoutOptions.End; 
            declineButton.Command = new Command(() => { 
                PopupAccepted = false; 
                popupLayout.IsOpen = false; 
            }); 
            _stackLayout.Children.Add(declineButton); 
            return _stackLayout; 
        }); 
 
        popupLayout.PopupView.FooterTemplate = declineButtonTemplate; 
    } 
    else 
    { 
      .......... 
    } 
 
   ......... 
} 
 
 
We hope this helps. Please let us know, if you need any further assistance. 
 
Regards,
Balasubramani Sundaram.
 


CONFIRMATION

This post will be permanently deleted. Are you sure you want to continue?

Sorry, An error occured while processing your request. Please try again later.

Please sign in to access our forum

This page will automatically be redirected to the sign-in page in 10 seconds.

Warning Icon You are using an outdated version of Internet Explorer that may not display all features of this and other websites. Upgrade to Internet Explorer 8 or newer for a better experience.Close Icon

Live Chat Icon For mobile
Live Chat Icon