Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How can you round only 2 of the corners on a Xamarin.iOS UITableView?

I'm developing an iPad app using the current version of Xamarin.iOS with C# and am trying to create a UITableView that has only two of it's corners (top right and bottom right) rounded. I know how get all the corners rounded by setting the myTable.Layer.CornerRadius = 6f; but don't know how to only round two of them. I've looked around SO but can only see answers for Objective-C. This is what I have currently:

    private UIView GetModalRowHeaderView2(RectangleF bounds)
    {
        UIView view = new UIView(bounds);
        view.BackgroundColor = UIColor.Gray;

        string[] tableItems = new string[] {"Item One","Item Two","Item Three"};

        UITableView myTable = new UITableView(new RectangleF(0, 20, bounds.Width, bounds.Height - 40), UITableViewStyle.Plain);
        myTable.SeparatorInset = UIEdgeInsets.Zero;
        myTable.ScrollEnabled = false;
        myTable.Source = new TableSource(tableItems);

        // Rounds all corners
        myTable.Layer.CornerRadius = 6f;

        view.Add(myTable);

        return view;
    }

Any ideas how I can change this to only round two of the corners?

Thanks,

like image 249
Gavin Sutherland Avatar asked Jan 24 '14 10:01

Gavin Sutherland


People also ask

How do you round the corners of a view?

You can give it round corners by changing the cornerRadius property of the view's layer . and smaller values give less rounded corners. Both clipsToBounds and masksToBounds are equivalent. It is just that the first is used with UIView and the second is used with CALayer .

How do you round one corner in Swift?

If you want only some corners to be rounded, you should set the layer's maskedCorners property to be an array of the corners you want – it's an option set, so you can set one or many depending on your needs.


2 Answers

Since iOS 11, there is a new property called :

For example 3 gives me both top corners round

view.Layer.MaskedCorners = (CoreAnimation.CACornerMask)3;
view.Layer.CornerRadius = 15f;
  • 0: no rounded corners
  • 1: top left
  • 2: top right
  • 3: top left & right (both top corners)
  • 4: bottom left
  • 5: top & bottom left (both left corners)
  • 6: top right & bottom left
  • 7: top left & right, bottom left (all corners except bottom right)
  • 8: bottom right
  • 9: top left, bottom right
  • 10: top & bottom right (both right corners)
  • 11: both top corners, bottom right (all corners except bottom left)
  • 12: bottom left & right (both bottom corners)
  • 13: bottom left & right, top left (all corners except top right)
  • 14: bottom left & right, top right (all corners except top left)
  • 15: all corners rounded
like image 71
Rodrigue Avatar answered Oct 28 '22 23:10

Rodrigue


You will need to work with masking layers. In my Github repo I have Xamarin.iOS code for a rectangular view with rounded corners. You can use this as a start.

Excerpt from the code:

UIBezierPath maskPath = UIBezierPath.FromRoundedRect (this.Bounds, this.eRoundedCorners, new SizeF (this.fCornerRadius, this.fCornerRadius));

CAShapeLayer maskLayer = new CAShapeLayer ();
maskLayer.Frame = this.Bounds;
maskLayer.Path = maskPath.CGPath;

// Set the newly created shape layer as the mask for the image view's layer
this.Layer.Mask = maskLayer;
like image 41
Krumelur Avatar answered Oct 29 '22 00:10

Krumelur