Question how can i make those frame box to be at the center of main white frame?

Abba34

Abba34

Member
Joined
Jul 27, 2022
Messages
7
Programming Experience
5-10
XML: 
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="[URL='http://xamarin.com/schemas/2014/forms']Xamarin | Open-source mobile app platform for .NET[/URL]"
             xmlns:x="[URL]http://schemas.microsoft.com/winfx/2009/xaml[/URL]"
             x:Class="Nigerian_Navy.Home" NavigationPage.HasNavigationBar="False" BackgroundColor="Blue">

    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="25"/>
            <RowDefinition Height="75" />
        </Grid.RowDefinitions>
      
      
    
            <Grid Grid.Row="1">
            <Label Text="Dashboard" FontSize="30" TextColor="White" FontAttributes="Bold" />
            </Grid>
      
      

        <Frame CornerRadius="12" BackgroundColor="White"  Grid.Row="2" >
            <Grid>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="120"/>
                    <ColumnDefinition Width="120"/>

                </Grid.ColumnDefinitions>

                <Grid.RowDefinitions>
                    <RowDefinition Height="100"/>
                    <RowDefinition Height="100"/>
                    <RowDefinition Height="100"/>

                </Grid.RowDefinitions>


              
                    <Grid Grid.Row="0" Grid.Column="0" >
                        <Frame CornerRadius="9">
                            <StackLayout>
                                <Image Source="Admin.png" HeightRequest="55" WidthRequest="45"/>
                                <Label Text="Staff Officers" FontSize="10" HorizontalOptions="Center" FontAttributes="Bold"/>
                                <BoxView></BoxView>
                            </StackLayout>
                        </Frame>
                    </Grid>



                    <Grid Grid.Row="0" Grid.Column="1" >
                        <Frame CornerRadius="9">
                            <StackLayout Spacing="8">
                                <Image Source="Contact.png" HeightRequest="55" WidthRequest="45"/>
                                <Label Text="Complain" FontSize="10" HorizontalOptions="Center" FontAttributes="Bold"/>
                                <BoxView></BoxView>
                            </StackLayout>
                        </Frame>
                    </Grid>


                    <Grid Grid.Row="1" Grid.Column="0" >
                        <Frame CornerRadius="9">
                            <StackLayout Spacing="8">
                                <Image Source="Location.png" HeightRequest="55" WidthRequest="45"/>
                                <Label Text="Tracking" FontSize="10" HorizontalOptions="Center" FontAttributes="Bold"/>
                                <BoxView></BoxView>
                            </StackLayout>
                        </Frame>
                    </Grid>


                    <Grid Grid.Row="1" Grid.Column="1"  >
                        <Frame CornerRadius="9">
                            <StackLayout Spacing="8">
                                <Image Source="Navy1.png" HeightRequest="55" WidthRequest="45"/>
                                <Label Text="About Us" FontSize="10" HorizontalOptions="Center" FontAttributes="Bold"/>
                                <BoxView></BoxView>
                            </StackLayout>
                        </Frame>
                    </Grid>


                    <Grid Grid.Row="2" Grid.Column="0" >
                        <Frame CornerRadius="9">
                            <StackLayout Spacing="8">
                                <Image Source="Nigeria.png" HeightRequest="55" WidthRequest="45"/>
                                <Label Text="Personel" FontSize="10" HorizontalOptions="Center" FontAttributes="Bold"/>
                                <BoxView></BoxView>
                            </StackLayout>
                        </Frame>
                    </Grid>


                    <Grid Grid.Row="2" Grid.Column="1" >
                        <Frame CornerRadius="9">
                            <StackLayout Spacing="8">
                                <Image Source="Navy.png" HeightRequest="55" WidthRequest="45"/>
                                <Label Text="Media Platform" FontSize="10" HorizontalOptions="Center" FontAttributes="Bold"/>
                                <BoxView></BoxView>
                            </StackLayout>
                        </Frame>
                    </Grid>



        
            </Grid>
        </Frame>


    </Grid>
</ContentPage>
 
Last edited by a moderator:
Sort by date Sort by votes
There's a lot wrong here.
  • Please don't post unformatted code snippets. They are too hard to read.
  • A post that contains nothing but code is not acceptable. You need to provide a FULL and CLEAR explanation of the problem. For a UI question like this one, it seems like a screenshot would help make things significantly clearer. The title should be a brief summary of what's in the post, not the entire explanation.
  • Please post in the most appropriate forum for the topic, not the first one in the list. The VS General forum is for questions about the VS IDE. If you have a Xamarin Forms question, post it in the Xamarin Forms forum.
 
Upvote -1 Downvote
jmcilhinney said:
There's a lot wrong here.
  • Please don't post unformatted code snippets. They are too hard to read.
  • A post that contains nothing but code is not acceptable. You need to provide a FULL and CLEAR explanation of the problem. For a UI question like this one, it seems like a screenshot would help make things significantly clearer. The title should be a brief summary of what's in the post, not the entire explanation.
  • Please post in the most appropriate forum for the topic, not the first one in the list. The VS General forum is for questions about the VS IDE. If you have a Xamarin Forms question, post it in the Xamarin Forms forum.
