Warning .UseTelerik in MauiProgram.cs

1 Answer 329 Views

General Discussions

Rolf asked on 06 Dec 2022, 10:43 AM

I am currently creating my first project with Telerik Maui. In the MauiProgram.cs file, 3 lines are underlined in green.

"This call site is reachable on: 'Android' 21.0 and later. 'RadAppHostBuilderExtensions.UseTelerik(MauiBuilder)' is only supported on: 'Windows' 10.0.17763.0 and later"

is displayed as a warning message. The program compiles and runs without errors on Windows.

On Android I get the following error message:

System.TypeLoadException: 'Could not load type of field 'Telerik.Maui.TelerikFont:UsePlatformFontProperty' (84) due to: Could not load file or assembly 'Microsoft.WinUI, Version=3.0.0.0, Culture=neutral, PublicKeyToken=de31ebe4ad15742b' or one of its dependencies.'

Here is the code (The affected lines are marked in green) :

using Telerik.Maui.Controls.Compatibility;

namespace xxx;

public static class MauiProgram
{
public static MauiApp CreateMauiApp()
{
var builder = MauiApp.CreateBuilder();
builder
            .UseMauiApp<App>()
            .UseTelerik()
            .ConfigureFonts(fonts =>
{
fonts.AddFont("OpenSans-Regular.ttf", "OpenSansRegular");
fonts.AddFont("OpenSans-Semibold.ttf", "OpenSansSemibold");
                fonts.AddFont("ionicons.ttf", "IonIcons");
            });

        builder.Services.AddSingleton<MainPage>();
        builder.Services.AddTransient<PageList>();

        return builder.Build();
}
}

One of the advances of Maui over Xamarin is that only one code base is required for different platforms.
Does this also apply to the Telerik Maui Library?

1 Answer, 1 is accepted

answered on 06 Dec 2022, 05:27 PM

RolfStarter.zip

Hi Rolf,

Without seeing your code, I cannot give you a definitive answer, but I do have some general comments and suggestions that I've provided below based on the conflict I see between the target platform (Android) and the selected framework (Windows).

If none of my suggestions work, please follow my instructions in the "Further Assistance" section at the bottom of this reply.

Tooling (IDE/SDK)

I used to see these things more often with older versions of the tooling, but I do not anymore. So, before we move forward, we want to make sure you're on the latest stable version of the tooling.

Visual Studio

Make sure you're using the latest version of Visual Studio 2022 (non-preview), it should be version 17.4.2.

.NET MAUI workloads

Open PowerShell
Run the following command "dotnet workload install maui"

Note: If you get an error running that command about "failed sources", just add the --source link you see in my screenshot.

Suggested Action => If you needed to update any of the items we just checked. Please go back to the project and take these steps:

Make sure the correct target platform/framework is selected.
- For example, if the Android Emulator is selection, you must have net6.0 selected as the framework
Right-click on the project and select "Clean"
Right-click on the project again and select "Rebuild"
Now you can deploy to the target platform.

If those settings are used, you should have no problems deploying.

Further Investigation

Okay, let's switch to the actual problem you had at runtime. The error message is saying you are trying to use Windows libraries on Android (the highlighted text is for WinUI 3)

System.TypeLoadException: 'Could not load type of field 'Telerik.Maui.TelerikFont:UsePlatformFontProperty' (84) due to: Could not load file or assembly 'Microsoft.WinUI, Version=3.0.0.0, Culture=neutral, PublicKeyToken=de31ebe4ad15742b' or one of its dependencies.

That error sounds like the project has the Android emulator/device selected as the target platform but has net6.0-windows selected as the target framework.

Suggested Action => Make sure everything is selected for Android

See my last screenshot above for visual reference of Android deployment. As another example, here's what it looks like when deploying to Windows targets:

If that still doesn't help, are you sure that the project's csproj is configured correctly for the latest release of .NET MAUI? You can compare it against a File > New Project > Dotnet Maui template to make sure. In fact, let's do that right now.

Recommendation - Starting Fresh

I tend to see this kind of trouble when someone tries to upgrade an older project to net6/7, particularly if the older project was a Xamarin.Forms one. There are some migration guides out there that will only work for very simple projects. That's why I recommend starting with a clean project in such situations.

I have attached such a project for you, but it's better if you know how to get there. Let me give you exact steps to follow:

Phase 1 - Fresh Working Project

Open a new instance of Visual Studio 2022 (non-preview, version 17.4.2).
Select File > New > Project...
Find and select ".NET MAUI App"
After the project is created, confirm the app builds and deploys to the target platform of choice. For this walkthrough, let's use Android

Phase 2 - Add Telerik

Once you've confirmed the app is working, now it's time to add Telerik UI for Maui

Right-click on the project and select "Manage NuGet packages"
Select the package source that includes the Telerik server ("All" or "Telerik")
Search for Telerik.UI.for.Maui
Install the latest version
Open MauiProgram.cs file and add the UseTelerik() builder extension
Right-click on the project and select Rebuild
Deploy the project to your selected platform

At this point, you have a working project, with the latest configuration, that you can build on. Here's a single screenshot with the relevant items in highlight

Then finally, at runtime:

Side-Note About Code Editor Context

