Hello,
I am trying to use the dataform but as soon as I uncomment one too many input the UI overlaps. In the image bellow after uncommenting RSVPPage the UI is all messed up.
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage
x:Class="Class"
xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:models="clr-namespace:NameSpace.Models"
xmlns:telerik="http://schemas.telerik.com/2022/xaml/maui"
xmlns:toolkit="http://schemas.microsoft.com/dotnet/2022/maui/toolkit"
xmlns:vm="clr-namespace:NameSpace.ViewModels"
Title="Demo">
<ContentPage.BindingContext>
<vm:NewDemoViewModel />
</ContentPage.BindingContext>
<ContentPage.Content>
<ScrollView>
<telerik:RadDataForm
x:Name="dataForm"
AutoGenerateItems="False"
BindingContext="{Binding Demo}"
ValidationMode="LostFocus">
<telerik:DataFormGroup HeaderText="Text">
<telerik:DataFormRadEntryEditor PropertyName="Host" />
<telerik:DataFormRadEntryEditor PropertyName="Address" />
<telerik:DataFormRadEntryEditor PropertyName="City" />
<telerik:DataFormRadEntryEditor PropertyName="PostalCode" />
<telerik:DataFormRadEntryEditor PropertyName="PhoneNumber" />
</telerik:DataFormGroup>
<telerik:DataFormGroup HeaderText="Text">
<telerik:DataFormRadEntryEditor PropertyName="CreatedOn" />
<telerik:DataFormRadDatePickerEditor PropertyName="PlannedDate" />
<telerik:DataFormRadDatePickerEditor PropertyName="Date" />
<telerik:DataFormRadTimePickerEditor PropertyName="Time" />
<!--<telerik:DataFormRadCheckBoxEditor PropertyName="PersoDemo" />
<telerik:DataFormRadEntryEditor PropertyName="RSVPPage" />-->
<!--<telerik:DataFormRadEntryEditor PropertyName="Ambassador" />
<telerik:DataFormRadEntryEditor PropertyName="InternalNote" />-->
</telerik:DataFormGroup>
</telerik:RadDataForm>
</ScrollView>
</ContentPage.Content>
</ContentPage>
Thanks in advance,
Edit: I am using the android emulator with a pixel 5.
Hi Jean,
Are you using hot reload, for example comment/uncomment code while running the app. Such issues may occur. For the test rebuild and redeploy to see if problem still exists after the change.
I am asking for this test, as I cannot reproduce layout issue son my side. Also what is the .NET version you use?
Hey DIdi,
Thank you for your follow up. I'm not using hot reload. I'm stopping, building and running the app between those changes.
I'm using .NET 7.0 with Microsoft Maui Graphics 7.0.92 and Telerik Maui 6.1.0.
I'm reproducing the bug on my pixel 5 emulator as well as on my physical pixel 3a XL
I tried with installing vs 2022 preview for .NET8.0 but I can't even start an app using a Telerik component.
I need to add x:Name to my component otherwise it can't find them and when I do I get a System.Reflection error.
Here is my dotnet workload list
Hey again Didi,
I managed to display a telerik entry using this namespace instead
xmlns:telerikControls="clr-namespace:Telerik.Maui.Controls;assembly=Telerik.Maui.Controls"
java.lang.RuntimeException: Font asset not found /data/user/0/com.companyname.erosapp/cache/telerikfont.ttfbut when I use a dataform I still get this error even if I cleaned and rebuild my app first.
<?xml version="1.0" encoding="utf-8" ?> <ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:telerikControls="clr-namespace:Telerik.Maui.Controls;assembly=Telerik.Maui.Controls" x:Class="ErosApp.MainPage"> <ScrollView> <VerticalStackLayout Spacing="25" Padding="30,0" VerticalOptions="Center"> <Image Source="dotnet_bot.png" SemanticProperties.Description="Cute dot net bot waving hi to you!" HeightRequest="200" HorizontalOptions="Center" /> <Label Text="Hello, World!" SemanticProperties.HeadingLevel="Level1" FontSize="32" HorizontalOptions="Center" /> <Label Text="Welcome to .NET Multi-platform App UI" SemanticProperties.HeadingLevel="Level2" SemanticProperties.Description="Welcome to dot net Multi platform App U I" FontSize="18" HorizontalOptions="Center" /> <Button x:Name="CounterBtn" Text="Click me" SemanticProperties.Hint="Counts the number of times you click" Clicked="OnCounterClicked" HorizontalOptions="Center" /> <telerikControls:RadDataForm AutoGenerateItems="False" ValidationMode="LostFocus"> <telerikControls:DataFormGroup HeaderText="Information Client.e"> <telerikControls:DataFormRadEntryEditor PropertyName="Host" /> <telerikControls:DataFormRadEntryEditor PropertyName="Address" /> <telerikControls:DataFormRadEntryEditor PropertyName="City" /> <telerikControls:DataFormRadEntryEditor PropertyName="PostalCode" /> <telerikControls:DataFormRadEntryEditor PropertyName="PhoneNumber" /> </telerikControls:DataFormGroup> <telerikControls:DataFormGroup HeaderText="Information Demo a domicile"> <telerikControls:DataFormRadEntryEditor PropertyName="CreatedOn" /> <telerikControls:DataFormRadDatePickerEditor PropertyName="PlannedDate" /> <telerikControls:DataFormRadDatePickerEditor PropertyName="Date" /> <telerikControls:DataFormRadTimePickerEditor PropertyName="Time" /> <telerikControls:DataFormRadCheckBoxEditor PropertyName="PersoDemo" /> <telerikControls:DataFormRadEntryEditor PropertyName="RSVPPage" /> <telerikControls:DataFormRadEntryEditor PropertyName="AmbassadorName" /> <telerikControls:DataFormRadEntryEditor PropertyName="InternalNote" /> </telerikControls:DataFormGroup> </telerikControls:RadDataForm> </VerticalStackLayout> </ScrollView> </ContentPage>
And here is my stack trace
Hi,
The issue happens because of .NET MAUI version. I tested with .NET 8 Preview 7, not RC1. For RC 1 we are working on providing support for RC1: https://feedback.telerik.com/maui/1624021-net-8-rc1-support
You can try using 7.0.59, 7.0.86 version of .NET MAUI. The issue happens in 7.0.92 version. There are many layout issues with this version.
About the x:name behavior, yes this is required for the common schema usage.
Regarding to the Xaml definition, The DataForm is added inside ScrollView, avoid this practice. The control has internal scrolling. Nesting scrollable objects is not recommended. There is a warning here: https://learn.microsoft.com/en-us/dotnet/maui/user-interface/controls/scrollview
Regarding to the error message related to Telerik font. The file that error is pointing to is an internal one, used by many parts of the Telerik controls (e.g., Toolbar icons). The reason for seeing such an warning is that the compiler excluded the required components, you can fix this by making sure it compiles the XAML.
The approach is easy, it's only 1 line. Open your MauiProgram.cs file and add this attribute to the namespace:
[assembly: XamlCompilation(XamlCompilationOptions.Compile)] namespace YourNamespace; public static class MauiProgram { ... }
Then do a Rebuild and the behavior should be fixed.
Thank you, you can close the issue.
I'm good with the release candidate, but I still have some issues here and with the UI and also for example DataForm does not have the attribute ValidationSummaryMessage like the documentation says here: https://docs.telerik.com/devtools/maui/controls/dataform/validation#validation-summary---styling-and-customization
Also on that version I can't get the validation message anymore from any of the different editors.
I know it's still not fully supported on .NET8.0 so I'll wait till the October release.
Have a nice day!