xamarin.ios - How to use AutoLayout in Xamarin iOS? -


i creating view without using storyboard or xib. using mvvmcross in project , binding controls this:

using system; using system.drawing;  using corefoundation; using uikit; using foundation; using cirrious.mvvmcross.touch.views; using cirrious.mvvmcross.binding.bindingcontext;  namespace mobile.ios.views {     /// <summary>     ///  home screen of iphone     /// </summary>     [register("homeview")]     public class homeview : mvxviewcontroller     {            /// <summary>         /// method load view         /// </summary>         public override void viewdidload()         {             view = new uiview() { backgroundcolor = uicolor.white };             this.title = "home";             base.viewdidload();              var lblhome = new uilabel(new rectanglef(80, 100, 300, 40));             lblhome.textcolor = uicolor.green;             add(lblhome);              var btnsignin = new uibutton(uibuttontype.roundedrect);             btnsignin.settitle("move login screen", uicontrolstate.normal);             btnsignin.frame = new rectanglef(10, 200, 300, 40);             add(btnsignin);              var set = this.createbindingset<homeview, homeviewmodel>();             set.bind(lblhome).to(vm => vm.hometitle);             set.bind(btnsignin).to(vm => vm.login);             set.apply();              // perform additional setup after loading view         }          } } 

i want use autolayout design view. views looks fine , similar in iphone device (4s, 5, 5s, 6) , views (portrait or landscape).

without knowing excatly how want label , button react size changes. came this:

using system; using system.drawing;  using corefoundation; using uikit; using foundation; using cirrious.mvvmcross.touch.views; using cirrious.mvvmcross.binding.bindingcontext;  namespace mobile.ios.views {     /// <summary>     ///  home screen of iphone     /// </summary>     [register("homeview")]     public class homeview : mvxviewcontroller     {           uilabel lblhome;         uibutton btnsignin;          public override void viewdidload ()         {             base.viewdidload ();              view = new uiview() { backgroundcolor = uicolor.white};             this.title = "home";             base.viewdidload();              //          var lblhome = new uilabel( new rectanglef(80,100,300,40) );                       lblhome = new uilabel();             lblhome.translatesautoresizingmaskintoconstraints = false; // need autolayout             lblhome.text = "home label";             lblhome.textalignment = uitextalignment.center;             lblhome.textcolor = uicolor.green;             lblhome.backgroundcolor = uicolor.cyan;             add( lblhome );              btnsignin = new uibutton( uibuttontype.roundedrect );             btnsignin.settitle( "move login screen", uicontrolstate.normal );              btnsignin.backgroundcolor = uicolor.magenta;             //          btnsignin.frame = new rectanglef( 10, 200, 300, 40 );             btnsignin.translatesautoresizingmaskintoconstraints = false;  // need autolayout             add( btnsignin );              setupautolayoutconstraints ();              var set = this.createbindingset<homeview, homeviewmodel>();             set.bind( lblhome ).to( vm => vm.hometitle );             set.bind( btnsignin ).to( vm => vm.login );             set.apply();         }    private void setupautolayoutconstraints()     {         view.addconstraints (new [] {             // makes width of lblhome same width view , -20             nslayoutconstraint.create(lblhome, nslayoutattribute.width, nslayoutrelation.equal, view, nslayoutattribute.width, 1, -20),             // makes height of lblhome 40             nslayoutconstraint.create(lblhome, nslayoutattribute.height, nslayoutrelation.equal, null, nslayoutattribute.noattribute, 1, 40),             // makes top of lblhome 100 top of view             nslayoutconstraint.create(lblhome, nslayoutattribute.top, nslayoutrelation.equal, view, nslayoutattribute.top, 1, 100),             // centers lblhome in view along x-axis             nslayoutconstraint.create(lblhome, nslayoutattribute.centerx, nslayoutrelation.equal, view, nslayoutattribute.centerx, 1, 0)         });           view.addconstraints (new [] {             // makes width of btnsignin same width lblhome             nslayoutconstraint.create(btnsignin, nslayoutattribute.width, nslayoutrelation.equal, lblhome, nslayoutattribute.width, 1, 0),             // makes height of btnsignin same height lblhome             nslayoutconstraint.create(btnsignin, nslayoutattribute.height, nslayoutrelation.equal, lblhome, nslayoutattribute.height, 1, 0),             // makes top of btnsignin 60 bottom of lblhome             nslayoutconstraint.create(btnsignin, nslayoutattribute.top, nslayoutrelation.equal, lblhome, nslayoutattribute.bottom, 1, 60),             // centers btnsignin in view along x-axis             nslayoutconstraint.create(btnsignin, nslayoutattribute.centerx, nslayoutrelation.equal, view, nslayoutattribute.centerx, 1, 0)         });     }     } } 

when using autolayout dont want set , frames rather add views set constraints in setupautolayoutconstraints method.

helpful links on auto layout:

raywenderlich tutorial

other tutorial

hope helps!


Comments

Popular posts from this blog

How has firefox/gecko HTML+CSS rendering changed in version 38? -

javascript - Complex json ng-repeat -

jquery - Cloning of rows and columns from the old table into the new with colSpan and rowSpan -