RadImageEditor

1 Answer 175 Views
ImageEditor Toolbar
Terry
Top achievements
Rank 1
Terry asked on 07 Feb 2023, 07:55 PM | edited on 07 Feb 2023, 07:55 PM

Does anyone have this working in a .NET MAUI Mobile App?  I added it to a contentpage, but it is not working.  Can't compile.  Getting the following errors:

The type 'telerik:RadImageEditorToolbar' was not found. Verify that you are not missing an assembly reference and that all referenced assemblies have been built.

The type 'telerik:RadImageEditor' was not found. Verify that you are not missing an assembly reference and that all referenced assemblies have been built.

 

My code example:

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
             xmlns:telerik="http://schemas.telerik.com/2022/xaml/maui"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             x:Class="TestApp.Profile.ProfilePage"
             Title="ProfilePage">
    <VerticalStackLayout
        Margin="10"
        >
        <Label 
            Text="Test"
            VerticalOptions="Center" 
            HorizontalOptions="Start" 
            FontSize="Title"
            />
            <Grid RowDefinitions="Auto,*">
                <telerik:RadImageEditorToolbar ImageEditor="{x:Reference imageEditor}"/>
                <telerik:RadImageEditor x:Name="imageEditor" Grid.Row="1"/>
            </Grid>
    </VerticalStackLayout>
</ContentPage>



1 Answer, 1 is accepted

Sort by
0
Lance | Senior Manager Technical Support
Telerik team
answered on 07 Feb 2023, 09:20 PM | edited on 07 Feb 2023, 09:36 PM

Hi Terry,

Let me start with a couple qualifying questions:

Are you sure you're using UI for MAUI version 5.0.0? That is when we introduced the ImageEditor control. You can check this quickly by looking at the csproj file content:

Have you registered the handlers in MauiProgram.cs? This is a required first step.

Unrelated to Telerik, but Important

Other than that, ensure your build targets are correct. Because if the build fails for something else first, then it will never get to compile the symbols in that XAML, meaning those errors are false flags. For example, if you're targeting Windows, it should be:

Finally, ensure your Visual Studio 2022 and the MAUI SDK workloads are up to date. It's quite possible you're a few releases behind on the workloads even though VS2022 might be up to date)

You can update the workloads right from PowerShell using:

powershell>  dotnet workload install maui --source https://api.nuget.org/v3/index.json

About Layout

Although this is not related to the current issue, I wanted to mention it now so that you don't run into problems layer. Never use controls that contain an infinite canvas, internal scrollview, or UI virtualization inside a parent that is detrimental to their measure and arrange passes. This included stack layouts, ScrollView and RowDefinitions with Auto height.

To address this immediately, please replace the parent VerticalStackLayout with a Grid. You did a perfect job with the inner Grid! Where the editor goes inside the star-sized row and the toolbar goes inside the auto-sized row.

Tip - If you absolutely must use those parent types, then always set a WidthRequest and HeightRequest on the child elelement to avoid the issue. This will prevent the inward pressure from squeezing it to minimum, or in the case of a ScrollView it prevents the child from expanding into infinity.

Demo

I used your code, with just the slight adjustment to the root parent, and here's the result:

I have attached the project for you to try and compare against.

Further Assistance

I normally don't like to mention Support Ticket system in the forums, because I want the whole community to see the answer. But in this case, your code is correct, so it's looking like a project-specific problem that isn't really applicable to everyone else (outside of what I've already mentioned above).

So, if you're still having trouble with this, and cannot share the code publicly, consider opening a priority Technical Support Ticket => Contact Us (select "Technical Support"). Please delete the bin and obj folders and then zip up the project, attach that zip to the ticket and we'll review it.

Regards,
Lance | Manager Technical Support
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.

[edit - spelling and grammar corrections]

Terry
Top achievements
Rank 1
commented on 08 Feb 2023, 06:59 PM

Thanks for the details.  You were right.  The version was old.  I did a nuget package upgrade to 5.0.0.  Now it compiles, but I get the following error when navigating to that page:

System.TypeLoadException
  Message=Could not load type of field 'Number.Profile.ProfilePage:imageEditor' (0) due to: Could not resolve type with token 0100003a from typeref (expected class 'Telerik.Maui.Controls.RadImageEditor' in assembly 'Telerik.Maui.Controls, Version=5.0.0.0, Culture=neutral, PublicKeyToken=5803cfa389c90ce7') assembly:Telerik.Maui.Controls, Version=5.0.0.0, Culture=neutral, PublicKeyToken=5803cfa389c90ce7 type:Telerik.Maui.Controls.RadImageEditor member:(null)

 

I have checked all the other registrations and code as supplied and it all matches.

Lance | Senior Manager Technical Support
Telerik team
commented on 08 Feb 2023, 07:29 PM

Honestly, I have no idea what that is. Type load exceptions usually occur because of misconfiguration or unsupported environment. Let's try a couple things:

1) Do you have XamlC disabled or are deploying in Release mode? To avoid that problem, add x:Names to any control that comes from outside of the project code. For example:

<telerik:RadImageEditorToolbar x:Name="MyToolbar" ImageEditor="{x:Reference MyImageEditor}"/>
<telerik:RadImageEditor x:Name="MyImageEditor" Grid.Row="1"/>

This will ensure the compiler doesn't choke.

2) I also suspect maybe the bin and obj was not fully cleaned. Did you do a complete Clean and Rebuild? Sometimes a file might be locked which prevents the obj/bin refresh, so let's try again.

We actually just released a new update today v5.0.1, which fixes an unrelated topic, but you should bump to it anyways. Take all of these exact steps:

  1. Upgrade the Telerik.UI.for.Maui package to 5.0.1
  2. Save and close the solution (completely close VS2022)
  3. Open the project in File Explorer and permanently delete both the bin and obj folders.
    • If File Explorer prevents you from deleting these folders, there's still a locked file in there. Make sure VS2022, adb.exe, and MSbuild.exe processes are all dead (check Task Manager or wait a few seconds)
  4. Open the solution in VS2022 again.
  5. Make sure the project's target framework and platform are set correctly (keep it on "Debug | AnyCPU | Windows Machine" for now)
  6. Right click on the project then select Rebuild
  7. Deploy from Visual Studio again.

3) Going further - Next Steps

If that still doesn't work, then there's another issue going on, please follow my advice above about opening a support ticket so that we can look at the project. 

 

Closing Thought: If this is an older project that you've slowly been upgrading over 6-12 months, it's time to take a look at the structure because a lot has changed since .NET MAUI was released. My demo is a brand new Microsoft > Maui project, from which you can compare the csproj and folder structure changes that have happened since then.

Terry
Top achievements
Rank 1
commented on 08 Feb 2023, 08:46 PM

Thank you.  I followed you latest instructions and that resolved the error I was receiving.  I really appreciate you assistance.
Lance | Senior Manager Technical Support
Telerik team
commented on 08 Feb 2023, 08:56 PM

Alright!

Tags
ImageEditor Toolbar
Asked by
Terry
Top achievements
Rank 1
Answers by
Lance | Senior Manager Technical Support
Telerik team
Share this question
or