Skip to main content

Placeholder text in Xamarin.Forms Editor

Standard Xamarin.Forms Xamarin.Forms.Editor control offers edit capabilities similar to Entry but for multiline text. Unfortunately unlike Entry it doesn’t support displaying placeholder text out of the box. Implementing this functionality with custom renderers can be tricky. Let’s see how to do this on Android and iOS.

First step, as for every custom renderer, is to create a custom Forms control:

Internally Android Editor renderer uses EditText control. It natively supports placeholder text so the implementation is pretty simple:

iOS implementation is more tricky. The internal Editor control is UITextView which doesn’t provide such functionality. This behavior can be imitated in at least two different ways.
The first is to display the placeholder simply as the same text as the standard control content. This can be hard to style differently than standard text. Also changes detection can lead to bugs (i.e. if user enters the same text as the placeholder).
The second one is to introduce additional label which will act as the placeholder. Here is the sample code:

The placeholder appearance logic is handled by UITextView Changed and Ended events. Unsubscribing from those events is important at control disposal to prevent memory leaks.

I decided to use Cirrious.FluentLayouts library to simplify the controls positioning. Feel free to choose whatever approach works for you in this matter.

Happy coding!