Add ability to print Rich Text from RichTextEditor.
Can optionally be via operating system's native print dialog.
The initial color of the cursor is black, but it is not visible when RichTextEditor Background is black.
The cursor color changes when start typing in the editor and for example textcolor is set.
<telerik:RadRichTextEditor x:Name="richTextEditor" Grid.Row="1" TextColor="DarkOrange"
BackgroundColor="Black" />
We are currently evaluating the Telerik RichTextEditor MAUI component here:
https://docs.telerik.com/devtools/maui/controls/richtexteditor/toolbar/overview
However our application is a Xamarin iOS/Android Native app, which is now migrated to .NET 7 iOS/Android.
We have a simple RadContentView MAUI markup page:
<?xml version="1.0" encoding="utf-8" ?>
<telerik:RadContentView xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:telerik="http://schemas.telerik.com/2022/xaml/maui"
x:Class="MAUIThirdPartyControlPOC.RichTextEditorView">
<Grid RowDefinitions="{OnIdiom Phone='*, Auto'}">
<telerik:RadRichTextEditor x:Name="richTextEditor"
Grid.Row="{OnIdiom Phone=0}"
Source="{Binding Source}">
</telerik:RadRichTextEditor>
<telerik:RadRichTextEditorToolbar x:Name="richTextToolbar"
Grid.Row="{OnIdiom Default=1, Phone=1}"
RichTextEditor="{x:Reference richTextEditor}"
Margin="{OnIdiom Phone=0}" />
</Grid>
</telerik:RadContentView>
Then in our sample iOS application we are doing the following to do Native Embedding:
using Foundation;
using Microsoft.Maui.Embedding;
using UIKit;
using Telerik.Maui.Controls.Compatibility;
using Telerik.Maui.Controls;
using Microsoft.Maui.Platform;
using Microsoft.Maui.Controls;
namespace MAUIThirdPartyControlPOC;
[Register ("AppDelegate")]
public class AppDelegate : UIApplicationDelegate {
public override UIWindow? Window {
get;
set;
}
public static MauiContext _mauiContext;
public override bool FinishedLaunching (UIApplication application, NSDictionary launchOptions)
{
// create a new window instance based on the screen size
Window = new UIWindow(UIScreen.MainScreen.Bounds);
// create a UIViewController with a single UILabel
var vc = new UIViewController();
vc.View.BackgroundColor = UIColor.Orange;
Window.RootViewController = vc;
// make the window visible
Window.MakeKeyAndVisible();
MauiAppBuilder builder = MauiApp.CreateBuilder();
builder.UseMauiEmbedding<Microsoft.Maui.Controls.Application>();
builder.UseTelerik();
// Register the Window
builder.Services.Add(new Microsoft.Extensions.DependencyInjection.ServiceDescriptor(typeof(UIWindow), Window));
MauiApp mauiApp = builder.Build();
_mauiContext = new MauiContext(mauiApp.Services);
var richText = new RichTextEditorView();
var richTextView = richText.ToPlatform(_mauiContext);
richTextView.TranslatesAutoresizingMaskIntoConstraints = false;
vc.View!.AddSubview(richTextView);
NSLayoutConstraint.ActivateConstraints(new[]
{
richTextView.WidthAnchor.ConstraintEqualTo(vc.View.WidthAnchor),
richTextView.HeightAnchor.ConstraintEqualTo(vc.View.HeightAnchor)
});
return true;
}
}
When you run this, and focus in the RichTextEditor, the on screen keyboard on iOS appears, however the content's inset does not slide up so that the toolbar is accessible.
The only mention of the keyboard pushing contents was on the RTB's documentation page:
RadRichTextEditorToolbar
is positioned under the keyboard, when the keyboard shows, the control is translated over the keyboard so users can access it without a problem. Due to the .NET MAUI implementation, it is important that the RadRichTextEditorToolbar
is placed in a container which bounds will contain it after the control is translated over the keyboard. Otherwise, the tap and pan gestures on the RadRichTextEditorToolbar
will not work until the keyboard is hidden and the control is translated back to its original place.However it does not mention anything about how to handle it with Native embedding.
Thanks in advance.
For example, I copy image from the device and want to paste it in the editor. Then when get the html I want the image to have a valid src.
on MacCatalyst when pasting image in the editor and then GetHtmlAsync the image src is:
<img src="blob:null/" ..../>
on WinUI, I cannot paste image in the editor, copied from outside of the editor.
Please provide a support for a placeholder text in RichTextEditor (an optional text displayed when edited content is empty).
Best if color of this text could be configurable.
Makes the KeyboardHelper class public. It is very useful and It would be a nice enhancement to the control's usage.
for example in the RichTextEditorToolbar, also the class is used inside the RadChart control template.
Keyboard remains open when taping outside of the RichTextEditor control
I have tried using the HideSoftInputOnTapped of ContentPage when is set to true but this does not help. This property is set on Page level and when input control (Entry) has the focus and the user taps outside of the control, the keyboard hides.
Provide such an option for the RichTextEditor control.
I can load an image and then resize it . But if I save it as a docx document and the I reload it, the image has the original size: the resized image is not saved.
You can test this in the Telerik MAUI ControlsSamples app, Import export example of the RichTextEditor control.