How to Use Anchor Layout

Question

I am struggling to grasp the usage of Anchor layout. I have the following code constructor:

LokationView()
{


  buildCityUi();
  buildRegionUi();



}

buildCityUi()
{
  cityLbl = new TextView( 'City' );
  addChild( cityLbl );

  cityTxBx = new TextBox( null, 'text' )
  ..profile.width = 'flex '
  ..profile.anchorView = cityLbl
  ..profile.location = 'east center'
  ..on.layout.listen( (_) 
    {
      cityTxBx.width = 200;
      cityTxBx.requestLayout();  
    });


  addChild(cityTxBx );

}

buildRegionUi()
{

  regionLbl = new TextView( 'Region' )
  ..profile.anchorView = cityLbl
  ..profile.location = 'south start';    
  addChild( regionLbl );

  regionTxBx = new TextBox( null, 'text' )
  ..profile.width = 'flex 1'
  ..profile.anchorView = regionLbl
  ..profile.location = 'east center';
  addChild( regionTxBx );
}

I am trying to get the following done: 1. create the label view with there corresponding TexTBox view. 2. Get the TextBox views to occupy the remainder of the browser space with the views varying as the browsers width is changed.

Thanks

Answer 1

AnchorLayout is not the answer. Rather, LinearLayout shall help.