Xamarin Forms Entry box does not scroll horizontally in iOS - xamarin.forms

Question

If I have an Entry in my Xamarin Forms project and I keep typing on it until it goes off the end of the viewable page the text does not horizontally scroll in iOS as it does on Android - is there a way to make it do this?
I've tried replacing it with an Editor, but that doesn't have a placeholder, which I need.

Answer 1

An Entry is rendered as a UITextField on iOS which does not support scrolling. An Editor is rendered as a UITextView which does support scrolling.
One option would be to create a custom editor that includes a placeholder.
I have code for this. It's not pretty but it works.
Here is the CustomEditor code including new bindable properties for placeholder text and color.
public class CustomEditor : Editor
{
public static readonly BindableProperty PlaceholderProperty =
BindableProperty.Create(nameof(Placeholder), typeof(string), typeof(CustomEditor), default(string));
public string Placeholder
{
get { return (string)GetValue(PlaceholderProperty); }
set { SetValue(PlaceholderProperty, value); }
}
public static readonly BindableProperty PlaceholderColorProperty =
BindableProperty.Create(nameof(PlaceholderColor), typeof(Color), typeof(CustomEditor), default(Color));
public Color PlaceholderColor
{
get { return (Color)GetValue(PlaceholderColorProperty); }
set { SetValue(PlaceholderColorProperty, value); }
}
public static readonly BindableProperty DisabledColorProperty =
BindableProperty.Create(nameof(DisabledColor), typeof(Color), typeof(CustomEditor), default(Color));
public Color DisabledColor
{
get { return (Color)GetValue(DisabledColorProperty); }
set { SetValue(DisabledColorProperty, value); }
}
}
Here is the iOS custom renderer
[assembly: ExportRenderer(typeof(CustomEditor), typeof(CustomEditorRenderer))]
namespace Test.iOS.CustomRenderers
{
public class CustomEditorRenderer : EditorRenderer
{
private UILabel PlaceholderLabel { get; set; }
protected override void OnElementChanged(ElementChangedEventArgs<Editor> e)
{
base.OnElementChanged(e);
if (Control == null) return;
Control.Layer.BorderWidth = 0.5f;
Control.Layer.CornerRadius = 8;
Control.Layer.BorderColor = Color.FromHex("CDCDCD").ToCGColor();
if (PlaceholderLabel != null) return;
var element = Element as CustomEditor;
PlaceholderLabel = new UILabel
{
Text = element?.Placeholder,
TextColor = element?.PlaceholderColor.ToUIColor(),
BackgroundColor = UIColor.Clear
};
var edgeInsets = Control.TextContainerInset;
var lineFragmentPadding = Control.TextContainer.LineFragmentPadding;
Control.AddSubview(PlaceholderLabel);
var vConstraints = NSLayoutConstraint.FromVisualFormat(
"V:|-" + edgeInsets.Top + "-[PlaceholderLabel]-" + edgeInsets.Bottom + "-|", 0, new NSDictionary(),
NSDictionary.FromObjectsAndKeys(
new NSObject[] { PlaceholderLabel }, new NSObject[] { new NSString("PlaceholderLabel") })
);
var hConstraints = NSLayoutConstraint.FromVisualFormat(
"H:|-" + lineFragmentPadding + "-[PlaceholderLabel]-" + lineFragmentPadding + "-|",
0, new NSDictionary(),
NSDictionary.FromObjectsAndKeys(
new NSObject[] { PlaceholderLabel }, new NSObject[] { new NSString("PlaceholderLabel") })
);
PlaceholderLabel.TranslatesAutoresizingMaskIntoConstraints = false;
Control.AddConstraints(hConstraints);
Control.AddConstraints(vConstraints);
PlaceholderLabel.Hidden = Element.Text.NotEmpty();
}
protected override void OnElementPropertyChanged(object sender, System.ComponentModel.PropertyChangedEventArgs e)
{
base.OnElementPropertyChanged(sender, e);
if (e.PropertyName == "Text")
{
PlaceholderLabel.Hidden = Control.Text.NotEmpty();
}
if (e.PropertyName == VisualElement.IsEnabledProperty.PropertyName)
{
var element = Element as CustomEditor;
SetTextColor(element);
}
}
private void SetTextColor(CustomEditor element)
{
Control.TextColor = element.IsEnabled ? element.TextColor.ToUIColor() : element.DisabledColor.ToUIColor();
}
}
}