Как установить приоритет приоритета в стеке? - PullRequest
0 голосов
/ 10 июля 2019

У меня есть хедер на странице, где 'MainContainer' содержит ромб и хедер с. На хедере у меня есть иконка пользователя. При нажатии на этот значок пользовательское меню должно отображаться в виде выпадающего списка. Почти все хорошо, за исключением того, что часть этого меню покрыта bz ромбовидной. Вот мой код и картинки как должно быть и как оно сейчас ...

<ContentPage.Content>
        <RelativeLayout>
            <StackLayout>
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="40" />
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="*" />
                    </Grid.ColumnDefinitions>

                    <StackLayout BackgroundColor="#004A57"
                                 Orientation="Horizontal"
                                 Grid.Row="0"
                                 Grid.Column="0"
                                 Grid.ColumnSpan="2">
                        <Image Source="user.png"
                               HorizontalOptions="Start"
                               VerticalOptions="CenterAndExpand"
                               Margin="20,0,10,0">
                            <Image.GestureRecognizers>
                                <TapGestureRecognizer Command="{Binding ShowAccountInformationCommand}" />
                            </Image.GestureRecognizers>
                        </Image>

                        <Image Source="kliker1.png"
                               HorizontalOptions="Start"
                               VerticalOptions="CenterAndExpand"
                               HeightRequest="16"
                               WidthRequest="16"
                               Margin="20,0,0,0" />

                        <Image Source="kliker2.png"
                               HorizontalOptions="Start"
                               VerticalOptions="CenterAndExpand"
                               HeightRequest="16"
                               WidthRequest="16"
                               Margin="20,0,20,0" />

                        <Image Source="kliker3.png"
                               HorizontalOptions="StartAndExpand"
                               VerticalOptions="CenterAndExpand"
                               HeightRequest="16"
                               WidthRequest="16"
                               Margin="0,0,20,0" />

                        <Image Source="search.png"
                               HorizontalOptions="EndAndExpand"
                               VerticalOptions="CenterAndExpand"
                               Margin="0,0,20,0" />
                    </StackLayout>

                    <Grid IsVisible="{Binding Visibility}"
                          Grid.Row="1"
                          Grid.Column="0">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="40" />
                            <RowDefinition Height="40" />
                            <RowDefinition Height="40" />
                            <RowDefinition Height="40" />
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*" />
                            <ColumnDefinition Width="*" />
                        </Grid.ColumnDefinitions>

                        <StackLayout Grid.Row="0"
                                     Grid.Column="0"
                                     Grid.ColumnSpan="2"
                                     BackgroundColor="#004A57">
                            <Label Text="Avatar&#x0a;Avatarevic"
                                   TextColor="White"
                                   VerticalOptions="CenterAndExpand"
                                   Margin="10,0,0,0" />
                            <Label Text="TST"
                                   Grid.Column="1" />
                        </StackLayout>

                        <StackLayout Grid.Row="1"
                                     Grid.Column="0"
                                     Grid.ColumnSpan="2"
                                     BackgroundColor="#004A57">
                            <Label Text="STATUS"
                                   TextColor="White"
                                   VerticalOptions="CenterAndExpand"
                                   Margin="10,0,0,0" />
                        </StackLayout>
                        <StackLayout Grid.Row="2"
                                     Grid.Column="0"
                                     Grid.ColumnSpan="2"
                                     BackgroundColor="#004A57">
                            <Label Text="UTICAJ"
                                   TextColor="White"
                                   VerticalOptions="CenterAndExpand"
                                   Margin="10,0,0,0" />
                        </StackLayout>

                        <StackLayout Grid.Row="3"
                                     Grid.Column="0"
                                     Grid.ColumnSpan="2"
                                     BackgroundColor="#004A57">
                            <Label Text="TOTAL"
                                   TextColor="White"
                                   VerticalOptions="CenterAndExpand"
                                   Margin="10,0,0,0" />
                        </StackLayout>
                    </Grid>
                </Grid>
            </StackLayout>

            <StackLayout x:Name="MainContainer"
                         RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
                     Property=Height,Factor=0.1,Constant=0}"
                         RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
                     Property=Width,Factor=0,Constant=0}"
                         RelativeLayout.WidthConstraint="{ConstraintExpression
                    Type=RelativeToParent,Property=Width,Factor=1,Constant=0}"
                         RelativeLayout.HeightConstraint="{ConstraintExpression
                    Type=RelativeToParent,Property=Height,Factor=1,Constant=-70}">

                <Grid VerticalOptions="CenterAndExpand"
                      HorizontalOptions="CenterAndExpand"
                      Rotation="45">
                    <!--Margin="0,-240,0,0">-->
                    <Grid.RowDefinitions>
                        <RowDefinition Height="70" />
                        <RowDefinition Height="70" />
                        <RowDefinition Height="70" />
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="70" />
                        <ColumnDefinition Width="70" />
                        <ColumnDefinition Width="70" />
                    </Grid.ColumnDefinitions>

                    <material:MaterialCard CornerRadius="4"
                                           Elevation="1"
                                           Grid.Column="0"
                                           Grid.Row="0"
                                           BackgroundColor="#BBBBBB"
                                           WidthRequest="70"
                                           HeightRequest="70"
                                           VerticalOptions="Center"
                                           Padding="0" />

                    <material:MaterialCard CornerRadius="4"
                                           Elevation="1"
                                           Grid.Column="1"
                                           Grid.Row="0"
                                           BackgroundColor="#BBBBBB"
                                           WidthRequest="70"
                                           HeightRequest="70"
                                           VerticalOptions="Center"
                                           Padding="0" />

                    <material:MaterialCard CornerRadius="4"
                                           Elevation="1"
                                           Grid.Column="2"
                                           Grid.Row="0"
                                           BackgroundColor="#BBBBBB"
                                           WidthRequest="70"
                                           HeightRequest="70"
                                           VerticalOptions="Center"
                                           Padding="0" />

                    <material:MaterialCard CornerRadius="4"
                                           Elevation="1"
                                           Grid.Column="0"
                                           Grid.Row="1"
                                           BackgroundColor="#BBBBBB"
                                           WidthRequest="70"
                                           HeightRequest="70"
                                           VerticalOptions="Center"
                                           Padding="0" />

                    <material:MaterialCard CornerRadius="4"
                                           Elevation="1"
                                           Grid.Column="2"
                                           Grid.Row="1"
                                           BackgroundColor="#F65864"
                                           WidthRequest="70"
                                           HeightRequest="70"
                                           VerticalOptions="Center"
                                           Padding="0">
                        <RelativeLayout HorizontalOptions="FillAndExpand"
                                        VerticalOptions="FillAndExpand">
                            <Label RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Height,Factor=0,Constant=5}"
                                   RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Width,Factor=0,Constant=10}"
                                   Text="1"
                                   FontAttributes="Bold"
                                   VerticalOptions="Center"
                                   HorizontalOptions="Start"
                                   TextColor="White"
                                   Rotation="-45" />
                            <Image RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Height,Factor=0,Constant=15}"
                                   RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Width,Factor=0,Constant=5}"
                                   RelativeLayout.WidthConstraint="{ConstraintExpression
                                    Type=RelativeToParent,Property=Width,Factor=1,Constant=-10}"
                                   RelativeLayout.HeightConstraint="{ConstraintExpression
                                    Type=RelativeToParent,Property=Height,Factor=1,Constant=-30}"
                                   Source="qr_icon"
                                   VerticalOptions="Center"
                                   HorizontalOptions="Center"
                                   WidthRequest="32"
                                   HeightRequest="32"
                                   Rotation="-45" />
                        </RelativeLayout>
                    </material:MaterialCard>

                    <material:MaterialCard CornerRadius="4"
                                           Elevation="1"
                                           Grid.Column="0"
                                           Grid.Row="2"
                                           BackgroundColor="#004A57"
                                           WidthRequest="70"
                                           HeightRequest="70"
                                           VerticalOptions="Center"
                                           Padding="0">
                        <RelativeLayout HorizontalOptions="FillAndExpand"
                                        VerticalOptions="FillAndExpand">
                            <Label RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Height,Factor=0,Constant=5}"
                                   RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Width,Factor=0,Constant=10}"
                                   Text="1"
                                   FontAttributes="Bold"
                                   VerticalOptions="Center"
                                   HorizontalOptions="Start"
                                   TextColor="White"
                                   Rotation="-45" />
                            <Image RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Height,Factor=0,Constant=15}"
                                   RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Width,Factor=0,Constant=5}"
                                   RelativeLayout.WidthConstraint="{ConstraintExpression
                                    Type=RelativeToParent,Property=Width,Factor=1,Constant=-10}"
                                   RelativeLayout.HeightConstraint="{ConstraintExpression
                                    Type=RelativeToParent,Property=Height,Factor=1,Constant=-30}"
                                   Source="qr_icon"
                                   VerticalOptions="Center"
                                   HorizontalOptions="Center"
                                   WidthRequest="32"
                                   HeightRequest="32"
                                   Rotation="-45" />
                        </RelativeLayout>
                    </material:MaterialCard>

                    <material:MaterialCard CornerRadius="4"
                                           Elevation="1"
                                           Grid.Column="1"
                                           Grid.Row="2"
                                           BackgroundColor="#00B97B"
                                           WidthRequest="70"
                                           HeightRequest="70"
                                           VerticalOptions="Center"
                                           Padding="0">
                        <RelativeLayout HorizontalOptions="FillAndExpand"
                                        VerticalOptions="FillAndExpand">
                            <Label RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Height,Factor=0,Constant=5}"
                                   RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Width,Factor=0,Constant=10}"
                                   Text="1"
                                   FontAttributes="Bold"
                                   VerticalOptions="Center"
                                   HorizontalOptions="Start"
                                   TextColor="White"
                                   Rotation="-45" />
                            <Image RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Height,Factor=0,Constant=15}"
                                   RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Width,Factor=0,Constant=5}"
                                   RelativeLayout.WidthConstraint="{ConstraintExpression
                                    Type=RelativeToParent,Property=Width,Factor=1,Constant=-10}"
                                   RelativeLayout.HeightConstraint="{ConstraintExpression
                                    Type=RelativeToParent,Property=Height,Factor=1,Constant=-30}"
                                   Source="qr_icon"
                                   VerticalOptions="Center"
                                   HorizontalOptions="Center"
                                   WidthRequest="32"
                                   HeightRequest="32"
                                   Rotation="-45" />
                        </RelativeLayout>
                    </material:MaterialCard>

                    <material:MaterialCard CornerRadius="4"
                                           Grid.Column="2"
                                           Grid.Row="2"
                                           BackgroundColor="#F65864"
                                           WidthRequest="70"
                                           HeightRequest="70"
                                           VerticalOptions="Center"
                                           Padding="0">
                        <RelativeLayout HorizontalOptions="FillAndExpand"
                                        VerticalOptions="FillAndExpand">
                            <Label RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Height,Factor=0,Constant=5}"
                                   RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Width,Factor=0,Constant=10}"
                                   Text="1"
                                   FontAttributes="Bold"
                                   VerticalOptions="Center"
                                   HorizontalOptions="Start"
                                   TextColor="White"
                                   Rotation="-45" />
                            <Image RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Height,Factor=0,Constant=15}"
                                   RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Width,Factor=0,Constant=5}"
                                   RelativeLayout.WidthConstraint="{ConstraintExpression
                                    Type=RelativeToParent,Property=Width,Factor=1,Constant=-10}"
                                   RelativeLayout.HeightConstraint="{ConstraintExpression
                                    Type=RelativeToParent,Property=Height,Factor=1,Constant=-30}"
                                   Source="qr_icon"
                                   VerticalOptions="Center"
                                   HorizontalOptions="Center"
                                   WidthRequest="32"
                                   HeightRequest="32"
                                   Rotation="-45" />
                        </RelativeLayout>
                    </material:MaterialCard>
                </Grid>
            </StackLayout>

            <material:MaterialCard CornerRadius="50"
                                   Elevation="1"
                                   x:Name="RatingButtonBackground"
                                   RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToView,
                            ElementName=MainContainer,Property=Height,Factor=0.59,Constant=-199}"
                                   RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToView,
                            ElementName=MainContainer,Property=Width,Factor=0.5,Constant=-34}"
                                   RelativeLayout.WidthConstraint="{ConstraintExpression
                            Type=RelativeToParent,Property=Width,Factor=0,Constant=68}"
                                   RelativeLayout.HeightConstraint="{ConstraintExpression
                            Type=RelativeToParent,Property=Height,Factor=0,Constant=245}"
                                   BackgroundColor="#007964"
                                   Opacity="0.5"
                                   IsVisible="False"
                                   Padding="0">

                <Label x:Name="RatingLabel"
                       FontSize="Medium"
                       FontAttributes="Bold"
                       VerticalOptions="Start"
                       HorizontalOptions="Center" />
            </material:MaterialCard>

            <material:MaterialCard CornerRadius="50"
                                   Elevation="1"
                                   x:Name="RatingButton"
                                   RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToView,
                            ElementName=MainContainer,Property=Height,Factor=0.61,Constant=-35}"
                                   RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToView,
                            ElementName=MainContainer,Property=Width,Factor=0.5,Constant=-35}"
                                   RelativeLayout.WidthConstraint="{ConstraintExpression
                            Type=RelativeToParent,Property=Width,Factor=0,Constant=70}"
                                   RelativeLayout.HeightConstraint="{ConstraintExpression
                            Type=RelativeToParent,Property=Height,Factor=0,Constant=70}"
                                   BackgroundColor="#004A57"
                                   Padding="2">
                <!--<material:MaterialButton.Effects>
                    <effects:LongPressedEffect />
                </material:MaterialButton.Effects>-->
            </material:MaterialCard>

            <Grid RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
                    Property=Height,Factor=1,Constant=-70}"
                  RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
                    Property=Width,Factor=0,Constant=0}"
                  RelativeLayout.WidthConstraint="{ConstraintExpression
                    Type=RelativeToParent,Property=Width,Factor=1,Constant=0}"
                  RelativeLayout.HeightConstraint="{ConstraintExpression
                    Type=RelativeToParent,Property=Height,Factor=0,Constant=70}"
                  Margin="40,0,40,0">

                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="20" />
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="20" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>

                <material:MaterialCard Grid.Column="0"
                                       BackgroundColor="#F65864"
                                       WidthRequest="70"
                                       HeightRequest="70"
                                       VerticalOptions="Center"
                                       CornerRadius="4"
                                       Elevation="1">
                    <RelativeLayout HorizontalOptions="FillAndExpand"
                                    VerticalOptions="FillAndExpand" />
                    <!--<Label RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Height,Factor=0.3,Constant=-35}"
                           RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Width,Factor=0.3,Constant=-35}"
                           Text="KREIRAJ NOVI mQR"
                           FontAttributes="Bold"
                           VerticalOptions="Start"
                           HorizontalOptions="Start"
                           TextColor="White" />-->

                </material:MaterialCard>

                <material:MaterialCard Grid.Column="2"
                                       BackgroundColor="#00B97B"
                                       WidthRequest="70"
                                       HeightRequest="70"
                                       VerticalOptions="Center"
                                       CornerRadius="4"
                                       Elevation="1">
                    <material:MaterialCard.GestureRecognizers>
                        <TapGestureRecognizer Command="{Binding ScanCommand}"/>
                    </material:MaterialCard.GestureRecognizers>
                </material:MaterialCard>

                <material:MaterialCard Grid.Column="4"
                                       BackgroundColor="#004A57"
                                       WidthRequest="70"
                                       HeightRequest="70"
                                       VerticalOptions="Center"
                                       CornerRadius="4"
                                       Elevation="1" />
            </Grid>
        </RelativeLayout>
    </ContentPage.Content>
