2 Answers, 1 is accepted
Greetings Scofield,
To use the RadPopup from code behind add the following namespace:
using Telerik.XamarinForms.Primitives;
By adding the namespace we can now define the RadPopup as a field for example:
private RadPopup popup;
After defining the field we need to add it do the constructor:
this.popup = new RadPopup();
To add content to the Popup we must first create our DataTemplate, I have used the following code to populate the DataTemplate:
<DataTemplate x:Key="popupDataTemplate">
<telerik:RadBorder CornerRadius="8"
BackgroundColor="#93D7FF"
WidthRequest="250"
Padding="10">
<Grid Padding="10">
<Grid.RowDefinitions>
<RowDefinition Height="30" />
<RowDefinition Height="50" />
<RowDefinition Height="30" />
</Grid.RowDefinitions>
<Label Text="Popup from code behind" />
<Label Grid.Row="1"
Text="Click the Close Popup button to close it." />
<telerik:RadButton Grid.Row="2"
Padding="2"
HorizontalOptions="Start"
Text="Close Popup"
Clicked="ClosePopup"
CornerRadius="6"
BackgroundColor="#7A9BFF"
TextColor="White"/>
</Grid>
</telerik:RadBorder>
</DataTemplate>
In addition I have decided to create a button to visualize the Popup dynamically by using an event.
<VerticalStackLayout>
<Button Clicked="show_dt_Popup" Text="Visualize DataTemplate" WidthRequest="200" />
</VerticalStackLayout>
Having created a button to visualize the Popup, we can add the content from the DataTemplate to the Popup in our code behind:
public void show_dt_Popup(object sender, EventArgs e)
{
this.popup.ContentTemplate = (DataTemplate)this.Resources["popupDataTemplate"];
this.popup.IsOpen = true;
}
For more information on how Popup.IsOpen operates please go to the following link: https://docs.telerik.com/devtools/maui/controls/popup/content
Let me know if I can provide any further assistance.
Regards,
Antoan
Progress Telerik
Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.
Hi Antoan,
Thanks for your supports this is what I want:
this.popup.ContentTemplate = (DataTemplate)this.Resources["popupDataTemplate"];
Hello Scofield,
Thank you for your interest in Telerik UI for .NET MAUI.
To create an example which represents a result more accurate to the one expected, I would require more information about the scenario in which the control is used.
You can find a running sample Popup Content Template example inside the Examples/PopupControl/ContentTemplateCategory folder of the SDKMaui Demo App. How to set up the app - check the following link from our documentation: https://docs.telerik.com/devtools/maui/demos-and-sample-apps/maui-demo-app.
I hope the provided information proves to be useful and I am looking forward to your reply.
Regards,
Antoan
Progress Telerik
Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.
Hi Antoan,
Thanks for your feedback and I did check the Popup Content Template example, and I just wonder if I can load the content template of popup dynamically like this way in my code-behind, I tried but this doesn't work...
popup.ContentTemplate.LoadFromXaml(externalXaml);
NOTE: MS say: Loading XAML at runtime has a significant performance cost, and generally should be avoided. Loading XAML at Runtime in Xamarin.Forms - Xamarin | Microsoft Docs
I'm working with other way to make Popup load the content template dynamically, let's say we have two templates (DataTemplate1 and DataTemplate2) I want to change them by a binding property PopupContent, any suggestion of how we can make it works?
I have a button in xaml:
<Button x:Name="popupButton" Text="{StaticResource ShareIconString}" FontFamily="FA6Solid" FontSize="14" WidthRequest="40" HeightRequest="40" CornerRadius="10"
VerticalOptions="Center" Margin="0,0,10,0"/>
In code i create popup:
Popup = new RadPopup();
Popup.BindingContext = this;
Popup.ContentTemplate = _sharePopupTemplate;
Popup.Placement = PlacementMode.Relative;
Popup.VerticalOffset = -30;
Popup.HorizontalOffset = -700;
Popup.IsModal = true;
Popup.IsOpen = true;
I want that position was relative by 'popupButton'.
How do this?