Search This Blog

Monday 5 August 2019

Xamarin.Forms Entry just with bottom border (iOS)

In Xamarin Form Project Create ExtendedEntry Class that Inherit the Entry Class


ExtendedEntry.cs
using System;
using System.Collections.Generic;
using System.Text;
using Xamarin.Forms;

namespace MeChatApp.Renderer
{
    public class ExtendedEntry: Entry
    {

    }
}


Then in iOS Project Create the Class ExtendedEntryRenderer.cs  that Inherit the EntryRenderer class

ExtendedEntryRenderer.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using CoreAnimation;
using Foundation;
using MeChatApp.iOS.Renderer;
using MeChatApp.Renderer;
using UIKit;
using Xamarin.Forms;
using Xamarin.Forms.Platform.iOS;

[assembly: ExportRenderer(typeof(ExtendedEntry),typeof(ExtendedEntryRenderer))]
namespace MeChatApp.iOS.Renderer
{
    class ExtendedEntryRenderer : EntryRenderer
    {
        protected override void OnElementChanged(ElementChangedEventArgs<Entry> e)
        {
            base.OnElementChanged(e);
            if (this.Control != null)
            {
                var borderLayer = new CALayer();
                borderLayer.Frame = new CoreGraphics.CGRect(0f, Frame.Height + 5, Frame.Width, 1f);
                borderLayer.BorderColor = UIColor.Gray.CGColor;
                borderLayer.BorderWidth = 1.0f;
                borderLayer.CornerRadius = 1;
                Control.Layer.AddSublayer(borderLayer);
                Control.BorderStyle = UITextBorderStyle.None;
            }
        }
    }
}

Now you can use that in Xaml Page
Tab1.xaml
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:customControl="clr-namespace:MeChatApp.Renderer"
             x:Class="MeChatApp.Views.TabbedPages.Tab1" Title="Buzz"  Icon="menubuzz">
    <ContentPage.Content>
        <StackLayout>
                <customControl:ExtendedEntry  Placeholder="Write Something" />
        </StackLayout>
    </ContentPage.Content>
</ContentPage>

No comments:

Post a Comment

Popular Posts