About design-time warnings on platform-specific code. Don't forget about the context switcher and don't forget to #IFDEF platform-specific code.

Here's a screenshot to explain a little further.

Further Assistance

If my guidance or demo project doesn't help, then I'm afraid to say that we need hands-on time with your project so that I can investigate directly. Take the following steps:

Close Visual Studio and open the project in File Explorer
Delete the project's bin and obj folders (this is very important)
Finally ZIP up the entire folder (if you followed Step 2, the size should only be ~0.5mb)

You have two choices at this point.

(A) - Upload the zip file to OneDrive/Google Drive and get a shareable link to paste into your reply here.
(B) - If the project contains private code that you do not want in this public forum, then please open a private Support Ticket instead (you can attach ZIP files directly to support ticket)

Regards,
Lance | Manager Technical Support
Progress Telerik

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Rolf

commented on 06 Dec 2022, 08:16 PM

Hi Lance,

I've migrated my VS from 17.4.0 to 17.4.2 and checked the platform before compiling. The same result.

Then I've created a new project from scratch. I added the Telerik Nuget Server (using the description on https://docs.telerik.com/devtools/maui/get-started/install-nuget).
But when i want to access your nuget server, I get the following error message:

[Telerik NuGet] Failed to load service index for source 'https://nuget.telerik.com/nuget'. The content at "https://nuget.telerik.com/nuget" is not a valid JSON object. Unexpected character encountered while parsing value: <. Path '', line 0, position 0.

Lance | Senior Manager Technical Support

commented on 06 Dec 2022, 08:47 PM

Okay, that's a different problem. There are two issues that I can surmise.

You're using an outdated URL to the server (it should be nuget.telerik.com/v3/index.json)
The credentials for that package source might be outdated.

Solution

To fix this, take control over what the project uses for package sources. You can do this by adding a nuget.config file to the project. Below is a modern nuget.config file that you can use for inspiration.

I leverage three main features:

We use the v3 nuget server (much faster than v2)
We use packageSourceMapping (this also speeds up package restore significantly)
I use a <clear/> command in front of the package sources (this ensures only those two listed sources are used for that project)

Steps to implement

If you have VS open, close it and navigate to the project folder in File Explorer
In the same folder that the .sln file is located, add a new text file named "nuget.config"
Use the XAML content below for the contents of that nuget.config file, save and close it.
Open the project in Visual Studio again

nuget.config

<?xml version="1.0" encoding="utf-8"?>
<!-- Helpful docs https://docs.microsoft.com/en-us/nuget/reference/nuget-config-file -->
<configuration>
  <!-- Learn how to set a package source https://docs.microsoft.com/en-us/nuget/reference/nuget-config-file#packagesources -->
  <packageSources>
    <clear/>
    <add key="nuget.org" value="https://api.nuget.org/v3/index.json" protocolVersion="3" />
    <add key="Telerik_Feed" value="https://nuget.telerik.com/v3/index.json"  protocolVersion="3"/>
  </packageSources>

  <!-- Learn how package source mapping works https://docs.microsoft.com/en-us/nuget/consume-packages/package-source-mapping?Wt.mc_id=DX_MVP5000553 -->
  <packageSourceMapping>
    <packageSource key="nuget.org">
      <package pattern="*" />
    </packageSource>
    <packageSource key="Telerik_Feed">
      <package pattern="UI.for.*" />
      <package pattern="Telerik.*" />
      <package pattern="Kendo.*" />
    </packageSource>
  </packageSourceMapping>

  <packageRestore>
    <add key="enabled" value="True" />
    <add key="automatic" value="True" />
  </packageRestore>
  <packageManagement>
    <add key="format" value="0" />
    <add key="disabled" value="False" />
  </packageManagement>
</configuration>

Extra

If you plan on building this code in CI-CD (AzDO, GH Actions, etc), then you'll want to also add this packageSourceCredentials section to the nuget.config:

  <!-- 
    Learn how to use authenticated feeds https://docs.microsoft.com/en-us/nuget/consume-packages/consuming-packages-authenticated-feeds
    Learn how to setup a credential https://docs.microsoft.com/en-us/nuget/reference/nuget-config-file#packagesourcecredentials 
  -->
  <packageSourceCredentials>
    <Telerik_Feed>
      <add key="Username" value="%TELERIK_USERNAME%" />
      <add key="ClearTextPassword" value="%TELERIK_PASSWORD%" />
    </Telerik_Feed>
  </packageSourceCredentials>

Rolf

commented on 06 Dec 2022, 09:16 PM

It seems there was an incorrect installation of Telerik Maui in my project. After re-installation problem is solved.

Thanks for your assistance.

Lance | Senior Manager Technical Support

commented on 06 Dec 2022, 09:28 PM

That's fantastic news! don't hesitate to reach out again if you run into trouble. Also don't forget you have technical support option available for questions/problems that you don't want to share in the public eye => https://www.telerik.com/account/support-center/contact-us.

Product Bundles

DevCraft

Web

Mobile

Document Management

Desktop

Reporting

Testing & Mocking

CMS

UI/UX Tools

Debugging

Free Tools

Support and Learning

Docs & Resources

Productivity and Design Tools