AbsoluteLayout with proportional height and with minimum and maximum heights

Refresh

2 weeks ago

Views

5 time

0

We need a banner, called bannerView in the code bellow, to shrink or expand according to the device height.

However this banner height:

  • cannot be smaller than 60 pixels
  • cannot be bigger than 146 pixels

code:

<AbsoluteLayout>
    <StackLayout
        Padding="0"
        AbsoluteLayout.LayoutBounds="0,0,1,1"
        AbsoluteLayout.LayoutFlags="SizeProportional"
        HorizontalOptions="FillAndExpand">
        <AbsoluteLayout
            x:Name="bannerView">
            <Image
                AbsoluteLayout.LayoutBounds="0,0,1.05,1"
                AbsoluteLayout.LayoutFlags="SizeProportional"
                Aspect="AspectFill"
                Source="banner.jpg">
            </Image>
            <Label
                Margin="16,18,16,36"
                AbsoluteLayout.LayoutBounds="0,1,-1,-1"
                AbsoluteLayout.LayoutFlags="PositionProportional"
                Text="{Binding Name}">
            </Label>
            <Label
                Margin="16,18,16,18"
                AbsoluteLayout.LayoutBounds="0,1,-1,-1"
                AbsoluteLayout.LayoutFlags="PositionProportional"
                Text="{Binding EmployeeId}">
            </Label>
        </AbsoluteLayout>
        <StackLayout>
            <!-- Dynamic content -->
        </StackLayout>
    </StackLayout>
</AbsoluteLayout>

Note: We need the outer AbsoluteLayout to add a gradient effect on the screen

0 answers