Click to expand...
Ok
jmcilhinney said:
There's a lot wrong here.
  • Please don't post unformatted code snippets. They are too hard to read.
  • A post that contains nothing but code is not acceptable. You need to provide a FULL and CLEAR explanation of the problem. For a UI question like this one, it seems like a screenshot would help make things significantly clearer. The title should be a brief summary of what's in the post, not the entire explanation.
  • Please post in the most appropriate forum for the topic, not the first one in the list. The VS General forum is for questions about the VS IDE. If you have a Xamarin Forms question, post it in the Xamarin Forms forum.
Click to expand...
Ok I will correct it thanks you
 
Upvote 0 Downvote
I moved this thread to the correct forum (I should have mentioned that) and I fixed your code formatting for you, then you went and created a duplicate thread and didn't format the code properly again. That's four threads now and not a decent one among them. I have deleted that new thread. Please update this thread with the requested FULL and CLEAR explanation of the problem, including relevant screenshots.
 
Upvote 0 Downvote
Dashboard:
how can I make it well cleared
XML:
C#: 
<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="Xamarin | Open-source mobile app platform for .NET"
 xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="Nigerian_Navy.Home" NavigationPage.HasNavigationBar="False" BackgroundColor="Blue">

<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="25"/>
<RowDefinition Height="75" />
</Grid.RowDefinitions>
     
     
   
<Grid Grid.Row="1">
<Label Text="Dashboard" FontSize="30" TextColor="White" FontAttributes="Bold" />
</Grid>
     
     

<Frame CornerRadius="12" BackgroundColor="White"  Grid.Row="2" >
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="120"/>
 <ColumnDefinition Width="120"/>

 </Grid.ColumnDefinitions>

<Grid.RowDefinitions>
<RowDefinition Height="100"/>
<RowDefinition Height="100"/>
 <RowDefinition Height="100"/>

 </Grid.RowDefinitions>


             
<Grid Grid.Row="0" Grid.Column="0" >
<Frame CornerRadius="9">
<StackLayout>
<Image Source="Admin.png" HeightRequest="55" WidthRequest="45"/>
<Label Text="Staff Officers" FontSize="10" HorizontalOptions="Center" FontAttributes="Bold"/>
 <BoxView></BoxView>
</StackLayout>
</Frame>
 </Grid>



<Grid Grid.Row="0" Grid.Column="1" >
<Frame CornerRadius="9">
<StackLayout Spacing="8">
<Image Source="Contact.png" HeightRequest="55" WidthRequest="45"/>
<Label Text="Complain" FontSize="10" HorizontalOptions="Center" FontAttributes="Bold"/>
 <BoxView></BoxView>
</StackLayout>
</Frame>
 </Grid>


<Grid Grid.Row="1" Grid.Column="0" >
<Frame CornerRadius="9">
<StackLayout Spacing="8">
<Image Source="Location.png" HeightRequest="55" WidthRequest="45"/>
<Label Text="Tracking" FontSize="10" HorizontalOptions="Center" FontAttributes="Bold"/>
 <BoxView></BoxView>
</StackLayout>
</Frame>
 </Grid>


<Grid Grid.Row="1" Grid.Column="1"  >
<Frame CornerRadius="9">
<StackLayout Spacing="8">
<Image Source="Navy1.png" HeightRequest="55" WidthRequest="45"/>
<Label Text="About Us" FontSize="10" HorizontalOptions="Center" FontAttributes="Bold"/>
 <BoxView></BoxView>
</StackLayout>
</Frame>
 </Grid>


<Grid Grid.Row="2" Grid.Column="0" >
<Frame CornerRadius="9">
<StackLayout Spacing="8">
<Image Source="Nigeria.png" HeightRequest="55" WidthRequest="45"/>
<Label Text="Personel" FontSize="10" HorizontalOptions="Center" FontAttributes="Bold"/>
 <BoxView></BoxView>
</StackLayout>
</Frame>
 </Grid>


<Grid Grid.Row="2" Grid.Column="1" >
<Frame CornerRadius="9">
<StackLayout Spacing="8">
<Image Source="Navy.png" HeightRequest="55" WidthRequest="45"/>
<Label Text="Media Platform" FontSize="10" HorizontalOptions="Center" FontAttributes="Bold"/>
 <BoxView></BoxView>
</StackLayout>
</Frame>
 </Grid>



       
</Grid>
 </Frame>


</Grid>
</ContentPage>
 

Attachments

  • Screenshot_20220807-120244.png
    Screenshot_20220807-120244.png
    68.6 KB · Views: 15
Last edited by a moderator:
Upvote 0 Downvote
And back again to unformatted code... *Sigh*

Going to edit post above to put the code into code tags...
 
Upvote 0 Downvote
Notice how you were using a StackLayout to do some centering within the cells of your grid? You do the same thing by putting the outermost grid within a StackLayout and apply the same kind of centering.
 
Upvote 0 Downvote

Similar threads

JiMMy2024
  • Question
A MAUI application looks great in Android but terrible in iOS
Replies
0
Views
217
JiMMy2024
JiMMy2024
S
  • Question
Question How to move text to a new line on the phone?
Replies
0
Views
513
StarLight
S
S
  • Question
Question send Sum of collectionview field to an other field
Replies
7
Views
2K
Supermack
S
D
  • Question
Question CollectionView iOS - not all items visible
Replies
0
Views
2K
DarthSerpical
D
gciraman2024
  • Question
How to reproduce wpf ui control on a form from the mock-up?
Replies
0
Views
429
gciraman2024
gciraman2024

Share this page

Latest posts

Back
Top Bottom