</ContentPage>

This is how it should be

[This is how it looks like now[2]

1 Ответ

0 голосов
/ 11 июля 2019
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:material="clr-namespace:XF.Material.Forms.UI;assembly=XF.Material.Forms"
             x:Class="DunavNET.ProducPassports.Views.HomePage"
             NavigationPage.HasNavigationBar="False"
             BackgroundColor="Black">
    <ContentPage.Content>
        <RelativeLayout>
            <StackLayout x:Name="MainContainer"
                         RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
                     Property=Height,Factor=0.1,Constant=0}"
                         RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
                     Property=Width,Factor=0,Constant=0}"
                         RelativeLayout.WidthConstraint="{ConstraintExpression
                    Type=RelativeToParent,Property=Width,Factor=1,Constant=0}"
                         RelativeLayout.HeightConstraint="{ConstraintExpression
                    Type=RelativeToParent,Property=Height,Factor=1,Constant=-70}">

                <Grid VerticalOptions="CenterAndExpand"
                      HorizontalOptions="CenterAndExpand"
                      Rotation="45">
                    <!--Margin="0,-240,0,0">-->
                    <Grid.RowDefinitions>
                        <RowDefinition Height="70" />
                        <RowDefinition Height="70" />
                        <RowDefinition Height="70" />
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="70" />
                        <ColumnDefinition Width="70" />
                        <ColumnDefinition Width="70" />
                    </Grid.ColumnDefinitions>

                    <material:MaterialCard CornerRadius="4"
                                           Elevation="1"
                                           Grid.Column="0"
                                           Grid.Row="0"
                                           BackgroundColor="#BBBBBB"
                                           WidthRequest="70"
                                           HeightRequest="70"
                                           VerticalOptions="Center"
                                           Padding="0" />

                    <material:MaterialCard CornerRadius="4"
                                           Elevation="1"
                                           Grid.Column="1"
                                           Grid.Row="0"
                                           BackgroundColor="#BBBBBB"
                                           WidthRequest="70"
                                           HeightRequest="70"
                                           VerticalOptions="Center"
                                           Padding="0" />

                    <material:MaterialCard CornerRadius="4"
                                           Elevation="1"
                                           Grid.Column="2"
                                           Grid.Row="0"
                                           BackgroundColor="#BBBBBB"
                                           WidthRequest="70"
                                           HeightRequest="70"
                                           VerticalOptions="Center"
                                           Padding="0" />

                    <material:MaterialCard CornerRadius="4"
                                           Elevation="1"
                                           Grid.Column="0"
                                           Grid.Row="1"
                                           BackgroundColor="#BBBBBB"
                                           WidthRequest="70"
                                           HeightRequest="70"
                                           VerticalOptions="Center"
                                           Padding="0" />

                    <material:MaterialCard CornerRadius="4"
                                           Elevation="1"
                                           Grid.Column="2"
                                           Grid.Row="1"
                                           BackgroundColor="#F65864"
                                           WidthRequest="70"
                                           HeightRequest="70"
                                           VerticalOptions="Center"
                                           Padding="0">
                        <RelativeLayout HorizontalOptions="FillAndExpand"
                                        VerticalOptions="FillAndExpand">
                            <Label RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Height,Factor=0,Constant=5}"
                                   RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Width,Factor=0,Constant=10}"
                                   Text="1"
                                   FontAttributes="Bold"
                                   VerticalOptions="Center"
                                   HorizontalOptions="Start"
                                   TextColor="White"
                                   Rotation="-45" />
                            <Image RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Height,Factor=0,Constant=15}"
                                   RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Width,Factor=0,Constant=5}"
                                   RelativeLayout.WidthConstraint="{ConstraintExpression
                                    Type=RelativeToParent,Property=Width,Factor=1,Constant=-10}"
                                   RelativeLayout.HeightConstraint="{ConstraintExpression
                                    Type=RelativeToParent,Property=Height,Factor=1,Constant=-30}"
                                   Source="qr_icon"
                                   VerticalOptions="Center"
                                   HorizontalOptions="Center"
                                   WidthRequest="32"
                                   HeightRequest="32"
                                   Rotation="-45" />
                        </RelativeLayout>
                    </material:MaterialCard>

                    <material:MaterialCard CornerRadius="4"
                                           Elevation="1"
                                           Grid.Column="0"
                                           Grid.Row="2"
                                           BackgroundColor="#004A57"
                                           WidthRequest="70"
                                           HeightRequest="70"
                                           VerticalOptions="Center"
                                           Padding="0">
                        <RelativeLayout HorizontalOptions="FillAndExpand"
                                        VerticalOptions="FillAndExpand">
                            <Label RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Height,Factor=0,Constant=5}"
                                   RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Width,Factor=0,Constant=10}"
                                   Text="1"
                                   FontAttributes="Bold"
                                   VerticalOptions="Center"
                                   HorizontalOptions="Start"
                                   TextColor="White"
                                   Rotation="-45" />
                            <Image RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Height,Factor=0,Constant=15}"
                                   RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Width,Factor=0,Constant=5}"
                                   RelativeLayout.WidthConstraint="{ConstraintExpression
                                    Type=RelativeToParent,Property=Width,Factor=1,Constant=-10}"
                                   RelativeLayout.HeightConstraint="{ConstraintExpression
                                    Type=RelativeToParent,Property=Height,Factor=1,Constant=-30}"
                                   Source="qr_icon"
                                   VerticalOptions="Center"
                                   HorizontalOptions="Center"
                                   WidthRequest="32"
                                   HeightRequest="32"
                                   Rotation="-45" />
                        </RelativeLayout>
                    </material:MaterialCard>

                    <material:MaterialCard CornerRadius="4"
                                           Elevation="1"
                                           Grid.Column="1"
                                           Grid.Row="2"
                                           BackgroundColor="#00B97B"
                                           WidthRequest="70"
                                           HeightRequest="70"
                                           VerticalOptions="Center"
                                           Padding="0">
                        <RelativeLayout HorizontalOptions="FillAndExpand"
                                        VerticalOptions="FillAndExpand">
                            <Label RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Height,Factor=0,Constant=5}"
                                   RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Width,Factor=0,Constant=10}"
                                   Text="1"
                                   FontAttributes="Bold"
                                   VerticalOptions="Center"
                                   HorizontalOptions="Start"
                                   TextColor="White"
                                   Rotation="-45" />
                            <Image RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Height,Factor=0,Constant=15}"
                                   RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Width,Factor=0,Constant=5}"
                                   RelativeLayout.WidthConstraint="{ConstraintExpression
                                    Type=RelativeToParent,Property=Width,Factor=1,Constant=-10}"
                                   RelativeLayout.HeightConstraint="{ConstraintExpression
                                    Type=RelativeToParent,Property=Height,Factor=1,Constant=-30}"
                                   Source="qr_icon"
                                   VerticalOptions="Center"
                                   HorizontalOptions="Center"
                                   WidthRequest="32"
                                   HeightRequest="32"
                                   Rotation="-45" />
                        </RelativeLayout>
                    </material:MaterialCard>

                    <material:MaterialCard CornerRadius="4"
                                           Grid.Column="2"
                                           Grid.Row="2"
                                           BackgroundColor="#F65864"
                                           WidthRequest="70"
                                           HeightRequest="70"
                                           VerticalOptions="Center"
                                           Padding="0">
                        <RelativeLayout HorizontalOptions="FillAndExpand"
                                        VerticalOptions="FillAndExpand">
                            <Label RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Height,Factor=0,Constant=5}"
                                   RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Width,Factor=0,Constant=10}"
                                   Text="1"
                                   FontAttributes="Bold"
                                   VerticalOptions="Center"
                                   HorizontalOptions="Start"
                                   TextColor="White"
                                   Rotation="-45" />
                            <Image RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Height,Factor=0,Constant=15}"
                                   RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Width,Factor=0,Constant=5}"
                                   RelativeLayout.WidthConstraint="{ConstraintExpression
                                    Type=RelativeToParent,Property=Width,Factor=1,Constant=-10}"
                                   RelativeLayout.HeightConstraint="{ConstraintExpression
                                    Type=RelativeToParent,Property=Height,Factor=1,Constant=-30}"
                                   Source="qr_icon"
                                   VerticalOptions="Center"
                                   HorizontalOptions="Center"
                                   WidthRequest="32"
                                   HeightRequest="32"
                                   Rotation="-45" />
                        </RelativeLayout>
                    </material:MaterialCard>
                </Grid>
            </StackLayout>

            <StackLayout>
                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="50" />
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="*" />
                    </Grid.ColumnDefinitions>

                    <StackLayout BackgroundColor="#004A57"
                                 Orientation="Horizontal"
                                 Grid.Row="0"
                                 Grid.Column="0"
                                 Grid.ColumnSpan="2">
                        <Image Source="user.png"
                               HorizontalOptions="Start"
                               VerticalOptions="CenterAndExpand"
                               Margin="20,0,10,0">
                            <Image.GestureRecognizers>
                                <TapGestureRecognizer Command="{Binding ShowAccountInformationCommand}" />
                            </Image.GestureRecognizers>
                        </Image>

                        <Image Source="kliker1.png"
                               HorizontalOptions="Start"
                               VerticalOptions="CenterAndExpand"
                               HeightRequest="16"
                               WidthRequest="16"
                               Margin="20,0,0,0" />

                        <Image Source="kliker2.png"
                               HorizontalOptions="Start"
                               VerticalOptions="CenterAndExpand"
                               HeightRequest="16"
                               WidthRequest="16"
                               Margin="10,0,10,0" />

                        <Image Source="kliker3.png"
                               HorizontalOptions="StartAndExpand"
                               VerticalOptions="CenterAndExpand"
                               HeightRequest="16"
                               WidthRequest="16"
                               Margin="0,0,20,0" />

                        <Image Source="search.png"
                               HorizontalOptions="EndAndExpand"
                               VerticalOptions="CenterAndExpand"
                               Margin="0,0,20,0" />
                    </StackLayout>

                    <Grid IsVisible="{Binding Visibility}"
                          Grid.Row="1"
                          Grid.Column="0">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="50" />
                            <RowDefinition Height="50" />
                            <RowDefinition Height="50" />
                            <RowDefinition Height="50" />
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*" />
                            <ColumnDefinition Width="*" />
                        </Grid.ColumnDefinitions>

                        <StackLayout Grid.Row="0"
                                     Grid.Column="0"
                                     Grid.ColumnSpan="2"
                                     BackgroundColor="#004A57"
                                     MinimumHeightRequest="40">
                            <Label Text="Avatar&#x0a;Avatarevic"
                                   TextColor="White"
                                   VerticalOptions="CenterAndExpand"
                                   Margin="10,0,0,0" />
                        </StackLayout>

                        <StackLayout Grid.Row="1"
                                     Grid.Column="0"
                                     Grid.ColumnSpan="2"
                                     BackgroundColor="#004A57"
                                     MinimumHeightRequest="40">
                            <Label Text="STATUS"
                                   TextColor="White"
                                   VerticalOptions="CenterAndExpand"
                                   Margin="10,0,0,0" />
                        </StackLayout>

                        <StackLayout Grid.Row="2"
                                     Grid.Column="0"
                                     Grid.ColumnSpan="2"
                                     BackgroundColor="#004A57"
                                     MinimumHeightRequest="40">
                            <Label Text="UTICAJ"
                                   TextColor="White"
                                   VerticalOptions="CenterAndExpand"
                                   Margin="10,0,0,0" />
                        </StackLayout>

                        <StackLayout Grid.Row="3"
                                     Grid.Column="0"
                                     Grid.ColumnSpan="2"
                                     BackgroundColor="#004A57"
                                     MinimumHeightRequest="40">
                            <Label Text="TOTAL"
                                   TextColor="White"
                                   VerticalOptions="CenterAndExpand"
                                   Margin="10,0,0,0" />
                        </StackLayout>
                    </Grid>
                </Grid>
            </StackLayout>

            <material:MaterialCard CornerRadius="50"
                                   Elevation="1"
                                   x:Name="RatingButtonBackground"
                                   RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToView,
                            ElementName=MainContainer,Property=Height,Factor=0.59,Constant=-199}"
                                   RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToView,
                            ElementName=MainContainer,Property=Width,Factor=0.5,Constant=-34}"
                                   RelativeLayout.WidthConstraint="{ConstraintExpression
                            Type=RelativeToParent,Property=Width,Factor=0,Constant=68}"
                                   RelativeLayout.HeightConstraint="{ConstraintExpression
                            Type=RelativeToParent,Property=Height,Factor=0,Constant=245}"
                                   BackgroundColor="#007964"
                                   Opacity="0.5"
                                   IsVisible="False"
                                   Padding="0">

                <Label x:Name="RatingLabel"
                       FontSize="Medium"
                       FontAttributes="Bold"
                       VerticalOptions="Start"
                       HorizontalOptions="Center" />
            </material:MaterialCard>

            <material:MaterialCard CornerRadius="50"
                                   Elevation="1"
                                   x:Name="RatingButton"
                                   RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToView,
                            ElementName=MainContainer,Property=Height,Factor=0.61,Constant=-35}"
                                   RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToView,
                            ElementName=MainContainer,Property=Width,Factor=0.5,Constant=-35}"
                                   RelativeLayout.WidthConstraint="{ConstraintExpression
                            Type=RelativeToParent,Property=Width,Factor=0,Constant=70}"
                                   RelativeLayout.HeightConstraint="{ConstraintExpression
                            Type=RelativeToParent,Property=Height,Factor=0,Constant=70}"
                                   BackgroundColor="#004A57"
                                   Padding="2">
                <!--<material:MaterialButton.Effects>
                    <effects:LongPressedEffect />
                </material:MaterialButton.Effects>-->
            </material:MaterialCard>

            <Grid RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
                    Property=Height,Factor=1,Constant=-70}"
                  RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
                    Property=Width,Factor=0,Constant=0}"
                  RelativeLayout.WidthConstraint="{ConstraintExpression
                    Type=RelativeToParent,Property=Width,Factor=1,Constant=0}"
                  RelativeLayout.HeightConstraint="{ConstraintExpression
                    Type=RelativeToParent,Property=Height,Factor=0,Constant=70}"
                  Margin="40,0,40,0">

                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="20" />
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="20" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>

                <material:MaterialCard Grid.Column="0"
                                       BackgroundColor="#F65864"
                                       WidthRequest="70"
                                       HeightRequest="70"
                                       VerticalOptions="Center"
                                       CornerRadius="4"
                                       Elevation="1">
                    <RelativeLayout HorizontalOptions="FillAndExpand"
                                    VerticalOptions="FillAndExpand" />
                    <material:MaterialCard.GestureRecognizers>
                        <TapGestureRecognizer Command="{Binding CreateTableCommand}" />
                    </material:MaterialCard.GestureRecognizers>
                    <!--<Label RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Height,Factor=0.3,Constant=-35}"
                           RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
                                    Property=Width,Factor=0.3,Constant=-35}"
                           Text="KREIRAJ NOVI mQR"
                           FontAttributes="Bold"
                           VerticalOptions="Start"
                           HorizontalOptions="Start"
                           TextColor="White" />-->

                </material:MaterialCard>

                <material:MaterialCard Grid.Column="2"
                                       BackgroundColor="#00B97B"
                                       WidthRequest="70"
                                       HeightRequest="70"
                                       VerticalOptions="Center"
                                       CornerRadius="4"
                                       Elevation="1">
                    <material:MaterialCard.GestureRecognizers>
                        <TapGestureRecognizer Command="{Binding ScanCommand}" />
                    </material:MaterialCard.GestureRecognizers>
                </material:MaterialCard>

                <material:MaterialCard Grid.Column="4"
                                       BackgroundColor="#004A57"
                                       WidthRequest="70"
                                       HeightRequest="70"
                                       VerticalOptions="Center"
                                       CornerRadius="4"
                                       Elevation="1" />
            </Grid>
        </RelativeLayout>
    </ContentPage.Content>
</ContentPage>
...