Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

AbsoluteLayout.LayoutBounds position using Xamarin.form Xaml

In Xamarin.form Xaml :When I am giving AbsoulteLayout layoutBounds(.5,.5,.5,.5) its coming on center but not for ios... and If I'm using (.75,.75,.5,.5) its coming on center for ios not for android in Xamarin form xaml page.....How to have same layoutBounds for both ios and android

Given Example:

<AbsoluteLayout BackgroundColor="#99000000"
                    HorizontalOptions="FillAndExpand"                   
                    IsVisible="{Binding xyz}"
                    VerticalOptions="FillAndExpand">

      <AbsoluteLayout x:Name="xyz"
                     AbsoluteLayout.LayoutBounds="0.5, 0.5, 0.5, 0.5"
                     AbsoluteLayout.LayoutFlags="All"
                       BackgroundColor="Transparent"
                       HorizontalOptions="CenterAndExpand"
                       VerticalOptions="CenterAndExpand" />
</AbsoluteLayout>
like image 975
Pooja Rawat Avatar asked Aug 01 '16 11:08

Pooja Rawat


People also ask

What is AbsoluteLayout LayoutBounds?

An AbsoluteLayout can position and size children using proportional values. This is achieved by adding children to the Children collection of the AbsoluteLayout , and by setting the AbsoluteLayout. LayoutBounds attached property on each child to proportional position and/or size values in the range 0-1.

What is StackLayout in xamarin forms?

StackLayout organizes views in a one-dimensional line ("stack"), either horizontally or vertically. Views in a StackLayout can be sized based on the space in the layout, using layout options.

What is Flex layout in xamarin forms?

It is based on the CSS Flexible Box Layout Module, commonly known as flex layout or flex-box, so called because it includes many flexible options to arrange children within the layout. FlexLayout is similar to the Xamarin. Forms StackLayout in that it can arrange its children horizontally and vertically in a stack.


2 Answers

Thanks for replies. I have resolved the problem related to center alignment of in absolute layout, hope this is helpful

    <AbsoluteLayout Padding="0" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand"    IsVisible="{Binding ShowPopup}">
        <BoxView Color="#99000000" AbsoluteLayout.LayoutBounds="0, 0, 1, 1" AbsoluteLayout.LayoutFlags="All" />
        <StackLayout x:Name="Popup" Padding="6" Orientation="Horizontal" BackgroundColor="Transparent" AbsoluteLayout.LayoutBounds="0.5, 0.5, -1, -1" AbsoluteLayout.LayoutFlags="PositionProportional">
        </StackLayout>
    </AbsoluteLayout>
like image 178
Pooja Rawat Avatar answered Oct 25 '22 19:10

Pooja Rawat


You can use OnPlatform to have different values on different platforms.

Eg:

<ContentPage.Padding>
    <OnPlatform x:TypeArguments="Thickness">
      <OnPlatform.iOS>
        0, 20, 0, 0
      </OnPlatform.iOS>
      <OnPlatform.Android>
        0, 0, 0, 0
      </OnPlatform.Android>
      <OnPlatform.WinPhone>
        0, 0, 0, 0
      </OnPlatform.WinPhone>
    </OnPlatform>
  </ContentPage.Padding>

Modifying your code (untested) :

<AbsoluteLayout BackgroundColor="#99000000"
                    HorizontalOptions="FillAndExpand"                   
                    IsVisible="{Binding xyz}"
                    VerticalOptions="FillAndExpand">

      <AbsoluteLayout x:Name="xyz"                     
                       AbsoluteLayout.LayoutFlags="All"
                       BackgroundColor="Transparent"
                       HorizontalOptions="CenterAndExpand"
                       VerticalOptions="CenterAndExpand" >
            <AbsoluteLayout.LayoutBounds>
                     <OnPlatform x:TypeArguments="Rectangle">
                        <OnPlatform.iOS>
                              0.75, 0.75, 0.5, 0.5
                        </OnPlatform.iOS>
                        <OnPlatform.Android>
                              0.5, 0.5, 0.5, 0.5
                        </OnPlatform.Android>
                        <OnPlatform.WinPhone>
                              0, 0, 0, 0
                        </OnPlatform.WinPhone>
                     </OnPlatform>
            </AbsoluteLayout.LayoutBounds>
      </AbsoluteLayout>
</AbsoluteLayout>
like image 23
Rohit Vipin Mathews Avatar answered Oct 25 '22 18:10

Rohit Vipin Mathews