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!