Forum Xamarin.Forms

How to make images in a layout follow the axis on another layout?

Hi everyone!
I have a project about a board game. Whenever I try to visualize the same dashboard on tablets, I get problems with the axis of the pawns when resizing the image. I've been thorugh RelativeLayout and StackLayout, all through their methods with no avail.

Phone View:

Tablet View:

Resize View:

How can I make the pawns follow the axis in the dashboard without losing their positions? Here'se my code so far...

    <RelativeLayout x:Name="bacground" BackgroundColor="#325334">
        <ImageButton Source="iconCerrar" Margin="10,40" Clicked="imBtnCloseClicked"/>

        <RelativeLayout Margin="0,50,0,50">
            <Grid Margin="0,115,00,0">
                <Image x:Name="tablero" Source="tablero"
                       HorizontalOptions="CenterAndExpand"
                       VerticalOptions="CenterAndExpand"
                       MinimumHeightRequest="400" MinimumWidthRequest="360"
                       RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
                    Property=Height,Factor=0,Constant=0}"
                       RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent,
                    Property=Width,Factor=1,Constant=0}"
                       RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent,
                    Property=Height,Constant=0}">
                </Image>

                <RelativeLayout AnchorX="50" AnchorY="50">
                    <Image x:Name="IMG_Igno"/>
                    <Image x:Name="IMG_Peon"/>
                </RelativeLayout>
            </Grid>
        </RelativeLayout>
    </RelativeLayout>
Sign In or Register to comment.