Positioning in Xamarin Forms with Repeater, Relative view and scroll -
i have problem setup proper layout xamarin forms
i need have layout in buttons generated repeater. area must scrollable 3 buttons visible @ moment height of repeater/3, , filling whole area, rest scrolled. buttons need have same height (repeater/3). dont know number of buttons
i have
<scrollview horizontaloptions="fillandexpand" verticaloptions="fillandexpand" grid.row="3" grid.rowspan="2" grid.column="1" backgroundcolor="red"> <relativelayout x:name="xname"> <controls:repeaterview itemssource="{binding buttons}" x:name="test" relativelayout.widthconstraint="{constraintexpression type=relativetoparent,property=width,factor=1,constant=0}" relativelayout.heightconstraint="{constraintexpression type=relativetoparent,property=height,factor=1,constant=0}"> <controls:repeaterview.itemtemplate> <datatemplate> <viewcell> <relativelayout horizontaloptions="fillandexpand" relativelayout.heightconstraint="{constraintexpression type=relativetoview,elementname=test property=height,factor=1,constant=0}"> <button text="{binding name}" relativelayout.widthconstraint="{constraintexpression type=relativetoparent,property=width,factor=1,constant=0}"/> </relativelayout> </viewcell> </datatemplate> </controls:repeaterview.itemtemplate> </controls:repeaterview> </relativelayout> </scrollview>
my code produces sth this:
i need this:
the content of image not important. need have buttons scaled 3 buttons will red area, rest (of same size) scorlled
don't let scrollview
"fillandexpand" vertically. instead, give heightrequest
of 3 buttons + padding or put scrollview
in little container 3 buttons tall.
can put in grid
this:
<grid> <grid.rowdefinitions> <rowdefinition height="3*" /> <rowdefinition height="7*" /> </grid.rowdefinitions> <scrollview horizontaloptions="fillandexpand" verticaloptions="fillandexpand" grid.row="0" backgroundcolor="red"> <controls:repeaterview itemssource="{binding buttons}" x:name="test"> <controls:repeaterview.itemtemplate> <datatemplate> <viewcell> <relativelayout horizontaloptions="fillandexpand" relativelayout.heightconstraint="{constraintexpression type=relativetoview,elementname=test property=height,factor=1,constant=0}"> <button text="{binding name}" relativelayout.widthconstraint="{constraintexpression type=relativetoparent,property=width,factor=1,constant=0}"/> </relativelayout> </viewcell> </datatemplate> </controls:repeaterview.itemtemplate> </controls:repeaterview> </scrollview> </grid>
so first row fill 3/10 (0.3 or 30%) of screen , second row fill 7/10 of screen.
Comments
Post a Comment