Quantcast
Channel: Xamarin.Forms — Xamarin Community Forums
Viewing all articles
Browse latest Browse all 75885

Nested RelativeLayout in XAML

$
0
0

Hi,

I have some issues to control the position of a RelativeLayout nested in another RelativeLayout.
My goal is to achieve somehow a Carousel, but without the swipe. I'll translate the pages manually.
So I have an overall RelativeLayout with a background followed by a StackLayout horizontal that contains the pages that are defined inside a RelativeLayout.

My code looks like this:

<?xml version="1.0" encoding="UTF-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" 
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
    x:Class="MyApp.MyCarouselPage">

    <RelativeLayout>
        <Image Source="Background.jpg" Aspect="AspectFill"
            RelativeLayout.XConstraint=
                "{ConstraintExpression Type=Constant,
                Constant=0}"
            RelativeLayout.YConstraint=
                "{ConstraintExpression Type=Constant,
                Constant=0}"
            RelativeLayout.WidthConstraint=
                "{ConstraintExpression Type=RelativeToParent,
                Property=Width,
                Factor=1.00}"
            RelativeLayout.HeightConstraint=
                "{ConstraintExpression Type=RelativeToParent,
                Property=Height,
                Factor=1.00}" />

        <StackLayout Orientation="Horizontal" 
                RelativeLayout.WidthConstraint=
                    "{ConstraintExpression Type=RelativeToParent,
                    Property=Width,
                    Factor=3.00}"> <!-- 3 pages -->

                <RelativeLayout x:Name="Page1"
                    RelativeLayout.XConstraint=
                        "{ConstraintExpression Type=RelativeToParent,
                        Property=Width,
                        Factor=0.00}"
                    RelativeLayout.WidthConstraint=
                        "{ConstraintExpression Type=RelativeToParent,
                        Property=Width,
                        Factor=0.33}">
                    <!-- ... -->
                </RelativeLayout>

                <RelativeLayout x:Name="Page2"
                    RelativeLayout.XConstraint=
                        "{ConstraintExpression Type=RelativeToParent,
                        Property=Width,
                        Factor=0.33}"
                    RelativeLayout.WidthConstraint=
                        "{ConstraintExpression Type=RelativeToParent,
                        Property=Width,
                        Factor=0.33}">
                    <!-- ... -->
                </RelativeLayout>

                <RelativeLayout x:Name="Page3"
                    RelativeLayout.XConstraint=
                        "{ConstraintExpression Type=RelativeToParent,
                        Property=Width,
                        Factor=0.66}"
                    RelativeLayout.WidthConstraint=
                        "{ConstraintExpression Type=RelativeToParent,
                        Property=Width,
                        Factor=0.33}">
                    <!-- ... -->
                </RelativeLayout>

        </StackLayout>
    </RelativeLayout>
</ContentPage>

With this, pages aren't displayed like I want. Also for instance inside page 1 I declared a button which has a width constraint of factor 1 of its parent. But it's like it's taking 3 pages long. So it's considering the StackLayout as its parent and not its direct parent.

Is this always the case, I mean is it relative to its grand parent and not parent?
Also can I use a negative factor in a constraint relative to parent? to be able to translate a page on the left?


Viewing all articles
Browse latest Browse all 75885

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>