Absolute Layout Border

kalyani.2033kalyani.2033 INMember ✭✭
edited October 2015 in Xamarin.Forms

Hi All,

Please guide me is it possible to give border and border radius and border color to absolute layout.

this._absoluteLayout.Children.Add (_innerStackLayout, new Rectangle (30,30,AbsoluteLayout.AutoSize,AbsoluteLayout.AutoSize));

in the above code am just giving absolute layout with layouts to new rectangle.

along with layout am planning to give border for absolute layout.
if any one worked on it. please guide me to move further

Posts

  • DiedeSeldeslachtsDiedeSeldeslachts BEMember
    edited June 2016

    I found a way to do this, it's kind of hacky but it works.
    The only elements that have some kind of borders are the Frame and the Button elements.

    Frame f = new Frame(); f.BackgroundColor = Color.Transparent; f.OutlineColor = Color.Black; absoluteLayout.Children.Add(f, new Rectangle(0, 0, 1, 1), AbsoluteLayoutFlags.All);

    This will add a Frame with a border that fills the whole absoluteLayout, the only downside to this is that there is no OutlineWidth or borderWidth property, you could however add a Button instead of a Frame here, to have a bit more options. This is a little more hacky, but it works. If you do this, remember to set a border radrius for the Button.

    If an absoluteLayout is not nessesarry then you could also create a Grid for example, give the grid a padding and a background. Now everything you place in it that is set to fill the Grid will have a "border".

    The last and probably best option however is to make a custom renderer that has the functionallity you want.

  • TonyDTonyD USMember ✭✭✭

    As @DiedeSeldeslachts mentioned, the cleanest way it to do is to use a custom renderer.

    I've done custom renderers for frames with adjustable border radii and outline color.

    The way to do it is to go to Xamarin Form's open source github, find the FrameRenderer for each platform and customize it. It is pretty easy to change since they've hardcoded values (e.g. setRadius(5) ) and all you have to do is change them.

Sign In or Register to comment.