How to make Round corner Entry Control Xamarin.For

2019-09-05 08:03发布

问题:

I have to use round corner entry in Xamarin.Forms, but I have not get any solution for this.

I am trying to get this look and feel:

Please help me with this issue.

回答1:

I had exact same requirement and decided to create custom control called EntryEx. You can find the source code HERE.

Here is the list of functions that this control supports.

  1. Setting border color
  2. Setting border width
  3. Setting corner radius
  4. You can also set left and right paddings to inset content of entry from left and right.

I've created custom renderers for iOS and Android to support this properties. To use the control just do the following.

  1. Add EntryEx to your forms project.
  2. Added EntryExRenderer-s for iOS and Android to corresponding projects.
  3. For android you'll also need to add BorderRenderer.
  4. Adjust namespaces.

That's all. Enjoy.



回答2:

I'm not sure if there's something wrong with this approach or not, because it seems so simple but no one's suggesting it.

But I don't see why you can't just use a Frame with IsClippedToBounds set to true. That gives you a built-in corner radius, which you can then adjust as needed.

        <Grid>               
             <Frame
                   CornerRadius     ="20"
                   IsClippedToBounds="true">
                <Editor />
            </Frame>
         </Grid>

I'm currently using this solution and it works for me.



回答3:

kyurkchyan's solution is bang on, just change the UpdateBackground method in the Android entryRendere to this:

private void UpdateBackground(XEntry xEntry)
    {
        if (_renderer != null)
        {
            _renderer.Dispose();
            _renderer = null;
        }
        var oldBg = xEntry.BackgroundColor;
        xEntry.BackgroundColor = Xamarin.Forms.Color.Transparent;
        _renderer = new BorderRenderer();
        Control.SetBackground(_renderer.GetBorderBackground(xEntry.BorderColor, oldBg, xEntry.BorderWidth, xEntry.BorderRadius));

    }

and it will work on Android as well!