Estoy trabajando para agregar una superposición de medio círculo fijo en el fondo en la parte inferior de la página.
Estructura de todas las páginas en la aplicación (todas las páginas responden)
<ContentPage.Content> <StackLayout> // Top Bar => Icons etc <StackLayout VerticalOptions="Start"> </StackLayout> // Center => Content <StackLayout HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand"> </StackLayout> // End => Button <StackLayout HorizontalOptions="Center" VerticalOptions="End"> </StackLayout> </StackLayout> </ContentPage.Content>Ahora, quería agregar una superposición de medio círculo, pero no podía hacerlo por código, así que usé la imagen para esta superposición de medio círculo.
Quería agregarlo en el último StackLayout , pero no puedo poner RelativeLayout en StackLayout . Entonces, eliminé el último StackLayout y pegué el código RelativeLayout en su lugar.
<RelativeLayout HorizontalOptions="End"> <Image Source="drawable/background_halfcircle.png" RelativeLayout.WidthConstraint= "{ConstraintExpression Type=RelativeToParent, Property=Width}" RelativeLayout.HeightConstraint= "{ConstraintExpression Type=RelativeToParent, Property=Height}"/> <Grid RelativeLayout.WidthConstraint= "{ConstraintExpression Type=RelativeToParent, Property=Width}" RelativeLayout.HeightConstraint= "{ConstraintExpression Type=RelativeToParent, Property=Height}"> <Button Text="Button" Margin="0,0,0,10"/> </Grid> </RelativeLayout> Ahora, el problema es que empujó todo el código en Start & Center StackLayout hacia la parte superior (lo estiró, luciendo terrible).
¿Cómo podría agregar esta Superposición de medio círculo en la parte inferior de cada página y el StackLayout anterior no se ve afectado?
Más fácil de superponer usando una cuadrícula de una fila:
<ContentPage.Content> <Grid> <!-- Grid Row/Column default to 0. --> <StackLayout> ... everything that isn't in the overlay ... </StackLayout> <!-- Grid Row/Column default to 0; so overlaid on StackLayout --> <RelativeLayout ... ... </RelativeLayout> </Grid> </ContentPage.Content>De hecho, nunca uso RelativeLayout. Puede hacer todo lo que quiera usando las filas y columnas de Grid.
En papel, dibuje el diseño deseado. Dibuja líneas verticales y horizontales para separar las áreas. Entonces puede determinar cómo poner en una cuadrícula. Por ejemplo, un área puede abarcar dos columnas.