xamarin.forms - How to place this Label and Image with Xamarin Forms? -

i'm trying learn xamarin forms , wish try following:

i'm thinking need use relativelayout i'm struggling understand how use provided tools. examples i'm reading use things layoutflags , layoutbounds (like this nice demo , also one).

but no 1 explaining how should using them.

can please explain (bonus points if provide image helper lines, etc) how can i'm trying in image?

image: it's it's anchored bottom right corner.

label: it's it's centered .. , pushed down top 20% odd..

you have nice examples here: syntaxismyui. there can relative parent , parent.width example.

else can screensize according this: xamarin.forms kickstarter

good luck!

---

update:

public class mypage : contentpage {     public mypage ()     {         label label = new label {              backgroundcolor = color.blue,             text = "label",             xalign = textalignment.center,         };         boxview image = new boxview {              backgroundcolor = color.aqua,         };         boxview frame = new boxview {              backgroundcolor = color.blue,             heightrequest = 2000, //this ignored in rellayout         };          relativelayout rellayout = new relativelayout ();                   //create relative layout parent         rellayout.backgroundcolor = color.red;                              //this full screen if view          rellayout.children.add (label,                                      //add children of             constraint.relativetoparent ((parent) => parent.width / 4),     //left side of label quarter in on screen             constraint.relativetoparent ((parent) => parent.height / 5),    //pushed down fifth (20%) on screen             constraint.relativetoparent ((parent) => parent.width / 2));    //width half screen size          rellayout.children.add (frame,                                      //what frame around picture             constraint.relativetoparent ((parent) => parent.width / 2),     //left side begin in middle of screen along x-axis             constraint.relativetoparent ((parent) => parent.height - 60),   //top side 60 dp bottom of view (parent, case entire screen)             constraint.relativetoparent ((parent) => parent.width / 2-10),  //width half screen - 30 dp fit inside frame             constraint.constant (50));                                      //height set 50 dp           rellayout.children.add (image,                                      //your image             constraint.relativetoview (frame,                  new func<relativelayout, view, double> ((prellayout, pframe) => frame.x + 5)), //inside frame 10 db             constraint.relativetoview (frame,                 new func<relativelayout, view, double> ((prellayout, pframe) => frame.y + 5)),  //10 dp inside frame             constraint.relativetoview (frame,                 new func<relativelayout, view, double> ((prellayout, pframe) => frame.width - 10)),//width same frame - 10 dp (5 on each side)             constraint.relativetoview (frame,                 new func<relativelayout, view, double> ((prellayout, pframe) => frame.height - 10)));//height set same frame height-10 add 5 dp inside frame          this.content = rellayout;     } }