Wednesday, 27 December 2017

Xamarin.Forms Curved Entry

Hello My Xamarin Friends,
This is my new post in which I am going to tell you how  to customize the Entry. 
Entry is a rectangular input frame control in which we can give any type of text input and in this post, we are going to discuss custom entry, this entry will make curved Corner entry.
Let's start........



First, we will  create a class whose name is "CustomEntry" and then we will write a code in "C #".

Now, we will write some code in android project to set the Border Color, Width, Radius and Background Color, IsCurvedCornersEnabled ....
Please make sure to dependency reference.....
[assembly: ExportRenderer(typeof(CustomLabel), typeof(CurvedLabelRenderer))]

Then we create an Ios Project Also

Please make sure to add view reference.....
xmlns:local="clr-namespace:CustomEntryApp"
then write xaml code in main page.

TADDAAAA!

 Now, you will  have your CustomEntry working!!


Public Property Entry controls

    1. FontAttributes FontAttributes=(FontAttributes="Bold")
    2. FontSize Double=(FontSize="Default")
    3. IsPassword Boolean=(IsPassword="True")
    4. Placeholder String=( Placeholder="Xamarin Buddy")
    5. Text String (Text="Xamarin Buddy")
    6. PlaceholderColor Color=( PlaceholderColor="Red")
    7. TextColor Color=(TextColor="DarkBlue")
    8. FontFamily String=(FontFamily="")
    9. HorizontalTextAlignment TextAlignment=(HorizontalTextAlignment="Start")
 Features of CustomEntry controls

  1. Custom Border Color Property=(CustomBorderColor="#24C4FF")
  2. Custom Background Color Property=(CustomBackgroundColor="#24C4FF")
  3. Custom Border Radius Property=(CustomBorderRadius="4")
  4. Custom Border Width Property=(CustomBorderWidth="4")
  5. Custom IsCurvedCornersEnabled =(IsCurvedCornersEnabled ="True")
To get full source code Click Here
To watch video Click Here

8 comments:

  1. Awesome information. Can you help me with the CustomEntryRenderer for UWP project? It's similar to the Android? Thanks!

    ReplyDelete
  2. This comment has been removed by the author.

    ReplyDelete
  3. On android, the background color of the Entry is Drawing out of the limits of the border. Set your custom entry's BackgroundColor to Red and you will see that on the corners of the control, the background is not being clipped as we expect. Do you know how to make it clip the background to keep is just inside of the borders ?

    ReplyDelete
    Replies
    1. It seems the original background property is not overridden in the drawable. So you have to create a new property in the CustomEntry, something like NewBackgroundColor, and then use that instead, and then just don't use the original BackgroundColor. That should solve your problem.

      Delete
  4. Pease add UWP!
    Thank you!

    ReplyDelete
  5. Thank you so much for sharing this excellent information. Your article is amazing. Good to discover your post
    Hire Xamarin Developer Texas, USA

    ReplyDelete
  6. I read your post its amazing and the i agree your all points because all is very good informative and meaningful in the post. Well done nice efforts Thanks you for sharing blog.

    Hire Xamarin Developer

    ReplyDelete

Featured Post

Sliding Entry In Xamarin.Forms

  Today, I am going to show you how to create a Custom Slide entry in Xamarin.Forms with animation and also using gradient color. here is Y...