CODEWITHSUNDEEP
xamllayoutxamarin.forms
Emixam23
Emixam23

Reputation: 3964

Xamarin Forms - XAML layout out of the screen

I'm trying to do the following thing:

enter image description here

The red zone is an AbsoluteLayout that I want to move out of the screen as it's shown. I currently use {Layout}.TranslateTo(); but it uses absolutes position so I don't know if it will work for every device as the picture..

It's hard to explain but just imagine that, I move this layout to 300px (x), then on the phone it works because the screen isn't that large, but on tablet, it will probably not work, because the screen is larger.

Also, if a rotation is made (horizontal mod), then the screen will larger than every other possibilities etc etc..

So, does it exists something, as the proportional values of AbsoluteLayout like 2.0 or -1.0 to put a layout out of the screen, but adapted for every device?

If you understand completely what I mean, do not hesitate to ask me more information about some point :)

Thank in advance !

Upvotes: 1

Views: 1531

Answers (2)

eakgul
eakgul

Reputation: 3698

AbsoluteLayout accepts proportional size between 0 to 1. So you can assign like:

AbsoluteLayout.LayoutBounds="0,0,1,1"
AbsoluteLayout.LayoutFlags="SizeProportional"

which means that starts from (0,0) point and fill entire screen.

Your translating call should be like:

Xaml 

  <AbsoluteLayout x:Name="yourRedOne" AbsoluteLayout.LayoutBounds="0,0,1,1" AbsoluteLayout.LayoutFlags="SizeProportional">
    <!--Your red container content goes here-->

  </AbsoluteLayout>

</AbsolutLayout>

Xaml.cs

yourRedOne.TranslateTo(Width, 0);

for your orientation changes you should also override OnSizeAllocated method in tour View and call TranslateTo method again.

Upvotes: 3

nishantvodoo
nishantvodoo

Reputation: 865

Given you are in a forms project I would read in the screen height and width when app is launched and store it in a global variable. Something like this.

Android onCreate of MainActivity

       //Get Screen Size of Phone for Android
        var metrics = Resources.DisplayMetrics;
        var widthInDp = ConvertPixelsToDp(metrics.WidthPixels);
        var heightInDp = ConvertPixelsToDp(metrics.HeightPixels);
        Global.CurrentScreen.screenWidth = widthInDp;
        Global.CurrentScreen.screenHeight = heightInDp;

    private int ConvertPixelsToDp(float pixelValue)
    {
        var dp = (int)((pixelValue) / Resources.DisplayMetrics.Density);
        return dp;
    }

For iOS in AppDelegate finished launching

Global.CurrentScreen.screenHeight = (int)UIScreen.MainScreen.Bounds.Height;
Global.CurrentScreen.screenWidth = (int)UIScreen.MainScreen.Bounds.Width;

And then translate according to saved size.

Upvotes: 0

Related Questions